<!-- eslint-disable vue/max-attributes-per-line -->
<template>
  <div class="app-container">
    <el-row>
      <el-form ref="queryForm" :model="queryParams" inline>
        <el-row>
          <el-form-item>
            <el-input v-model="queryParams.name" placeholder="姓名/联系方式" clearable style="width: 200px" @keyup.enter.native="handleQuery" />
          </el-form-item>
          <el-form-item>
            <el-select v-model="queryParams.source" placeholder="选择线索来源" clearable @change="handleQuery">
              <el-option v-for="dict in sourceOptions" :key="dict.dictValue" :value="dict.dictValue" />
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-select v-model="queryParams.intentionState" placeholder="选择意向状态" clearable @change="handleQuery">
              <el-option v-for="dict in intentionOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue">
                <i class="el-icon-star-on" :style="dict.cssClass" />
                <span style="float: right; color: #8492a6; font-size: 13px">{{ dict.dictValue }}</span>
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-select v-model="queryParams.followUser2" placeholder="选择跟进人员" filterable clearable @change="handleQuery">
              <el-option v-for="dict in userOptions" :key="dict.id" :label="dict.name" :value="dict.id" />
            </el-select>
          </el-form-item>
          <el-form-item label="创建时间">
            <el-date-picker v-model="queryParams.createTime" style="width: 240px" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" @change="handleQuery" />
          </el-form-item>
        </el-row>

        <el-row>
          <el-form-item label-width="80">
            <template slot="label">
              <el-button type="text" @click="handleFilter">筛选</el-button>
            </template>
            <el-checkbox-group v-model="queryParams.etc" @change="etcChange">
              <el-checkbox v-if="filterItems.myCreate" label="myCreate">我创建的</el-checkbox>
              <el-checkbox v-if="filterItems.myValid" label="myValid">我的有效</el-checkbox>
              <el-checkbox v-if="filterItems.valid" label="valid">有效线索</el-checkbox>
              <el-checkbox v-if="filterItems.todayValid" label="todayValid">今日有效线索</el-checkbox>
              <el-checkbox v-if="filterItems.todayFollow" label="todayFollow">今日跟踪</el-checkbox>
              <el-checkbox v-if="filterItems.outtime" label="outtime">
                <el-badge :value="expireCount" type="danger">过期线索</el-badge>
              </el-checkbox>
              <el-checkbox v-if="filterItems.relate" label="relate">相关线索</el-checkbox>
              <el-checkbox v-if="filterItems.reSign" label="reSign">撞单线索</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
          <el-form-item class="m20">
            <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
            <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
            <el-button type="primary" icon="el-icon-plus" @click="handleAdd">新增</el-button>
            <el-button type="primary" @click="handlePublicClue">公海</el-button>
            <el-dropdown trigger="click">
              <el-button type="primary">
                更多
                <i class="el-icon-arrow-down el-icon--right" />
              </el-button>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item @click.native="handleImport(false)">导入</el-dropdown-item>
                <el-dropdown-item @click.native="handleImport(true)">一点通导入</el-dropdown-item>
                <el-dropdown-item v-if="admin == 'true'" @click.native="handleExport">导出</el-dropdown-item>
                <el-dropdown-item v-if="admin == 'true'" @click.native="handleBatChUpdate()">批量修改</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </el-form-item>
          <!-- <el-button type="primary" v-if="admin != 'true' && accept" @click="handleAccept(false)">停止接收</el-button>
            <el-button type="primary" v-if="admin != 'true' && !accept" @click="handleAccept(true)">启动接收</el-button> -->
        </el-row>
      </el-form>
    </el-row>

    <CustomColumnTable v-if="!queryParams.reSign" :table-list="tableDataList" :table-loading="tableLoading" :query-params.sync="queryParams" :default-columns="tableAllFields.map((item) => item.prop)" :sortable-columns="tableAllFields.map((item) => item.prop)" :table-all-fields="tableAllFields" :selectable="true" @getlist="getPageList" @changeSort="changeSort" @clickRow="handleRowClick" @selectRow="selectRow">
      <template #appendColumn>
        <!-- <el-table-column label="备注" prop="clueMemo" sortable min-width="140" show-overflow-tooltip=true v-if="!queryParams.reSign" /> -->
        <el-table-column v-if="!queryParams.reSign" label="意向状态" prop="intentionState" sortable fixed="right" min-width="100">
          <template slot-scope="{ row }">
            <el-tag effect="dark" style="border: none" :color="tagColorMap[row.intentionState]">{{ row.intentionState }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column v-if="!queryParams.reSign" label="操作" fixed="right" width="320">
          <template slot-scope="scope">
            <el-button v-if="admin == 'true' || scope.row.followUser2 == userId" type="text" icon="el-icon-edit" @click.native.stop="handleUpdate(scope.row)">编辑</el-button>
            <el-button v-if="(admin == 'true' || scope.row.followUser2 == userId) && scope.row.refuse" type="text" icon="el-icon-edit" @click.native.stop="handleRefuse(scope.row)">甩单驳回</el-button>
            <el-button v-if="(admin == 'true' || scope.row.followUser2 == userId) && !scope.row.refuse" type="text" icon="el-icon-edit" :style="{ color: `${scope.row.offlineReceiver ? '#26A69A' : '#409EFF'}` }" @click.native.stop="handleDistribute(scope.row)">甩单</el-button>
            <el-button v-if="(admin == 'true' || scope.row.followUser2 == userId) && scope.row.state" type="text" icon="el-icon-edit" style="color: #26a69a" @click.native.stop="handleSign1(scope.row)">已登记</el-button>
            <el-button v-if="(admin == 'true' || scope.row.followUser2 == userId) && !scope.row.state" type="text" icon="el-icon-edit" @click.native.stop="handleSign1(scope.row)">未登记</el-button>
            <el-button v-if="admin == 'true' || scope.row.followUser2 == userId" type="text" icon="el-icon-delete" @click.native.stop="handleDelete(scope.row)">删除</el-button>
            <el-button v-if="admin == 'true' || scope.row.followUser2 == userId" type="text" icon="el-icon-delete" @click.native.stop="handleDiscard(scope.row)">释放</el-button>
          </template>
        </el-table-column>
      </template>
    </CustomColumnTable>

    <CustomColumnTable v-else :table-list="tableDataList" :table-loading="tableLoading" :query-params.sync="queryParams" :default-columns="tableAllFields.filter((item) => item.show).map((item) => item.prop)" :sortable-columns="tableAllFields.filter((item) => item.show).map((item) => item.prop)" :table-all-fields="tableAllFields.filter((item) => item.show)" :selectable="true" @getlist="getPageList" @changeSort="changeSort" @clickRow="handleRowClick" @selectRow="selectRow" />

    <el-drawer :visible.sync="clueVisible" size="90%" append-to-body destroy-on-close>
      <div slot="title">
        <div v-if="clueInfo.consultCount && clueInfo.consultCount < 2">
          学员信息
          <span v-if="clueInfo.name">-【{{ clueInfo.name }}】</span>
        </div>
        <el-popover v-else placement="top-start" trigger="hover">
          <el-table :data="consultRecord">
            <el-table-column width="120" prop="consultTime" label="咨询日期" />
            <el-table-column width="100" prop="consultUserName" label="咨询人" />
          </el-table>
          <el-badge slot="reference" :value="clueInfo.consultCount">
            <span>
              学员信息
              <span v-if="clueInfo.name">-【{{ clueInfo.name }}】</span>
            </span>
          </el-badge>
        </el-popover>
      </div>
      <clue-form v-if="clueVisible" ref="clueInfo" v-model="clueInfo" :options="{ userOptions: userOptions2, sourceOptions: sourceOptions, intentionOptions: intentionOptions, placeInfo: placeInfo }" />
      <div class="drawer-form__footer">
        <div style="flex: 1; text-align: right">
          <template v-if="saveNextShow">
            <el-checkbox v-model="saveNext" />
            <span class="ml5">保存后继续创建下一条</span>
          </template>
        </div>
        <div class="ml0" style="width: 60%; display: flex">
          <el-button class="footer_button" @click="clueVisible = false">取 消</el-button>
          <el-button class="footer_button" type="primary" :loading="modalSaveLoading" @click="handleSaveClue">确 定</el-button>
        </div>
      </div>
    </el-drawer>

    <el-dialog :title="dialogTitle" :visible.sync="dialogShow" custom-class="dialog500" :width="dialogWidth">
      <component :is="componentName" v-if="dialogShow" ref="form" v-model="form" :options="dialogFormOptions" />
      <span v-if="dialogFooterShow" slot="footer">
        <el-button @click="dialogShow = false">取消</el-button>
        <el-button type="primary" :loading="dialogSaving" @click="handleDialogConfirm">确定</el-button>
      </span>
    </el-dialog>

    <!-- 用户导入对话框 -->
    <el-dialog title="学员信息导入" :visible.sync="upload.open" width="400px" append-to-body>
      <el-upload action="#" accept=".xlsx, .xls" :show-file-list="false" :http-request="handleUpload" :disabled="upload.isUploading" drag>
        <i class="el-icon-upload" />
        <div class="el-upload__text">
          将文件拖到此处，或
          <em>点击上传</em>
        </div>
        <div slot="tip" class="el-upload__tip">
          <el-link type="info" style="font-size: 12px" @click="importTemplate">下载模板</el-link>
        </div>
        <div slot="tip" class="el-upload__tip" style="color: red">提示：仅允许导入“xls”或“xlsx”格式文件！</div>
      </el-upload>
    </el-dialog>
  </div>
</template>

<script>
import {
  getClueList,
  exportData,
  importTemplate,
  deleteClue,
  refuse,
  getClueCountBadge,
  addClue,
  updateClue,
  getSign,
  saveSign,
  getConsultRecord,
  saveDistribute,
  batchUpdate,
  discardClue,
  updateAccept,
  getAccept
} from '@/api/zs/clue';
import { getEmployee, getAllPlaces, importData } from '@/api/tool/common';
export default {
  name: 'Clue',
  components: {
    CustomColumnTable: () => ({
      component: import('@/components/CustomColumnTable')
    }),
    ClueForm: () => ({ component: import('./components/clueForm') }),
    DistributeForm: () => ({ component: import('./components/distributeForm.vue') }),
    SignForm: () => ({ component: import('./components/signForm') }),
    BatchUpdateForm: () => ({ component: import('./components/batchUpdateForm') }),
    FilterForm: () => ({ component: import('./components/filterForm') }),
    PublicTable: () => ({ component: import('./components/publicTable') })
  },
  data() {
    return {
      admin: localStorage.getItem('admin'),
      userId: localStorage.getItem('userId'),
      tagColorMap: {
        A高意向: '#ff7043',
        B中意向: '#26a69a',
        C无意向: '#5c6bc0',
        D未知意向: '#ef5350',
        报名成功: '#ffa726',
        报名他校: '#afaeb0',
        无效线索: '#afaeb0'
      },

      dialogShow: false,
      dialogFooterShow: false,
      componentName: undefined,
      dialogTitle: '',
      dialogWidth: '50%',
      form: {},
      dialogSaving: false,
      dialogFormOptions: [],
      clueVisible: false,
      distributeVisible: false,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        createTime: [],
        name: undefined,
        intentionState: undefined,
        followUser2: undefined,
        source: undefined,
        etc: [],
        total: 0
      },
      tableAllFields: [
        { prop: 'createTime', label: '创建时间', show: true },
        { prop: 'source', label: '线索来源', show: true },
        { prop: 'name', label: '姓名', show: true },
        { prop: 'phone', label: '联系方式', show: true },
        { prop: 'address', label: '位置', show: true },
        { prop: 'requirement', label: '学员诉求', show: true },
        { prop: 'licenseType', label: '咨询车型', show: true },
        { prop: 'followTime', label: '下次跟进时间', width: 140, show: true },
        { prop: 'firstFollowUserName', label: '首次跟进人员', width: 140, show: true },
        { prop: 'followUserName', label: '跟进人员', show: true },
        { prop: 'recentLook', label: '是否近期看场地', width: 140 },
        { prop: 'offlineReceiverName', label: '线下接待人员', width: 140, show: true },
        { prop: 'clueMemo', label: '备注', show: true }
      ],
      tableLoading: false,
      tableDataList: [],
      upload: {
        open: false,
        isUploading: false,
        // 是否一点通线索
        ydtData: false
      },
      sourceOptions: [],
      intentionOptions: [],
      userOptions: [],
      clueInfo: {},
      expireCount: undefined,
      placeInfo: [],
      consultRecord: [],
      modalSaveLoading: false,
      saveNextShow: false,
      saveNext: false,
      clueIds: [],
      filterItems: {
        myCreate: true,
        myValid: true,
        valid: true,
        todayValid: true,
        todayFollow: true,
        outtime: true,
        relate: false,
        reSign: false
      },
      accept: false,
      employeeId: undefined,
      userOptions2: []
    };
  },
  created() {
    // 线索来源
    this.getDicts('dm_source').then((response) => {
      this.sourceOptions = response.data;
    });
    // 意向状态
    this.getDicts('dm_intention_state').then((response) => {
      this.intentionOptions = response.data;
    });
    this._getClueCountBadge();
    this.getPageList();
    this.getEmployee();
    // 查询场地
    this.getAllPlace();
    if (localStorage.getItem(this.userId + '-filterItems')) {
      this.filterItems = JSON.parse(localStorage.getItem(this.userId + '-filterItems'));
    }
    this.getAccept();
  },
  methods: {
    // 搜索
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getPageList();
    },
    getAccept() {
      getAccept().then((resp) => {
        if (resp.code === 200) {
          this.accept = resp.data.accept;
          this.employeeId = resp.data.employeeId;
        }
      });
    },
    getPageList() {
      this.tableLoading = true;
      const params = { ...this.queryParams, etc: undefined };
      getClueList(this.opearateRequestParams(params)).then((response) => {
        this.tableDataList = response.rows;
        this.queryParams.total = response.total;
        this.tableLoading = false;
      });
    },
    // 获取已过期
    async _getClueCountBadge() {
      const resp = await getClueCountBadge();
      if (resp.code === 200) {
        this.expireCount = resp.data;
      }
    },
    // 重置搜索
    resetQuery() {
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        createTime: [],
        name: undefined,
        intentionState: undefined,
        followUser2: undefined,
        source: undefined,
        etc: [],
        total: 0
      };
      this.handleQuery();
    },
    etcChange(val) {
      this.$set(this.queryParams, 'myCreate', undefined);
      this.$set(this.queryParams, 'myValid', undefined);
      this.$set(this.queryParams, 'valid', undefined);
      this.$set(this.queryParams, 'todayValid', undefined);
      this.$set(this.queryParams, 'todayFollow', undefined);
      this.$set(this.queryParams, 'outtime', undefined);
      this.$set(this.queryParams, 'relate', undefined);
      this.$set(this.queryParams, 'reSign', undefined);

      if (!this.isNullOrEmpty(val)) {
        val.length > 1 && this.$set(this.queryParams, 'etc', [val[val.length - 1]]);
        this.$set(this.queryParams, val[val.length - 1], true);
      }
      if (this.queryParams.reSign) {
        this.tableAllFields = this.tableAllFields.map((item) => {
          if (item.prop === 'clueMemo') {
            item.show = false;
          }
          return item;
        });
      } else {
        this.tableAllFields = this.tableAllFields.map((item) => {
          if (item.prop === 'clueMemo') {
            item.show = true;
          }
          return item;
        });
      }
      this.handleQuery();
    },
    resetForm() {
      this.clueInfo = {
        clueId: undefined,
        createTime: this.parseTime(new Date(), '{y}-{m}-{d} {h}:{i}'),
        consultTime: undefined,
        source: undefined,
        name: undefined,
        phone: undefined,
        address: undefined,
        intentionState: undefined,
        followInfo: undefined,
        followTime: undefined,
        followUser: undefined,
        signupInfo: undefined,
        requirement: undefined,
        licenseType: undefined
      };
      this.dialogFormOptions = {
        userOptions: this.userOptions,
        sourceOptions: this.sourceOptions,
        intentionOptions: this.intentionOptions,
        placeInfo: this.placeInfo
      };
    },
    // 新增
    handleAdd() {
      this.resetForm();
      this.clueVisible = true;
      this.saveNextShow = true;
      this.saveNext = false;
      this.getEmployee2();
    },
    // 编辑
    handleUpdate(listItem) {
      this.clueVisible = true;
      this.clueInfo = listItem;
      this.saveNextShow = false;
      this.saveNext = false;
      this.getEmployee2();
      // 查询咨询记录
      this.getConsultRecord(listItem.clueId);
    },
    // 查询咨询记录
    getConsultRecord(clueId) {
      getConsultRecord({ clueId }).then((resp) => {
        if (resp && resp.code === 200 && resp.data) {
          this.consultRecord = resp.data;
        }
      });
    },
    handleRowClick(row) {
      if (!this.queryParams.reSign) {
        this.handleUpdate(row);
      }
    },
    // 删除
    handleDelete(item) {
      this.$confirm('是否确认删除该条线索（“' + item.name + '/' + item.phone + '”）?', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then((res) => {
          deleteClue({ clueId: item.clueId }).then((resp) => {
            if (resp.code === 200) {
              this.$message.success('删除成功');
              this.getPageList();
            }
          });
        })
        .catch(function () {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.$confirm('是否确认导出所有学员信息项?', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const resp = await exportData(this.opearateRequestParams(this.queryParams));
        this.download(resp.msg);
      });
    },
    /** 导入按钮操作 */
    handleImport(ydtData) {
      this.upload.open = true;
      this.upload.ydtData = ydtData;
    },
    /** 下载模板操作 */
    importTemplate() {
      importTemplate({ ydtData: this.upload.ydtData }).then((response) => {
        this.download(response.msg);
      });
    },
    async handleUpload(data) {
      const formData = new FormData();
      formData.append('file', data.file);
      this.upload.isUploading = true;
      importData(this.upload.ydtData, formData).then((resp) => {
        this.upload.isUploading = false;
        if (resp.code === 200) {
          this.$alert(resp.msg, '导入结果', {
            dangerouslyUseHTMLString: true
          });
          this.upload.open = false;
          this.getList();
        }
      });
    },
    getEmployee() {
      getEmployee({ coach: false }).then((resp) => {
        if (resp.code === 200) {
          this.userOptions = resp.data;
        }
      });
    },
    // 查询不能接收线索的员工
    getEmployee2() {
      getEmployee({ coach: false }).then((resp) => {
        if (resp.code === 200) {
          this.userOptions2 = resp.data;
          this.userOptions2 = this.userOptions2.filter((item) => {
            return item.accept;
          });
        }
      });
    },
    changeSort(val) {
      if (val.order) {
        this.queryParams.orderName = val.prop;
        if (val.order === 'ascending') {
          this.queryParams.orderType = 'asc';
        } else {
          this.queryParams.orderType = 'desc';
        }
      } else {
        this.queryParams.orderName = undefined;
        this.queryParams.orderType = undefined;
      }
      this.getPageList();
    },
    handleDistribute(item) {
      this.dialogTitle = '甩单';
      this.dialogWidth = '700px';
      this.componentName = 'DistributeForm';
      this.dialogFormOptions = {
        userOptions: this.userOptions,
        offlineReceiver: item.offlineReceiver
      };
      this.dialogFooterShow = true;
      this.form = {
        clueId: item.clueId,
        offlineReceiverName: item.offlineReceiverName,
        offlineReceiver: undefined,
        memo: item.memo
      };
      this.dialogShow = true;
    },
    handleRefuse(item) {
      refuse({ clueId: item.clueId }).then((resp) => {
        if (resp.code === 200) {
          this.$message.success('驳回成功');
          this.getPageList();
        }
      });
    },
    resetSignForm() {
      this.form = {
        dealDate: this.parseTime(new Date(), '{y}-{m}-{d}'),
        signSchool: undefined,
        schoolName: undefined,
        signPlace: undefined,
        placeName: undefined,
        signClass: undefined,
        className: undefined,
        signPrice: undefined,
        schoolPeople: undefined,
        schoolPay: undefined,
        alipay: undefined,
        profit: undefined,
        percentage: undefined,
        detail: undefined,
        dealState: undefined,
        extraPayType: undefined,
        extraPay: undefined,
        percentageState: undefined,
        memo: undefined,
        createTime: undefined,
        updateTime: undefined,
        state: true,
        commission: undefined
      };
      this.dialogFormOptions = {
        userOptions: this.userOptions,
        sourceOptions: this.sourceOptions,
        placeInfo: this.placeInfo
      };
    },
    async handleSign1(item) {
      this.dialogTitle = '成交登记';
      this.dialogWidth = '800px';
      this.componentName = 'SignForm';
      this.dialogFooterShow = true;
      this.resetSignForm();
      const resp = await getSign({ clueId: item.clueId });
      if (resp.code === 200) {
        const {
          clueId,
          consultTime,
          name,
          phone,
          source,
          followUser,
          followUser2,
          followUserName,
          offlineReceiver,
          offlineReceiver2,
          offlineReceiverName
        } = item;
        this.form = Object.assign({}, this.form, {
          clueId,
          consultTime,
          name,
          phone,
          source,
          followUser,
          followUser2,
          followUserName,
          offlineReceiver,
          offlineReceiver2,
          offlineReceiverName
        });
        if (resp.data) {
          this.form = { ...this.form, ...resp.data };
          this.dialogFooterShow = this.form.signEdit;
        }
        this.dialogShow = true;
      }
    },
    getAllPlace() {
      getAllPlaces({ status: '0' }).then((resp) => {
        this.placeInfo = resp.data.filter((item) => item.schoolShow && item.showInMap);
      });
    },
    handleSaveClue() {
      this.$refs.clueInfo.validateForm().then(async (valid) => {
        if (valid) {
          this.modalSaveLoading = true;
          let resp;
          if (this.clueInfo.clueId) {
            resp = await updateClue(this.clueInfo);
            this.modalSaveLoading = false;
            if (resp.code === 200) {
              this.$message.success('修改成功');
              this.getPageList();
              this.clueVisible = false;
            }
          } else {
            resp = await addClue(this.clueInfo);
            this.modalSaveLoading = false;
            if (resp.code === 200) {
              this.$message.success('新增成功');
              if (this.saveNext) {
                this.resetForm();
              } else {
                this.getPageList();
                this.clueVisible = false;
              }
            }
          }
        }
      });
    },
    handleDialogConfirm() {
      this.$refs.form.validate().then(async (valid) => {
        if (valid) {
          let resp;
          this.dialogSaving = true;
          if (this.componentName === 'SignForm') {
            // 登记提交
            this.form.checkState = 1;
            resp = await saveSign(this.form);
          } else if (this.componentName === 'DistributeForm') {
            resp = await saveDistribute(this.form);
          } else if (this.componentName === 'BatchUpdateForm') {
            resp = await batchUpdate(this.form);
          } else if (this.componentName === 'FilterForm') {
            this.filterItems = { ...this.form };
            localStorage.setItem(this.userId + '-filterItems', JSON.stringify(this.filterItems));
            this.$message.success('操作成功');
            this.dialogShow = false;
          }
          this.dialogSaving = false;
          if (resp && resp.code === 200) {
            this.$message.success('操作成功');
            this.dialogShow = false;
            this.getPageList();
          }
        }
      });
    },
    // 表格多选
    selectRow(val) {
      console.log(val);
      this.clueIds = [];
      if (val && val.length > 0) {
        this.clueIds = val.map((item) => item.clueId);
      }
    },
    // 批量修改
    handleBatChUpdate() {
      this.getEmployee2();
      // 判断是否选择了数据
      if (!this.clueIds || this.clueIds.length <= 0) {
        // 提示选择数据
        this.$message.error('请至少选择一条数据！');
      } else {
        // 打开编辑框
        this.dialogTitle = '批量修改';
        this.dialogWidth = '500px';
        this.componentName = 'BatchUpdateForm';
        this.dialogFormOptions = {
          userOptions: this.userOptions2
        };
        this.dialogFooterShow = true;
        this.form = {
          followUsers: [],
          clueIds: this.clueIds
        };
        this.dialogShow = true;
      }
    },
    // 筛选点击事件
    handleFilter() {
      // 打开编辑框
      this.dialogTitle = '筛选配置';
      this.dialogWidth = '500px';
      this.componentName = 'FilterForm';
      this.dialogFormOptions = {
        userOptions: this.userOptions
      };
      this.dialogFooterShow = true;
      this.form = { ...this.filterItems };
      this.dialogShow = true;
    },
    handlePublicClue() {
      // 打开编辑框
      this.dialogTitle = '公海线索';
      this.dialogWidth = '900px';
      this.componentName = 'PublicTable';
      this.dialogFormOptions = {
        userOptions: this.userOptions
      };
      this.dialogFooterShow = false;
      this.form = {};
      this.dialogShow = true;
    },
    handleDiscard(item) {
      discardClue(item).then((resp) => {
        if (resp && resp.code === 200) {
          this.$message.success('释放成功');
          this.getPageList();
        }
      });
    },
    // 停止或启动接收线索
    handleAccept(accept) {
      updateAccept({ employeeId: this.employeeId, accept: accept }).then((resp) => {
        if (resp.code === 200) {
          this.$message.success(accept ? '启动成功' : '停止成功');
          this.accept = accept;
        }
      });
    }
  }
};
</script>

<style scoped>
.drawer-form__footer {
  border-top: 1px solid rgba(69, 74, 91, 0.1);
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  height: 50px;
  line-height: 50px;
  z-index: 2;
  background: #fff;
}

.footer_button {
  width: 49%;
  margin: auto;
}
</style>
