|
@@ -0,0 +1,736 @@
|
|
|
|
|
+<template>
|
|
|
|
|
+ <div class="back-line-main">
|
|
|
|
|
+ <div class="back-line-header">
|
|
|
|
|
+ <div class="back-line-header-title">
|
|
|
|
|
+ <h2>渠道数据</h2>
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <span>时间筛选</span>
|
|
|
|
|
+ <a-range-picker
|
|
|
|
|
+ @change="onChangeTime"
|
|
|
|
|
+ v-model="formState.time"
|
|
|
|
|
+ valueFormat="YYYY-MM-DD"
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-icon slot="suffixIcon" type="calendar" />
|
|
|
|
|
+ </a-range-picker>
|
|
|
|
|
+ <a-radio-group
|
|
|
|
|
+ default-value="0"
|
|
|
|
|
+ button-style="solid"
|
|
|
|
|
+ v-model="formState.days"
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-radio-button
|
|
|
|
|
+ value="1"
|
|
|
|
|
+ @click="
|
|
|
|
|
+ (formState.time = []),
|
|
|
|
|
+ (formState.beginDate = ''),
|
|
|
|
|
+ (formState.endDate = '')
|
|
|
|
|
+ "
|
|
|
|
|
+ >
|
|
|
|
|
+ 当天
|
|
|
|
|
+ </a-radio-button>
|
|
|
|
|
+ <a-radio-button
|
|
|
|
|
+ value="7"
|
|
|
|
|
+ @click="
|
|
|
|
|
+ (formState.time = []),
|
|
|
|
|
+ (formState.beginDate = ''),
|
|
|
|
|
+ (formState.endDate = '')
|
|
|
|
|
+ "
|
|
|
|
|
+ >
|
|
|
|
|
+ 近7天
|
|
|
|
|
+ </a-radio-button>
|
|
|
|
|
+ <a-radio-button
|
|
|
|
|
+ value="30"
|
|
|
|
|
+ @click="
|
|
|
|
|
+ (formState.time = []),
|
|
|
|
|
+ (formState.beginDate = ''),
|
|
|
|
|
+ (formState.endDate = '')
|
|
|
|
|
+ "
|
|
|
|
|
+ >
|
|
|
|
|
+ 近30天
|
|
|
|
|
+ </a-radio-button>
|
|
|
|
|
+ </a-radio-group>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <fromRow
|
|
|
|
|
+ :formState="formState"
|
|
|
|
|
+ @getList="getList"
|
|
|
|
|
+ :exportExcel="true"
|
|
|
|
|
+ @exportList="exportList"
|
|
|
|
|
+ ></fromRow>
|
|
|
|
|
+ <a-form layout="inline" :model="formState" class="users">
|
|
|
|
|
+ <a-form-item
|
|
|
|
|
+ label="业务员姓名"
|
|
|
|
|
+ :labelCol="{ span: 8 }"
|
|
|
|
|
+ :colon="false"
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-input
|
|
|
|
|
+ placeholder="请输入业务员姓名"
|
|
|
|
|
+ v-model="formState.userName"
|
|
|
|
|
+ allowClear
|
|
|
|
|
+ ></a-input>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ <a-form-item
|
|
|
|
|
+ label="业务员工号"
|
|
|
|
|
+ :labelCol="{ span: 8 }"
|
|
|
|
|
+ :colon="false"
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-input
|
|
|
|
|
+ placeholder="请输入业务员工号"
|
|
|
|
|
+ v-model="formState.userId"
|
|
|
|
|
+ allowClear
|
|
|
|
|
+ ></a-input>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+
|
|
|
|
|
+ <a-form-item label="管理人" :labelCol="{ span: 5 }" :colon="false">
|
|
|
|
|
+ <a-select
|
|
|
|
|
+ placeholder="请选择"
|
|
|
|
|
+ v-model="formState.leaderId"
|
|
|
|
|
+ allowClear
|
|
|
|
|
+ show-search
|
|
|
|
|
+ :filter-option="filterOption"
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-select-option
|
|
|
|
|
+ v-for="item in manageList"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ :value="item.id"
|
|
|
|
|
+ >
|
|
|
|
|
+ {{ item.name }}
|
|
|
|
|
+ </a-select-option>
|
|
|
|
|
+ </a-select>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-form>
|
|
|
|
|
+ <!-- <a-form-item label="管理人" :labelCol="{ span: 5 }" :colon="false">
|
|
|
|
|
+ <a-select
|
|
|
|
|
+ style="width: 300px"
|
|
|
|
|
+ placeholder="请选择"
|
|
|
|
|
+ v-model="formState.leaderId"
|
|
|
|
|
+ allowClear
|
|
|
|
|
+ show-search
|
|
|
|
|
+ :filter-option="filterOption"
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-select-option
|
|
|
|
|
+ v-for="item in manageList"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ :value="item.id"
|
|
|
|
|
+ >
|
|
|
|
|
+ {{ item.name }}
|
|
|
|
|
+ </a-select-option>
|
|
|
|
|
+ </a-select>
|
|
|
|
|
+ </a-form-item> -->
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div style="width: 100%">
|
|
|
|
|
+ <standard-table
|
|
|
|
|
+ bordered
|
|
|
|
|
+ :columns="columns"
|
|
|
|
|
+ :dataSource="tableList"
|
|
|
|
|
+ :pagination="pagination"
|
|
|
|
|
+ @change="onChange"
|
|
|
|
|
+ :loading="loading"
|
|
|
|
|
+ :scroll="{ x: 2200, y: 600 }"
|
|
|
|
|
+ >
|
|
|
|
|
+ <div slot="qutationCount" slot-scope="{ text }">
|
|
|
|
|
+ {{ text + "条" }}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div slot="quotationRate" slot-scope="{ text }">
|
|
|
|
|
+ {{ (text * 100).toFixed(2) + "%" }}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <span slot="title_slot">
|
|
|
|
|
+ 报价率
|
|
|
|
|
+ <a-tooltip
|
|
|
|
|
+ placement="topLeft"
|
|
|
|
|
+ title="报价中 / 报价数"
|
|
|
|
|
+ arrow-point-at-center
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-icon type="question-circle" />
|
|
|
|
|
+ </a-tooltip>
|
|
|
|
|
+ </span>
|
|
|
|
|
+ <span slot="title_slot2">
|
|
|
|
|
+ 承保率
|
|
|
|
|
+ <a-tooltip
|
|
|
|
|
+ placement="topLeft"
|
|
|
|
|
+ title="承保数 / 报价数"
|
|
|
|
|
+ arrow-point-at-center
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-icon type="question-circle" />
|
|
|
|
|
+ </a-tooltip>
|
|
|
|
|
+ </span>
|
|
|
|
|
+ <span slot="title_slot3">
|
|
|
|
|
+ 核保通过率
|
|
|
|
|
+ <a-tooltip
|
|
|
|
|
+ placement="topLeft"
|
|
|
|
|
+ title="(承保数+ 核保数) / 报价数"
|
|
|
|
|
+ arrow-point-at-center
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-icon type="question-circle" />
|
|
|
|
|
+ </a-tooltip>
|
|
|
|
|
+ </span>
|
|
|
|
|
+ <div slot="operation" slot-scope="{ record }">
|
|
|
|
|
+ <a-button type="link" @click="watchMessage(record)">详情</a-button>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </standard-table>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <a-drawer
|
|
|
|
|
+ :width="1300"
|
|
|
|
|
+ :placement="'right'"
|
|
|
|
|
+ :visible="visible"
|
|
|
|
|
+ :headerStyle="headerStyle"
|
|
|
|
|
+ :closable="false"
|
|
|
|
|
+ >
|
|
|
|
|
+ <template slot="title">
|
|
|
|
|
+ <div class="custom-title" :style="headerStyle">
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <a-icon type="close" @click="onClose" />
|
|
|
|
|
+ 渠道详情
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <a-button style="margin-right: 8px" @click="onClose">取消</a-button>
|
|
|
|
|
+ <a-button type="primary" @click="onClose">确认</a-button>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <dl>
|
|
|
|
|
+ <dt>
|
|
|
|
|
+ <img
|
|
|
|
|
+ v-show="detailsObj.logo"
|
|
|
|
|
+ :src="process + detailsObj.logo"
|
|
|
|
|
+ alt=""
|
|
|
|
|
+ />
|
|
|
|
|
+ <img
|
|
|
|
|
+ v-if="!detailsObj.logo && detailsObj.sex == 'M'"
|
|
|
|
|
+ src="../../assets/img/man.png"
|
|
|
|
|
+ alt=""
|
|
|
|
|
+ />
|
|
|
|
|
+ <img
|
|
|
|
|
+ v-if="!detailsObj.logo && detailsObj.sex == 'F'"
|
|
|
|
|
+ src="../../assets/img/woman.png"
|
|
|
|
|
+ alt=""
|
|
|
|
|
+ />
|
|
|
|
|
+ <img
|
|
|
|
|
+ v-if="!detailsObj.logo && !detailsObj.sex"
|
|
|
|
|
+ src="../../assets/img/man.png"
|
|
|
|
|
+ alt=""
|
|
|
|
|
+ />
|
|
|
|
|
+ </dt>
|
|
|
|
|
+ <dd>
|
|
|
|
|
+ <p>
|
|
|
|
|
+ <span> {{ detailsObj.userName }} </span>({{
|
|
|
|
|
+ detailsObj.userId
|
|
|
|
|
+ }})
|
|
|
|
|
+ </p>
|
|
|
|
|
+ <p>归属机构:{{ detailsObj.deptName }}</p>
|
|
|
|
|
+ </dd>
|
|
|
|
|
+ </dl>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <standard-table
|
|
|
|
|
+ bordered
|
|
|
|
|
+ :columns="columns1"
|
|
|
|
|
+ :dataSource="detailList"
|
|
|
|
|
+ :pagination="pageInfo"
|
|
|
|
|
+ @change="detailsChange"
|
|
|
|
|
+ :loading="loading"
|
|
|
|
|
+ :scroll="{ x: 2200 }"
|
|
|
|
|
+ >
|
|
|
|
|
+ <div slot="qutationCount" slot-scope="{ text }">
|
|
|
|
|
+ {{ text + "条" }}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div slot="quotationRate" slot-scope="{ text }">
|
|
|
|
|
+ {{ (text * 100).toFixed(2) + "%" }}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <span slot="title_slot">
|
|
|
|
|
+ 报价率
|
|
|
|
|
+ <a-tooltip
|
|
|
|
|
+ placement="topLeft"
|
|
|
|
|
+ title="报价中 / 报价数"
|
|
|
|
|
+ arrow-point-at-center
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-icon type="question-circle" />
|
|
|
|
|
+ </a-tooltip>
|
|
|
|
|
+ </span>
|
|
|
|
|
+ <span slot="title_slot2">
|
|
|
|
|
+ 承保率
|
|
|
|
|
+ <a-tooltip
|
|
|
|
|
+ placement="topLeft"
|
|
|
|
|
+ title="承保数 / 报价数"
|
|
|
|
|
+ arrow-point-at-center
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-icon type="question-circle" />
|
|
|
|
|
+ </a-tooltip>
|
|
|
|
|
+ </span>
|
|
|
|
|
+ <span slot="title_slot3">
|
|
|
|
|
+ 核保通过率
|
|
|
|
|
+ <a-tooltip
|
|
|
|
|
+ placement="topLeft"
|
|
|
|
|
+ title="(承保数+ 核保数) / 报价数"
|
|
|
|
|
+ arrow-point-at-center
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-icon type="question-circle" />
|
|
|
|
|
+ </a-tooltip>
|
|
|
|
|
+ </span>
|
|
|
|
|
+ </standard-table>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </a-drawer>
|
|
|
|
|
+ </div>
|
|
|
|
|
+</template>
|
|
|
|
|
+
|
|
|
|
|
+ <script>
|
|
|
|
|
+import StandardTable from "@/components/table/StandardTable";
|
|
|
|
|
+import fromRow from "@/components/form/FormRow";
|
|
|
|
|
+import mixin from "../../minins/mixin";
|
|
|
|
|
+const columns = [
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "二级机构",
|
|
|
|
|
+ dataIndex: "provinceName",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "三级机构",
|
|
|
|
|
+ dataIndex: "cityName",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "四级机构",
|
|
|
|
|
+ dataIndex: "districtName",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "五级机构",
|
|
|
|
|
+ dataIndex: "storeDeptName",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "归属机构",
|
|
|
|
|
+ dataIndex: "deptName",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "管理人",
|
|
|
|
|
+ dataIndex: "leaderName",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "联系电话",
|
|
|
|
|
+ dataIndex: "leaderMobile",
|
|
|
|
|
+ },
|
|
|
|
|
+
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "业务员姓名",
|
|
|
|
|
+ dataIndex: "userName",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "业务员工号",
|
|
|
|
|
+ dataIndex: "userId",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "报价中(PC)",
|
|
|
|
|
+ dataIndex: "pcOrderSource",
|
|
|
|
|
+ scopedSlots: { customRender: "qutationCount" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "报价中(APP)",
|
|
|
|
|
+ dataIndex: "appOrderSource",
|
|
|
|
|
+ scopedSlots: { customRender: "qutationCount" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "待审核",
|
|
|
|
|
+ dataIndex: "auditOrder",
|
|
|
|
|
+ scopedSlots: { customRender: "qutationCount" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "已核保待缴费",
|
|
|
|
|
+ dataIndex: "underwritingCount",
|
|
|
|
|
+ scopedSlots: { customRender: "qutationCount" },
|
|
|
|
|
+
|
|
|
|
|
+ // sorter: true,
|
|
|
|
|
+ needTotal: true,
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "已承保",
|
|
|
|
|
+ dataIndex: "qutationInsureCount",
|
|
|
|
|
+ needTotal: true,
|
|
|
|
|
+ scopedSlots: { customRender: "qutationCount" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "核保退回",
|
|
|
|
|
+ dataIndex: "underwritingReturn",
|
|
|
|
|
+ scopedSlots: { customRender: "qutationCount" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ // title: "报价率",
|
|
|
|
|
+ dataIndex: "quotationRate",
|
|
|
|
|
+ scopedSlots: { title: "title_slot", customRender: "quotationRate" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ // title: "承保率",
|
|
|
|
|
+ dataIndex: "closeRate",
|
|
|
|
|
+ scopedSlots: { title: "title_slot2", customRender: "quotationRate" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ dataIndex: "contributionRate",
|
|
|
|
|
+ scopedSlots: { title: "title_slot3", customRender: "quotationRate" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "操作",
|
|
|
|
|
+ dataIndex: "operation",
|
|
|
|
|
+ fixed: "right",
|
|
|
|
|
+ width: 100,
|
|
|
|
|
+ scopedSlots: { customRender: "operation" },
|
|
|
|
|
+ },
|
|
|
|
|
+];
|
|
|
|
|
+const columns1 = [
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "保险公司",
|
|
|
|
|
+ dataIndex: "inscompany",
|
|
|
|
|
+ },
|
|
|
|
|
+
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "报价中(PC)",
|
|
|
|
|
+ dataIndex: "pcOrderSource",
|
|
|
|
|
+ scopedSlots: { customRender: "qutationCount" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "报价中(APP)",
|
|
|
|
|
+ dataIndex: "appOrderSource",
|
|
|
|
|
+ scopedSlots: { customRender: "qutationCount" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "待审核",
|
|
|
|
|
+ dataIndex: "auditOrder",
|
|
|
|
|
+ scopedSlots: { customRender: "qutationCount" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "已核保待缴费",
|
|
|
|
|
+ dataIndex: "underwritingCount",
|
|
|
|
|
+ scopedSlots: { customRender: "qutationCount" },
|
|
|
|
|
+
|
|
|
|
|
+ // sorter: true,
|
|
|
|
|
+ needTotal: true,
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "已承保",
|
|
|
|
|
+ dataIndex: "qutationInsureCount",
|
|
|
|
|
+ needTotal: true,
|
|
|
|
|
+ scopedSlots: { customRender: "qutationCount" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: "核保退回",
|
|
|
|
|
+ dataIndex: "underwritingReturn",
|
|
|
|
|
+ scopedSlots: { customRender: "qutationCount" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ // title: "报价率",
|
|
|
|
|
+ dataIndex: "quotationRate",
|
|
|
|
|
+ scopedSlots: { title: "title_slot", customRender: "quotationRate" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ // title: "承保率",
|
|
|
|
|
+ dataIndex: "closeRate",
|
|
|
|
|
+ scopedSlots: { title: "title_slot2", customRender: "quotationRate" },
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ dataIndex: "contributionRate",
|
|
|
|
|
+ scopedSlots: { title: "title_slot3", customRender: "quotationRate" },
|
|
|
|
|
+ },
|
|
|
|
|
+];
|
|
|
|
|
+import manageminxin from "../../minins/manageMixin";
|
|
|
|
|
+import moment from "moment";
|
|
|
|
|
+export default {
|
|
|
|
|
+ components: {
|
|
|
|
|
+ StandardTable,
|
|
|
|
|
+ fromRow,
|
|
|
|
|
+ },
|
|
|
|
|
+ mixins: [mixin, manageminxin],
|
|
|
|
|
+ data() {
|
|
|
|
|
+ return {
|
|
|
|
|
+ formState: {
|
|
|
|
|
+ whole: undefined,
|
|
|
|
|
+ cityId: undefined,
|
|
|
|
|
+ countyId: undefined,
|
|
|
|
|
+ houseId: undefined,
|
|
|
|
|
+ provinceId: undefined,
|
|
|
|
|
+ days: undefined,
|
|
|
|
|
+ userId: undefined,
|
|
|
|
|
+ userName: undefined,
|
|
|
|
|
+ leaderId: undefined,
|
|
|
|
|
+ time: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")],
|
|
|
|
|
+ endDate: moment().format("YYYY-MM-DD"),
|
|
|
|
|
+ beginDate: moment().format("YYYY-MM-DD"),
|
|
|
|
|
+ },
|
|
|
|
|
+ visible: false,
|
|
|
|
|
+ headerStyle: {
|
|
|
|
|
+ display: "flex",
|
|
|
|
|
+ "align-items": "center",
|
|
|
|
|
+ "justify-content": "space-between",
|
|
|
|
|
+ },
|
|
|
|
|
+ backLinePersonnel: {},
|
|
|
|
|
+ columns: columns,
|
|
|
|
|
+ columns1: columns1,
|
|
|
|
|
+ companyList: [],
|
|
|
|
|
+ tableList: [],
|
|
|
|
|
+ pagination: {
|
|
|
|
|
+ current: 1,
|
|
|
|
|
+ defaultPageSize: 10,
|
|
|
|
|
+ total: 0,
|
|
|
|
|
+ pagesize0ptions: ["10", "20", "30", "50", "100"],
|
|
|
|
|
+ hideOnSinglePage: false,
|
|
|
|
|
+ showQuickJumper: true, //
|
|
|
|
|
+ showSizeChanger: true, //是否可以改变pagesize
|
|
|
|
|
+ showTotal: (total) => `共 ${total} 条数据`,
|
|
|
|
|
+ },
|
|
|
|
|
+ loading: false,
|
|
|
|
|
+ wholeList: [],
|
|
|
|
|
+ provinceList: [],
|
|
|
|
|
+ cityList: [],
|
|
|
|
|
+ areaList: [],
|
|
|
|
|
+ storeList: [],
|
|
|
|
|
+ process: process.env.VUE_APP_API_BASE_URL,
|
|
|
|
|
+ pageInfo: {
|
|
|
|
|
+ current: 1,
|
|
|
|
|
+ defaultPageSize: 10,
|
|
|
|
|
+ total: 0,
|
|
|
|
|
+ pagesize0ptions: ["10", "20", "30", "50", "100"],
|
|
|
|
|
+ hideOnSinglePage: false,
|
|
|
|
|
+ showQuickJumper: true, //
|
|
|
|
|
+ showSizeChanger: true, //是否可以改变pagesize
|
|
|
|
|
+ showTotal: (total) => `共 ${total} 条数据`,
|
|
|
|
|
+ },
|
|
|
|
|
+ detailsObj: {},
|
|
|
|
|
+ detailList: [],
|
|
|
|
|
+ };
|
|
|
|
|
+ },
|
|
|
|
|
+ watch: {
|
|
|
|
|
+ "formState.days"() {
|
|
|
|
|
+ this.getList();
|
|
|
|
|
+ },
|
|
|
|
|
+ },
|
|
|
|
|
+ mounted() {
|
|
|
|
|
+ this.getList();
|
|
|
|
|
+ // setTimeout(() => {
|
|
|
|
|
+
|
|
|
|
|
+ // }, 1000);
|
|
|
|
|
+ },
|
|
|
|
|
+ methods: {
|
|
|
|
|
+ filterOption(input, option) {
|
|
|
|
|
+ return (
|
|
|
|
|
+ option.componentOptions.children[0].text
|
|
|
|
|
+ .toLowerCase()
|
|
|
|
|
+ .indexOf(input.toLowerCase()) >= 0
|
|
|
|
|
+ );
|
|
|
|
|
+ },
|
|
|
|
|
+ watchMessage(item) {
|
|
|
|
|
+ //
|
|
|
|
|
+ this.detailsObj = { ...item };
|
|
|
|
|
+ this.visible = true;
|
|
|
|
|
+ this.getDetailsList(item);
|
|
|
|
|
+ },
|
|
|
|
|
+ getDetailsList(item) {
|
|
|
|
|
+ this.detailList = [];
|
|
|
|
|
+ this.$API.task
|
|
|
|
|
+ .getChannelAgentDetails({
|
|
|
|
|
+ pageNum: this.pageInfo.current,
|
|
|
|
|
+ pageSize: this.pageInfo.defaultPageSize,
|
|
|
|
|
+ userId: item.userId,
|
|
|
|
|
+ beginDate: this.formState.beginDate,
|
|
|
|
|
+
|
|
|
|
|
+ endDate: this.formState.endDate,
|
|
|
|
|
+ })
|
|
|
|
|
+ .then((res) => {
|
|
|
|
|
+ if (res.data.code === 200) {
|
|
|
|
|
+ this.detailList = res.data.data.records;
|
|
|
|
|
+ this.pageInfo = {
|
|
|
|
|
+ current: res.data.data.current,
|
|
|
|
|
+ defaultPageSize: res.data.data.size,
|
|
|
|
|
+ total: res.data.data.total,
|
|
|
|
|
+ };
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ onClose() {
|
|
|
|
|
+ //
|
|
|
|
|
+ this.visible = false;
|
|
|
|
|
+ },
|
|
|
|
|
+ exportList() {
|
|
|
|
|
+ delete this.formState.time;
|
|
|
|
|
+ this.$API.task
|
|
|
|
|
+ .exportChannelList({
|
|
|
|
|
+ ...this.formState,
|
|
|
|
|
+ })
|
|
|
|
|
+ .then((res) => {
|
|
|
|
|
+ if (res.data.code == 200) {
|
|
|
|
|
+ let url = this.process + res.data.data; // 3.创建一个临时的url指向blob对象
|
|
|
|
|
+ let a = document.createElement("a");
|
|
|
|
|
+ a.href = url;
|
|
|
|
|
+ a.download = "导出文件.xlsx";
|
|
|
|
|
+ a.click();
|
|
|
|
|
+ window.URL.revokeObjectURL(url);
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.$message.error(res.msg);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ getList(val) {
|
|
|
|
|
+ this.loading = true;
|
|
|
|
|
+ this.$API.task
|
|
|
|
|
+ .getQueryPageElectric({
|
|
|
|
|
+ pageNum: this.pagination.current,
|
|
|
|
|
+ pageSize: this.pagination.defaultPageSize,
|
|
|
|
|
+ ...this.formState,
|
|
|
|
|
+ ...val,
|
|
|
|
|
+ })
|
|
|
|
|
+ .then((res) => {
|
|
|
|
|
+ if (res.data.code === 200) {
|
|
|
|
|
+ this.loading = false;
|
|
|
|
|
+ this.tableList = res.data.data.records;
|
|
|
|
|
+ this.pagination = {
|
|
|
|
|
+ current: res.data.data.current,
|
|
|
|
|
+ defaultPageSize: res.data.data.size,
|
|
|
|
|
+ total: res.data.data.total,
|
|
|
|
|
+ };
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.loading = false;
|
|
|
|
|
+ this.tableList = [];
|
|
|
|
|
+ this.pagination.total = 0;
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ onClear() {
|
|
|
|
|
+ this.$message.info("您清空了勾选的所有行");
|
|
|
|
|
+ },
|
|
|
|
|
+ onChangeTime(val) {
|
|
|
|
|
+ // console.log(val);
|
|
|
|
|
+ this.formState.beginDate = val[0];
|
|
|
|
|
+ this.formState.endDate = val[1];
|
|
|
|
|
+ this.formState.days = undefined;
|
|
|
|
|
+ this.getList();
|
|
|
|
|
+ },
|
|
|
|
|
+
|
|
|
|
|
+ onChange(pagination) {
|
|
|
|
|
+ // this.$message.info('表格状态改变了')
|
|
|
|
|
+
|
|
|
|
|
+ this.pagination = {
|
|
|
|
|
+ current: pagination.current,
|
|
|
|
|
+ defaultPageSize: pagination.pageSize,
|
|
|
|
|
+ total: pagination.total,
|
|
|
|
|
+ };
|
|
|
|
|
+ this.getList();
|
|
|
|
|
+ },
|
|
|
|
|
+ detailsChange(pageInfo) {
|
|
|
|
|
+ this.pageInfo = {
|
|
|
|
|
+ current: pageInfo.current,
|
|
|
|
|
+ defaultPageSize: pageInfo.pageSize,
|
|
|
|
|
+ total: pageInfo.total,
|
|
|
|
|
+ };
|
|
|
|
|
+ this.getDetailsList(this.detailsObj);
|
|
|
|
|
+ },
|
|
|
|
|
+ },
|
|
|
|
|
+};
|
|
|
|
|
+</script>
|
|
|
|
|
+ <style lang='less' scoped>
|
|
|
|
|
+.back-line-main {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+ .back-line-header {
|
|
|
|
|
+ padding: 15px;
|
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
|
+ .back-line-header-title {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ justify-content: space-between;
|
|
|
|
|
+ padding-bottom: 15px;
|
|
|
|
|
+ border-bottom: 1px solid #f0f0f0;
|
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
|
+ h2 {
|
|
|
|
|
+ margin: 0;
|
|
|
|
|
+ }
|
|
|
|
|
+ > div {
|
|
|
|
|
+ flex: 1;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ justify-content: flex-end;
|
|
|
|
|
+ }
|
|
|
|
|
+ span {
|
|
|
|
|
+ display: block;
|
|
|
|
|
+ margin-right: 15px;
|
|
|
|
|
+ }
|
|
|
|
|
+ /deep/.ant-calendar-picker {
|
|
|
|
|
+ width: 300px;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ > div {
|
|
|
|
|
+ // height: 152px;
|
|
|
|
|
+ background: #fff;
|
|
|
|
|
+ .users.ant-form {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ > .ant-form-item {
|
|
|
|
|
+ flex: none;
|
|
|
|
|
+ width: 15.7%;
|
|
|
|
|
+ /deep/.ant-form-item-control-wrapper {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ .ant-form {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ > .ant-form-item {
|
|
|
|
|
+ flex: 1;
|
|
|
|
|
+ /deep/.ant-form-item-control-wrapper {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ .form-item-search {
|
|
|
|
|
+ // display: flex;
|
|
|
|
|
+ // justify-content: flex-end;
|
|
|
|
|
+ /deep/ .ant-form-item-control {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ justify-content: flex-end;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+/deep/.ant-drawer-title {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+}
|
|
|
|
|
+/deep/.custom-title {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ > i {
|
|
|
|
|
+ cursor: pointer;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+dl {
|
|
|
|
|
+ width: 346px;
|
|
|
|
|
+ height: 78px;
|
|
|
|
|
+ background: #ffffff;
|
|
|
|
|
+ border-radius: 4px 4px 4px 4px;
|
|
|
|
|
+ border: 1px solid #f87f2c;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ margin-left: 15px;
|
|
|
|
|
+ span {
|
|
|
|
|
+ color: #f87f2c;
|
|
|
|
|
+ }
|
|
|
|
|
+ dt {
|
|
|
|
|
+ width: 64px;
|
|
|
|
|
+ height: 100%;
|
|
|
|
|
+ background: #fff9f7;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ justify-content: center;
|
|
|
|
|
+ border-radius: 4px 0 0 4px;
|
|
|
|
|
+ img {
|
|
|
|
|
+ width: 40px;
|
|
|
|
|
+ height: 40px;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ dd {
|
|
|
|
|
+ padding: 8px 0;
|
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
|
+ margin-left: 10px;
|
|
|
|
|
+ p {
|
|
|
|
|
+ margin: 0;
|
|
|
|
|
+ }
|
|
|
|
|
+ p:first-child {
|
|
|
|
|
+ color: #aaa;
|
|
|
|
|
+ }
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+ // align-items: ;
|
|
|
|
|
+ justify-content: space-between;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+</style>
|