tnc-fe/src/views/company/CompanyTaskList0219.vue

<template>
  <a-spin :spinning="pdfLoading" size="large" tip="正在生成pdf，请勿刷新页面">
    <div>
      <a-page-header
        style="background-color: #FFFFFF;"
        :title="'客户信息'"
        sub-title=""
        @back="showTaskList"
      >
        <a-button style="left: 1%;position: relative" type="primary" @click="exportToWord">导出PDF</a-button>
        <div id="pdfHtml">
          <a-card :bordered="false" style="margin-top: 10px;">
            <div slot="title">
              <span style="float: left;position: relative;top: 4px;color: #1890FF">1、客户经理：崔小亮   </span>
              <span style="float: left;position: relative;top: 4px;left: 20px;color: #1890FF">工号：B06530</span>
              <span style="float: left;position: relative;top: 4px;left: 40px;color: #1890FF">联系方式：18406573912</span>
            </div>

            <a-descriptions title="客户名称：测试" style="left: 3%;top:2%;position: relative;">
              <a-descriptions-item label="稽核类型">物联网</a-descriptions-item>
              <a-descriptions-item label="所属任务">测试1</a-descriptions-item>
              <a-descriptions-item label="创建时间">2024-01-01 02:58:58</a-descriptions-item>
              <a-descriptions-item label="稽核状态">待整改</a-descriptions-item>
              <a-descriptions-item label="用户编号">400018080223</a-descriptions-item>
            </a-descriptions>

            <a-divider style="left: 3%;position: relative;font-weight:400;color: rgb(55 53 53 / 85%)"
                       orientation="left">
              工作信息
            </a-divider>

            <a-list style="left: 3%;position: relative;width: 98%" size="small" bordered>
              <a-list-item>24-01-16 10:27 崔小亮：提交了客户名称【测试1】的资料</a-list-item>
              <a-list-item>24-01-16 10:30 刘婷婷：退回客户名称【测试】的资料</a-list-item>
            </a-list>

            <a-divider/>


            <a-descriptions title="客户名称：	1223测试" style="left: 3%;top:2%;position: relative;">
              <a-descriptions-item label="稽核类型">物联网</a-descriptions-item>
              <a-descriptions-item label="所属任务">1223测试</a-descriptions-item>
              <a-descriptions-item label="创建时间">2024-01-11 03:06:12</a-descriptions-item>
              <a-descriptions-item label="稽核状态">通过</a-descriptions-item>
              <a-descriptions-item label="用户编号">400018080223</a-descriptions-item>
            </a-descriptions>

            <a-divider style="left: 3%;position: relative;font-weight:400;color: rgb(55 53 53 / 85%)"
                       orientation="left">
              工作信息
            </a-divider>

            <a-list style="left: 3%;position: relative;width: 98%" size="small" bordered>
              <a-list-item>24-01-16 11:27 崔小亮：提交客户名称【1223测试】的资料</a-list-item>
              <a-list-item>24-01-16 11:31 刘婷婷：退回客户名称【1223测试】的资料</a-list-item>
              <a-list-item>24-01-16 11:33 崔小亮：整改客户名称【1223测试】的资料</a-list-item>
              <a-list-item>24-01-16 11:31 刘婷婷：通过客户名称【1223测试】的资料</a-list-item>
            </a-list>


            <a-divider/>


            <a-descriptions title="客户名称：	测试0111" style="left: 3%;top:2%;position: relative;">
              <a-descriptions-item label="稽核类型">物联网</a-descriptions-item>
              <a-descriptions-item label="所属任务">测试0111</a-descriptions-item>
              <a-descriptions-item label="创建时间">2024-01-11 09:00:54</a-descriptions-item>
              <a-descriptions-item label="稽核状态">通过</a-descriptions-item>
              <a-descriptions-item label="用户编号">400018080223</a-descriptions-item>
            </a-descriptions>

            <a-divider style="left: 3%;position: relative;font-weight:400;color: rgb(55 53 53 / 85%)"
                       orientation="left">
              工作信息
            </a-divider>

            <a-list style="left: 3%;position: relative;width: 98%" size="small" bordered>
              <a-list-item>24-01-12 16:01 崔小亮：提交客户名称【1223测试】的资料</a-list-item>
              <a-list-item>24-01-12 16:05 刘婷婷：退回客户名称【1223测试】的资料</a-list-item>
              <a-list-item>24-01-12 16:10 崔小亮：整改客户名称【1223测试】的资料</a-list-item>
              <a-list-item>24-01-12 16:21 刘婷婷：通过客户名称【1223测试】的资料</a-list-item>
            </a-list>

          </a-card>
          <a-card :bordered="false" style="margin-top: 10px;">
            <div slot="title">
              <span style="float: left;position: relative;top: 4px;color: #1890FF">2、客户经理：张雪   </span>
              <span style="float: left;position: relative;top: 4px;left: 20px;color: #1890FF">工号：C0157101</span>
              <span style="float: left;position: relative;top: 4px;left: 40px;color: #1890FF">联系方式：18010135831</span>
            </div>


            <a-descriptions title="客户名称：测试222" style="left: 3%;top:2%;position: relative;">
              <a-descriptions-item label="稽核类型">行短</a-descriptions-item>
              <a-descriptions-item label="所属任务">测试222</a-descriptions-item>
              <a-descriptions-item label="创建时间">2023-12-22 10:24:46</a-descriptions-item>
              <a-descriptions-item label="稽核状态">未处理</a-descriptions-item>
              <a-descriptions-item label="用户编号">400018080223</a-descriptions-item>
            </a-descriptions>

            <a-divider style="left: 3%;position: relative;font-weight:400;color: rgb(55 53 53 / 85%)"
                       orientation="left">
              工作信息
            </a-divider>

            <a-list style="left: 3%;position: relative;width: 98%" size="small" bordered>
              <a-list-item>暂无相关信息</a-list-item>
            </a-list>


          </a-card>
        </div>


      </a-page-header>
    </div>
  </a-spin>

</template>
<script>
import CompanyCheckCheck from "@views/company/CompanyCheckCheck";
import CompanyCheckDetail from "@views/company/CompanyCheckDetail";
import {getAction} from "@api/manage";
import {JeecgListMixin} from "@/mixins/JeecgListMixin";
import {mixinDevice} from "@/utils/mixin";

import html2Canvas from 'html2canvas'
import {getPdf} from '@/utils/htmlToPdf'

export default {
  name: 'CompanyTaskList',
  mixins: [JeecgListMixin, mixinDevice],
  components: {
    CompanyCheckCheck,
    CompanyCheckDetail,
  },
  props: {
    taskInfo: {
      type: Object,
      require: true
    }
  },
  filters: {
    statusTypeFilter(type) {
      const statusTypeMap = {
        '0': 'error',
        '1': 'error',
        '2': 'warning',
        '3': 'warning',
        '4': 'processing',
        '5': 'success'
      }
      return statusTypeMap[type]
    },
    statusFilter(status) {
      const statusMap = {
        '0': '未处理',
        '1': '未完善',
        '2': '待稽核',
        '3': '待稽核',
        '4': '待整改',
        '5': '通过'
      }
      return statusMap[status]
    }
  },
  data() {
    return {
      data1: ["23-12-22 10:27 张雪：提交了客户名称【测试】的资料",
        "23-12-22 10:30 管理员：对客户名称【测试】的资料进行退回",
      ],
      labelCol4: {
        labelCol: {
          xs: {span: 24},
          sm: {span: 8},
        },
        wrapperCol: {
          xs: {span: 24},
          sm: {span: 14},
        }
      },
      pdfLoading: false,
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: "center",
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
          }
        },
        {
          title: '服务号码',
          align: "center",
          dataIndex: 'smsNumber',
          customRender: function (text, record, index) {
            if (!text) {
              return '暂无'
            }
            return text;
          }
        },
        {
          title: '入网时间',
          align: "center",
          dataIndex: 'networkAccessTime'
        },
        {
          title: '客户经理',
          align: "center",
          dataIndex: 'staffName'
        },
        {
          title: '客户经理工号',
          align: "center",
          dataIndex: 'staffNo'
        },
        {
          title: '创建时间',
          align: "center",
          dataIndex: 'createTime'
        },
        {
          title: '客户信息类型',
          align: "center",
          dataIndex: 'type',
          customRender: function (text, record, index) {
            console.log(text)
            let checkStateName = ''
            if (!text) {
              checkStateName = '无'
            }
            if (text === 1) {
              checkStateName = '行短'
            }
            if (text === 2) {
              checkStateName = '物联网'
            }
            if (text === 3) {
              checkStateName = '特审复开'
            }
            if (text === 4) {
              checkStateName = '中继线'
            }
            return checkStateName
          }
        },
        {
          title: '资料状态',
          align: "center",
          dataIndex: 'checkState',
          scopedSlots: {customRender: 'checkState'}
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: "center",
          fixed: "right",
          width: 147,
          scopedSlots: {customRender: 'action'}
        }
      ],
      description: '稽核业务列表',
      labelCol: {span: 1},
      wrapperCol: {span: 23},
      taskCheckInfo: {},
      showType: 'checktask',
      url: {
        list: "/smsCheck/customerInfo/staff/list",
      },
      queryParam: {
        customerNo: this.taskInfo.info.customerNo,
      },
      showHistory: ''
    }
  },
  created() {
    this.queryParam.customerNo = this.taskInfo.info.customerNo
    this.initTable();
    this.init();
  },
  methods: {

    exportToWord() {
      this.pdfLoading = true
      getPdf('客户信息报表', 'pdfHtml')//pdfHtml为导出内容的ID
      this.pdfLoading = false
    },
    init() {
      let queryList = {
        customerNo: this.taskInfo.info.customerNo,
      }
      getAction("/smsCheck/customerInfo/selectTaskList", queryList).then(resp => {
        if (resp.success) {
          this.taskCheckInfo = resp.result.records

        }
      })
    },
    initTable() {
      let queryTable = {
        customerNo: this.taskInfo.info.customerNo,
        /*taskId:this.taskInfo.task.id*/
      }

      /*getAction("/smsCheck/customerInfo/list",queryTable).then(resp=>{
        if(resp.success){
          this.dataSource=resp.result.records
        }
      })*/
    },
    showTaskList() {
      let taskInfo = Object.assign({}, this.task);
      this.$emit("goCompany", taskInfo)
    },
    showCheckCheck(record) {
      let type = record.type;
      if (type === 1) {
        this.$router.push({path: '/sms/check/TaskUploadDataSelect', query: {id: record.id}});
      }
      if (type === 2) {
        this.$router.push({path: '/lotCheck/modules/TaskCheckAudit', query: {id: record.id}});
      }
      if (type === 3) {

      }
      if (type === 4) {

      }
      //this.taskInfo.info=record
      //this.$emit("goCheckCheck",this.taskInfo)
    },
    taskType(type) {
      if (type === 1) {
        return '行短';
      }
      if (type === 2) {
        return '物联网';
      }
      if (type === 3) {
        return '防诈复开'
      }
      if (type === 4) {
        return '中继线'
      }
    }
  }
}

</script>