mediaAll/src/view/allMedia/components/reporting_list.vue

<template>
  <div class="mainTitle">
    文章列表
  </div>
  <br />
  <div class="lists">
    <!-- @click="() => toDetail(item)" -->
    <el-table :data="listTable" style="width: 100%">
      <el-table-column prop="title" label="标题" width="450px" />
      <el-table-column prop="phone" label="用户名" />
      <el-table-column prop="source" label="来源">
        <template #default="scope"> 
            {{source[scope.row.source - 1]}}
        </template>
      </el-table-column>
      <el-table-column prop="" label="回复状态" >
        <template #default="scope"> 
            {{replyFlag[scope.row.replyFlag]}}
        </template>
      </el-table-column>
      <el-table-column prop="createTime" label="更新时间" >
        <template #default="scope"> 
            {{format(scope.row.createTime)}}
        </template>
      </el-table-column>
      <el-table-column prop="modifyTime" label="推送时间" >
        <template #default="scope"> 
            {{format(scope.row.modifyTime)}}
        </template>
      </el-table-column>
      <el-table-column prop="" label="报料类型" />
      <el-table-column prop="clueInfoCount" label="数量" />
      <el-table-column prop="" label="操作" />
    </el-table>
  </div>
</template>

<script setup>
import { ref, defineExpose } from 'vue';
// import { useRouter } from 'vue-router';
import dayjs from "dayjs";
import { getreporting } from '../../../api/index';
let T = undefined;
let total = -1;
// const router = useRouter();
const listTable = ref([]);
const source = ['热线电话','微信公众号','app', '小程序'];
const replyFlag = ['未回复', '已回复'];
const format = value => {
    return dayjs(value).format('YYYY-MM-DD HH:mm:ss')
}
// const toDetail = item => {
//   router.push({
//     path: '/analysis_detail',
//     query: {
//       detail: JSON.stringify(item),
//     },
//   });
// };
const getlist = search => {
  if (search.page === 1) {
    listTable.value = [];
    total = -1;
  } else if ((search.page - 1) * search.pageSize >= total) return;

  if (T) T = window.clearTimeout(T);
  T = window.setTimeout(() => {
    getreporting({
      data: search,
    })
      .then(res => {
        const li = res.records || [];
        listTable.value.push(...li);
        total = res.total || 0;
        if (T) T = window.clearTimeout(T);
      })
      .catch(() => {
        if (T) T = window.clearTimeout(T);
      });
  }, 200);
};

defineExpose({
  getlist,
});
</script>

<style scoped>
.mainTitle {
  padding: 0 20px;
  position: relative;
  line-height: 60px;
  border-bottom: 1px solid #f5f5f5;
}

.lists {
  padding: 0.5em;
}

.list {
  border-radius: 5px;
  padding: 0.5em;
  cursor: pointer;
  line-height: 1.8em;
  font-size: 16px;
}
.list:hover {
  background-color: rgba(64, 158, 255, 0.1);
}
.list:not(:last-child) {
  border-bottom: 1px dashed #b9c0d3;
}
</style>