diantou/src_product/iam/audit/suspects/audit-suspects-list.vue

<template>
  <div>
    <a-card style="position: absolute; z-index: 9; height: 10px; padding-top: 16px">
      <a-radio-group name="radioGroup" :default-value="radioGroup" @change="radioGroupChange">
        <a-radio :value="1"> 全部 </a-radio>
        <a-radio :value="2"> 待处理 </a-radio>
      </a-radio-group>
    </a-card>
    <a-card>
      <div :class="[$style.btns]">
        <audit-advanced-export
          ref="export"
          :class-style="[$style.buttonSpacing]"
          :v-show="false"
          :config-id="81"
          :exclebxh="false"
          :expressions="filterExpressions"
        ></audit-advanced-export>
      </div>
      <div>
        <audit-advanced-query
          :expand="expand"
          :search-data="formData"
          :ref-name="'searchform'"
          :search-style="{ height: '170px', left: '10px', top: '200px' }"
          :search-fun="handleSearch"
          @searchedClick="searchedClick"
          @resetForm="resetForm"
        >
          <template>
            <a-col :span="12">
              <a-form-model-item :label="'\u2002\u2002\u2002\u2002编制日期'" prop="compileMan">
                <a-range-picker
                  v-model="formData.compileMan"
                  style="width: 100%"
                  @change="dateChange"
                />
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <a-form-model-item :label="'疑点名称'" prop="suspectsName">
                <a-input v-model="formData.suspectsName" allow-clear />
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <a-form-model-item :label="'疑点核实单位'" prop="suspectsVerifyUnit">
                <a-input v-model="formData.suspectsVerifyUnit" allow-clear />
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <a-form-model-item :label="'项目名称'" prop="projectName">
                <a-input v-model="formData.projectName" allow-clear />
              </a-form-model-item>
            </a-col>
          </template>
        </audit-advanced-query>
      </div>
      <sd-data-table-ex
        ref="iamAuditSuspectsTable"
        form-id="iamAuditSuspects"
        :data-url="'api/xcoa-mobile/v1/iamauditsuspects/all-list'"
        page-id="audit/suspects/iamAuditSuspects"
        :columns="processedColumns"
        :show-advance-query="true"
        :search-fields="['suspectsName', 'projectName', 'suspectsVerifyUnit']"
        :actions="actions"
        show-selection
        :filter-expressions="filterExpressions"
        @searchbtnClick="searchbtnClick"
      >
        <div slot="isLink" slot-scope="text, record">
          <a :title="text" @click="rowClick(record)">{{ text }}</a>
        </div>
      </sd-data-table-ex>
    </a-card>
  </div>
</template>

<script>
import { message, Modal } from 'ant-design-vue'
import auditAdvancedExport from '../../components/audit-advanced-export'
import auditAdvancedQuery from '../../components/audit-advanced-query.vue'
import auditAdvancedQueryMixins from '../../components/audit-advanced-query-mixins'
import components from './_import-components/audit-suspects-list-import'
import errorUtil from '@/common/services/error-util'
import axios from '@/common/services/axios-instance'
import TableActionTypes from '@/common/services/table-action-types'
import crossWindowWatcher from '@/common/services/cross-window-watcher'
import TableColumnTypes from '@/common/services/table-column-types'

const processedColumns = [
  {
    title: '序号',
    customRender: (text, record, index) => `${index + 1}`,
    width: '80px',
  },
  {
    title: '疑点名称',
    dataIndex: 'suspectsName',
    scopedSlots: { customRender: 'isLink' },
  },
  {
    title: '项目名称',
    dataIndex: 'projectName',
  },
  {
    title: '疑点核实单位',
    dataIndex: 'suspectsVerifyUnit',
  },
  {
    title: '是否核实',
    dataIndex: 'verified',
    width: '10%',
    align: 'center',
    customRender: (text, record, index) => {
      if (text === 1) {
        return '是'
      } else {
        return '否'
      }
    },
  },
  {
    title: '编制人员',
    dataIndex: 'compileMan',
  },
  {
    title: '编制日期',
    dataIndex: 'compileDate',
    sdRender: TableColumnTypes.date,
    width: '13%',
  },
  {
    title: '当前状态',
    dataIndex: 'flowState',
    width: '10%',
  },
  {
    title: '当前处理人',
    dataIndex: 'currentUser',
  },
  { dataIndex: 'instId', title: '流程ID', sdHidden: true },
]

export default {
  name: 'AuditSuspectsList',
  metaInfo: {
    title: '已处理',
  },
  components: {
    auditAdvancedQuery,
    ...components,
    auditAdvancedExport,
  },
  mixins: [auditAdvancedQueryMixins],
  data() {
    return {
      processedColumns,
      expand: false,
      formData: {},
      filterExpressions: [],
      radioGroup: 1,
      actions: [
        {
          label: '刪除',
          id: 'delete',
          type: TableActionTypes.batch,
          permission: null, // 纯前端操作，不需要权限控制
          callback: this.linkToDelete,
        },
        {
          label: '导出',
          permission: null, // 纯前端操作，不需要权限控制
          callback: () => {
            this.$refs.export.exportdata()
          },
        },
        {
          label: '新建',
          id: 'new',
          type: TableActionTypes.primary, // 新建按钮，不需要回调，自动处理
          permission: 'create', // 纯前端操作，不需要权限控制
          callback: () => {
            const url = `/sd-flow-guide?code=PRODUCT_IAM_SJYDGL` // 新页面要打开的路由地址
            crossWindowWatcher.waitForChanged(url).then((refreshFlag) => {
              if (refreshFlag) {
                // 这里写或者调刷新的方法
                this.refresh()
              }
            })
          },
        },
      ],
    }
  },
  methods: {
    createrectplanproject() {},
    radioGroupChange(e) {
      this.radioGroup = e.target.value
      this.handleSearch()
    },
    linkToDelete() {
      const selectedRowKeys = this.$refs.iamAuditSuspectsTable.getSelectedRowKeys()
      if (selectedRowKeys.length === 0) {
        Modal.info({
          content: '请选择需要删除的数据！',
        })
        return
      }
      return new Promise((resolve) => {
        Modal.confirm({
          title: '您确定删除这项内容吗？',
          content: '删除这条数据后，就无法恢复初始的状态。',
          okText: '删除',
          okType: 'danger',
          onOk: () => {
            axios({
              url: 'api/xcoa-mobile/v1/iamauditsuspects/deletedSuspects',
              method: 'post',
              params: {
                ids: selectedRowKeys.join(','),
              },
            })
              .then(() => {
                const msg = '删除成功'
                message.success(msg)
                this.$refs.iamAuditSuspectsTable.clearSelection()
                this.$refs.iamAuditSuspectsTable.refresh()
              })
              .catch((err) => {
                const msg = errorUtil.getMessage(err) || '删除失败'
                message.error(msg)
              })
              .finally(resolve)
          },
          onCancel: () => {
            resolve()
          },
        })
      })
    },
    rowClick(record) {
      var url = ''
      if ((record.flowState === '起草') | (record.flowState === '开始')) {
        url = '/sd-webflow/pages/draft/' + record.instId
      } else {
        url = '/sd-webflow/done-pages/' + record.instId
      }
      crossWindowWatcher.waitForChanged(url).then((refreshFlag) => {
        if (refreshFlag) {
          this.refresh()
        }
      })
    },

    refresh() {
      return this.$refs.iamAuditSuspectsTable.refresh(true)
    },
    searchedClick() {
      this.expand = false
    },
    // 重置日期
    resetForm() {
      this.formData.startDate = null
      this.formData.endDate = null
    },
    dateChange(dates, dateStrings) {
      this.formData.startDate = Date.parse(dates[0])
      this.formData.endDate = Date.parse(dates[1])
    },
    handleSearch() {
      const formData = this.formData
      // 修改表格过滤条件进行，再刷新进行数据过滤
      // 获取当前表格过滤条件
      this.filterExpressions = []
      // 选的是待处理

      if (this.radioGroup === 2) {
        this.filterExpressions.push({
          dataType: 'str',
          name: 'currentUser',
          op: 'ne',
          stringValue: '',
        })
      }
      if (formData) {
        if (formData.startDate) {
          this.filterExpressions.push({
            dataType: 'str',
            name: 'compileDate',
            op: 'ge',
            stringValue: formData.startDate,
          })
        }
        if (formData.endDate) {
          this.filterExpressions.push({
            dataType: 'str',
            name: 'compileDate',
            op: 'le',
            stringValue: formData.endDate,
          })
        }
        if (formData.suspectsName) {
          this.filterExpressions.push({
            dataType: 'str',
            name: 'suspectsName',
            op: 'like',
            stringValue: formData.suspectsName,
          })
        }
        if (formData.suspectsVerifyUnit) {
          this.filterExpressions.push({
            dataType: 'str',
            name: 'suspectsVerifyUnit',
            op: 'like',
            stringValue: formData.suspectsVerifyUnit,
          })
        }
        if (formData.projectName) {
          this.filterExpressions.push({
            dataType: 'str',
            name: 'projectName',
            op: 'like',
            stringValue: formData.projectName,
          })
        }
      }
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
.btns {
  position: absolute;
  top: 24px;
  right: 20.5px;
  z-index: 100;
}
.buttonSpacing {
  margin-left: 5px;
}
.search {
  margin-top: 1000px;
}
</style>