<template>
  <div>
    <a-card :bordered="false">
      <div>
        <a-tabs v-has="'user:userStatistics:tab'" :active-key="currentTab" default-active-key="all"
                @change="tabChange">
          <a-tab-pane key="all" :tab="tabAll"></a-tab-pane>
          <a-tab-pane key="undo" :tab="tabUndo"></a-tab-pane>
          <a-tab-pane key="uncheck" :tab="tabUncheck"></a-tab-pane>
          <a-tab-pane key="checked" :tab="tabChecked"></a-tab-pane>
        </a-tabs>

        <a-tabs v-has="'admin:userStatistics:tab'" :active-key="currentTab" default-active-key="all"
                @change="tabChange">
          <a-tab-pane key="all" :tab="tabAll"></a-tab-pane>
          <a-tab-pane key="undo" :tab="tabUndo"></a-tab-pane>
          <a-tab-pane key="uncheck" :tab="tabUncheck"></a-tab-pane>
          <a-tab-pane key="checked" :tab="tabChecked"></a-tab-pane>
          <a-tab-pane key="del" :tab="tabDelCheck"></a-tab-pane>
          <a-tab-pane key="del" :tab="tabDel1Check"></a-tab-pane>
          <a-tab-pane key="del" :tab="tabDel2Check"></a-tab-pane>
        </a-tabs>
      </div>


      <!-- 查询区域 -->
      <div class="table-page-search-wrapper">
        <a-form layout="inline" @keyup.enter.native="searchQuery">
          <a-row :gutter="24">
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="号码">
                <j-input placeholder="请输入号码" v-model="queryParam.customerNo"></j-input>
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="客户名称">
                <j-input placeholder="请输入客户名称" v-model="queryParam.customerName"></j-input>
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
              <a @click="handleToggleSearch" style="margin-left: 8px">
                {{ toggleSearchStatus ? '收起' : '展开' }}
                <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
              </a>
            </span>
            </a-col>
          </a-row>
        </a-form>
      </div>

      <!-- 操作按钮区域 -->
      <div class="table-operator">
        <a-button type="primary" icon="download" @click="handleExportXls('客户列表')">导出</a-button>
        <!-- 高级查询区域 -->
        <a-dropdown v-if="selectedRowKeys.length > 0">
          <a-menu slot="overlay">
            <a-menu-item key="1" @click="batchDel" v-has="'access:check:list:delete'">
              <a-icon type="delete"/>
              删除
            </a-menu-item>
          </a-menu>
          <a-button style="margin-left: 8px"> 批量操作
            <a-icon type="down"/>
          </a-button>
        </a-dropdown>
      </div>

      <!-- table区域-begin -->
      <div>
        <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
          <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a
          style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
          <a style="margin-left: 24px" @click="onClearSelected">清空</a>
        </div>

        <a-table
          ref="table"
          size="middle"
          :scroll="{x:true}"
          bordered
          rowKey="id"
          :columns="columns"
          :dataSource="dataSource"
          :pagination="ipagination"
          :loading="loading"
          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
          class="j-table-force-nowrap"
          @change="handleTableChange">


          <template slot="action" slot-scope="text, record">
            <div>
              <span v-has="'userStatistics:list:update:admin'" v-show=" currentTab != 'del'">
              <a>处理工单</a>
              <a-divider type="vertical"/>
            </span>

            <span v-has="'userStatistics:list:update'" v-show=" currentTab != 'del'">
              <a @click="showImproveAndUpload(record)">修改</a>
              <a-divider type="vertical"/>
            </span>

              <span v-has="'userStatistics:list:update:admin'" v-show=" currentTab != 'del'">
              <a @click="showImproveAndUploadAdmin(record)">修改</a>
              <a-divider type="vertical"/>
            </span>


              <span v-has="'userStatistics:list:notice'" v-show=" currentTab != 'del'">
              <a @click="noticeDeal(record)">催单</a>
              <a-divider type="vertical"/>
            </span>

              <span v-has="'userStatistics:list:restore:id'" v-show=" currentTab  == 'del'">
              <a @click="restoreById(record)">恢复</a>
              <a-divider type="vertical"/>
            </span>

              <span v-has="'userStatistics:list:remove:id'" v-show=" currentTab  == 'del'">
              <a @click="removeById(record)">彻底删除</a>
              <a-divider type="vertical"/>
            </span>


              <a-dropdown v-show =" currentTab != 'del'">
                <a class="ant-dropdown-link">更多
                  <a-icon type="down"/>
                </a>
                <a-menu slot="overlay">

                  <a-menu-item v-has="'del:userStatistics:list:row:delete'">
                    <a @click="delFlagById(record)">删除</a>
                  </a-menu-item>

                </a-menu>
              </a-dropdown>
            </div>

          </template>

          <template v-slot:phone="text, record">
            <a @click="showCheckDetail(record)">{{ text }}</a>
          </template>
          <template v-slot:numberResults="text, record">
            <a-badge :status="text | statusTypeFilter" :text="text | statusFilter"/>
          </template>
          <template v-slot:rowIndex="text,records,index">
            {{ (ipagination.current - 1) * ipagination.pageSize + Number(index) + 1 }}
          </template>

        </a-table>

      </div>

    </a-card>


  </div>
</template>

<script>
import {getAction, postAction,deleteAction} from "@api/manage";
import {JeecgListMixin} from '@/mixins/JeecgListMixin'
import '@/assets/less/TableExpand.less'

export default {
  name: "userStatistics",
  mixins: [JeecgListMixin],
  inject: ['closeCurrent'],
  data() {
    return {
      numberResults: null,
      /**统计标签*/
      currentTab: 'all',
      tabAll: '全部（1）',
      tabUndo: '未处理（0）',
      tabUncheck: '上报专班模型（线下复机）（0）',
      tabChecked: '上报安防停机（不可复开）（0）',
      tabDelCheck: "上报蓝名单（0）",
      tabDel1Check: "上报紫名单（0）",
      tabDel2Check: "上报蓝、紫名单（0）",
      allCount: 0,
      tabUndoCount: 0,
      tabUncheckCount: 0,
      tabCheckedCount: 0,
      delCount: 0,
      /* table选中keys*/
      selectedRowKeys: [],
      /* table选中records*/
      selectionRows: [],
      /* 查询条件-请不要在queryParam中声明非字符串值的属性 */
      queryParam: {},
      url: {
        typeCount: "/businessReminderCard/type/count",
        list: "/asCheck/customerInfo/list",
        delete: "/businessReminderCard/delete/flagById",
        removeById: "/businessReminderCard/deleteById",
        restoreById: "/businessReminderCard/restoreById",
        notice: "/smsCheck/customerInfo/notice",
      },
      /**表单*/
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: "center",
          scopedSlots: {customRender: 'rowIndex'}
        },

        {
          title: '日期',
          align: "center",
          sorter: true,
          dataIndex: 'date',
          scopedSlots: {customRender: 'date'}
          /* customRender: function (text, record, index) {
             return "<span style='color: #1890FF'>{{text}}</span>"
           }*/
        },
        {
          title: '客户名称',
          align: "center",
          sorter: true,
          dataIndex: 'customerName',
          scopedSlots: {customRender: 'customerName'}
        },
        {
          title: '号码',
          align: "center",
          sorter: true,
          dataIndex: 'number',
          scopedSlots: {customRender: 'number'}
        },
        {
          title: '入网时间',
          align: "center",
          sorter: true,
          dataIndex: 'networkAccessTime',
          scopedSlots: {customRender: 'networkAccessTime'}
        },
        {
          title: '入网时间',
          align: "center",
          sorter: true,
          dataIndex: 'staffDeptLevelName',
          scopedSlots: {customRender: 'staffDeptLevelName'}
        },
        {
          title: '发展人',
          align: "center",
          sorter: true,
          dataIndex: 'staffInfo',
          scopedSlots: {customRender: 'staffInfo'}
        },
        {
          title: '号码来源',
          align: "center",
          sorter: true,
          dataIndex: 'numberSource',
          scopedSlots: {customRender: 'numberSource'}
        },
        {
          title: '管控动作',
          align: "center",
          sorter: true,
          dataIndex: 'control',
          scopedSlots: {customRender: 'control'},
          customRender: function (text, record, index) {
            if (text == '0') {
              return '未处理';
            } else if (text == '1') {
              return '上报专班模型（线下复机）';
            }
            return '';
          }
        },
        {
          title: '创建人',
          align: "center",
          dataIndex: 'createBy'
        },
        {
          title: '创建时间',
          align: "center",
          sorter: true,
          dataIndex: 'createTime'
        },
        {
          title: '更新人',
          align: "center",
          dataIndex: 'updateBy'
        },
        {
          title: '更新时间',
          align: "center",
          sorter: true,
          dataIndex: 'updateTime'
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: "center",
          scopedSlots: {customRender: 'action'}
        }
      ],
    }
  },
  filters: {
    statusTypeFilter(type) {
      const statusTypeMap = {
        '1': 'success',
        '2': 'processing',
        '3': 'warning',
      }
      return statusTypeMap[type]
    },
    statusFilter(status) {
      const statusMap = {
        '1': '非高危',
        '2': '已报蓝紫名单',
        '3': '已报关停',
      }
      return statusMap[status]
    }
  },
  created() {
    /**获取研判结果统计数*/
    //this.typeCount();
  },
  methods: {
    /**标签监听*/
    tabChange(key) {
      this.url.list = "/businessReminderCard/list"
      if (key == "all") {
        this.numberResults = null;
        this.queryParam.numberResults_MultiString = this.numberResults;
        this.currentTab = 'all';
      } else if (key == "undo") {
        this.numberResults = "1";
        this.queryParam.numberResults_MultiString = this.numberResults;
        this.currentTab = 'undo';
      } else if (key == "uncheck") {
        this.numberResults = "2";
        this.queryParam.numberResults_MultiString = this.numberResults;
        this.currentTab = 'uncheck';
      } else if (key == "checked") {
        this.numberResults = "3";
        this.queryParam.numberResults_MultiString = this.numberResults;
        this.currentTab = 'checked';
      } else if (key == "del") {
        this.numberResults = null
        this.url.list = '/businessReminderCard/delete/list'
        this.queryParam.numberResults_MultiString = this.numberResults;
        this.currentTab = 'del';
      }

      this.loadData(1);

    },

    searchQuery() {
      this.loadData(1);
      this.selectedRowKeys = [];
      this.selectionRows = [];
      this.loadTabNumber(this.task.id);
    },
    /**统计数量*/
    typeCount() {
      let that = this;
      let url = that.url.typeCount;
      getAction(url, {}).then(res => {
        if (res.success) {
          let result = res.result;
          that.tabAll = '全部（' + result.count + '）';
          console.log(that.tabAll)
          that.tabUndo = '非高危（' + result.unCount + '）';
          that.tabUncheck = '已报蓝紫名单（' + result.uncheckCount + '）';
          that.tabChecked = '已报关停（' + result.closeCount + '）';
          that.tabDelCheck = '已删除（' + result.delCount + '）';
        } else {

        }
      }).finally(() => {

      })

    },

    /**修改*/
    showImproveAndUpload(record) {
      this.$router.push({path: '/networkAccess/registration', query: {id: record.id}});
    },
    showImproveAndUploadAdmin(record) {
      this.$router.push({path: '/networkAccess/registrationHide', query: {id: record.id}});
    },

    /**详情*/
    showCheckDetail(record) {
      let id = record.id;
      this.$router.push({path: '/networkAccess/registrationDetails', query: {id: record.id}});
    },
    /**删除*/
    delFlagById(record){
      let id = record.id;
      let that = this;
      let url = that.url.delete;
      deleteAction(url, {id: id}).then(res => {
        if (res.success) {
          this.typeCount();
          this.$message.success("删除成功", 7);
          this.loadData(1);
        } else {
          this.$message.error("删除失败", 7);
        }
      });
    },
    /**彻底删除*/
    removeById(record) {
      let id = record.id;
      let that = this;
      let url = that.url.removeById;
      getAction(url, {id: id}).then(res => {
        if (res.success) {
          this.typeCount();
          this.$message.success("删除成功", 7);
          this.loadData(1);
        } else {
          this.$message.error("删除失败", 7);
        }
      });
    },
    /**恢复*/
    restoreById(record) {
      let id = record.id;
      let that = this;
      let url = that.url.restoreById;
      getAction(url, {id: id}).then(res => {
        if (res.success) {
          this.typeCount();
          this.$message.success("恢复成功", 7);
          this.loadData(1);
        } else {
          this.$message.error("恢复失败", 7);
        }
      });
    },
    /**通知*/
    noticeDeal(record) {
      let that = this;
      that.$message.info('已通知业务员，对入网信息进行修改！');
    }

  },
}
</script>

<style scoped>

</style>