[update] 修改标准选择器组件

2023-09-04 09:59:58 +08:00
parent 18c682e175
commit a2bf4db396
7 changed files with 201 additions and 358 deletions
@@ -0,0 +1,179 @@
+<template>
+  <a-drawer
+    :title="$t('standardSelect.standardSelection')"
+    :maskClosable="false"
+    :width="1000"
+    placement="right"
+    :closable="true"
+    @close="handleCancel"
+    :visible="visible"
+    style="height: 100%;overflow: auto;padding-bottom: 53px;">
+    <div style="margin-bottom: 60px">
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline" @keyup.enter.native="searchQuery">
+        <a-row :gutter="24">
+          <a-col :sm="8">
+            <a-form-item :label="$t('standardSelect.source')" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <j-dict-select-tag style="width: 100%" v-model="queryParam.source"
+                                 :placeholder="$t('pleaseSelect')+$t('standardSelect.source')"
+                                 :triggerChange="false" :dictCode="standard_source"/>
+            </a-form-item>
+          </a-col>
+          <a-col :sm="8">
+            <a-form-item :label="$t('standardSelect.standardNumOrName')" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-input :placeholder="$t('pleaseEnter')+$t('standardSelect.standardNumOrName')"
+                       v-model="queryParam.standardNumOrName"></a-input>
+            </a-form-item>
+          </a-col>
+          <div style="float: right;overflow: hidden;margin-right: 41px;margin-bottom: 20px" class="table-page-search-submitButtons">
+            <a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{$t('reset')}}</a-button>
+            <a-button class="box-button" style="margin-left: 8px" type="primary" @click="searchQuery">{{$t('query')}}</a-button>
+          </div>
+        </a-row>
+      </a-form>
+      </div>
+      <a-table
+        :columns="columns"
+        rowKey="serial_number"
+        :scroll="{x: 1500}"
+        :data-source="dataList"
+        :pagination="ipagination"
+        :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
+        :loading="loading">
+
+      </a-table>
+    </div>
+
+    <div class="drawer-bootom-button">
+      <a-button @click="handleCancel" style="margin-right: 16px">{{$t('cancel')}}</a-button>
+      <a-button @click="handleSubmit" type="primary" :loading="confirmLoading">{{$t('submit')}}</a-button>
+    </div>
+  </a-drawer>
+</template>
+
+<script>
+import { getStandardList } from '@/api/api'
+import JDictSelectTag from '../dict/JDictSelectTag'
+
+export default {
+  name: 'StandardSelectionModal',
+  components: { JDictSelectTag },
+  data () {
+    return {
+      visible: false,
+      confirmLoading: false,
+      labelCol: {
+        sm: 8
+      },
+      wrapperCol: {
+        sm: 14
+      },
+      selectedRowKeys: [],
+      selectedRowList: [],
+      loading: false,
+      queryParam: {},
+      /* 分页参数 */
+      ipagination: {
+        current: 1,
+        pageSize: 10,
+        pageSizeOptions: ['10', '20', '30'],
+        showTotal: (total, range) => {
+          return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
+        },
+        showQuickJumper: true,
+        showSizeChanger: true,
+        total: 0
+      },
+      columns: [
+        {
+          title: this.$t('number'),
+          dataIndex: 'serial_number',
+          ellipsis: true,
+          align: 'left',
+          width: 480
+        },
+        {
+          title: this.$t('title'),
+          dataIndex: 'title',
+          ellipsis: true,
+          align: 'left',
+          width: 480
+        },
+        {
+          title: this.$t('textStatus'),
+          dataIndex: 'state',
+          align: 'left',
+          width: 480
+        }
+      ],
+      dataList: [],
+      url: {
+        searchList: 'document/bussDocumentLibraryEO/queryCondition' // 搜索字段
+      }
+    }
+  },
+  methods: {
+    open () {
+      this.visible = true
+      this.queryParam = {}
+      this.replacePage()
+    },
+    // 获取表格数据
+    replacePage () {
+      const query = {
+        ...this.queryParam,
+        pageNo: this.ipagination.current,
+        pageSize: this.ipagination.pageSize
+      }
+      this.selectedRowKeys = []
+      this.loading = true
+      getStandardList(query).then((res) => {
+        this.loading = false
+        if (res.success) {
+          this.dataList = res.result.records
+          this.ipagination.total = res.result.total
+          this.selectedRowKeys = this.standard[this.query.db_field_name] ? this.standard[this.query.db_field_name].split(',') : []
+        } else {
+          this.dataList = []
+        }
+      })
+    },
+    searchQuery () {
+      this.replacePage()
+    },
+    searchReset () {
+      this.queryParam = {}
+      this.replacePage()
+    },
+    // 表格选择改变
+    onSelectChange (value, row) {
+      this.selectedRowKeys = value
+      this.selectedRowList = row
+    },
+    handleCancel () {
+      this.visible = false
+    },
+    handleSubmit () {
+      const serialNumber = []
+      const replaceStandardId = []
+      if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
+        // let content = JSON.parse(JSON.stringify(this.selectedRowList))
+        this.selectedRowList.forEach(res => {
+          serialNumber.push(res.serial_number)
+          replaceStandardId.push(res.id)
+        })
+        this.$emit('input', serialNumber.join(','))
+        this.$emit('change', this.query.dbFieldName, replaceStandardId.join(','))
+        // this.$emit('changecontent', this.content)
+        this.visible = false
+      } else {
+        this.$message.warning(this.$t('selectLeastOne'))
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>