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

src/api/api.js

@@ -118,6 +118,9 @@ const editCategoryItem = (params) => postAction('/sys/category/edit', params)
 // 通过文件的id获取文件的相应信息
 const getFileInfo = (params) => getAction('/sys/oss/file/queryById', params)
 
+// 标准选择框，分页查询标准数据
+const getStandardList = (params) => getAction('', params)
+
 export {
   addRole,
   editRole,
@@ -184,5 +187,7 @@ export {
   addTag,
   editTag,
   addCategoryItem,
-  editCategoryItem
+  editCategoryItem,
+
+  getStandardList
 }

src/common/lang/en-us.js

@@ -475,7 +475,9 @@ module.exports = {
   },
   // 标准选择器
   standardSelect: {
-    standardSelection: 'Standard Selection'
+    standardSelection: 'Standard Selection',
+    source: 'Source',
+    standardNumOrName: 'Standard number/Standard name'
   },
   // 用户/组织结构选择器
   userOrOrganSelect: {

src/common/lang/zh-cn.js

@@ -475,7 +475,9 @@ module.exports = {
   },
   // 标准选择器
   standardSelect: {
-    standardSelection: '标准选择'
+    standardSelection: '标准选择',
+    source: '来源',
+    standardNumOrName: '标准号/标准名称'
   },
   // 用户/组织结构选择器
   userOrOrganSelect: {

src/components/customField/AddForm.vue

@@ -215,7 +215,7 @@
                   style="width: 100%"
                   :tree-data="item.tree"
                   tree-checkable
-                  :placeholder="$t('PleaseSelect')+item.dbFieldTxt"
+                  :placeholder="$t('pleaseSelect')+item.dbFieldTxt"
                 />
               </a-form-model-item>
             </div>

src/components/selection/CurrencySearch.vue

@@ -1,209 +0,0 @@
-<template>
-  <a-form layout="inline" @keyup.enter.native="searchQuery">
-    <a-row :gutter="24">
-      <a-col :md="12" :sm="8" v-for="(item,index) in searchList" :key="index" style="line-height: 48px">
-        <template v-if="index < 3">
-          <!-- 树形选择器 -->
-          <template v-if="item.field_show_type === FieldType.TREE.value">
-            <a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-tree-select
-                tree-node-filter-prop="title"
-                v-model="queryParam[item.db_field_name]"
-                :maxTagCount="1"
-                :getPopupContainer="triggerNode=> triggerNode.parentNode"
-                :tree-data="item.tree"
-                tree-checkable
-                :placeholder="$t('pleaseSelect')+item.db_field_txt"
-              />
-            </a-form-item>
-          </template>
-          <!--  输入框 -->
-          <template
-            v-else-if="[FieldType.TEXT_STRING.value, FieldType.TEXT.value,FieldType.PERSON.value,
-                FieldType.STANDARD.value, FieldType.TEXT_LINK.value].includes(item.field_show_type)">
-            <a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input :placeholder="$t('pleaseEnter')+item.db_field_txt"
-                       v-model="queryParam[item.db_field_name]"></a-input>
-            </a-form-item>
-          </template>
-          <!--   数字输入框  -->
-          <template v-else-if="item.field_show_type === FieldType.TEXT_NUMBER.value">
-            <a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input-number :placeholder="$t('pleaseEnter')+item.db_field_txt"
-                              v-model="queryParam[item.db_field_name]" :min="1" :max="99999999"/>
-            </a-form-item>
-          </template>
-          <!--   字典多选框  -->
-          <template v-else-if="item.field_show_type === FieldType.PULL_MORE.value">
-            <a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <j-multi-select-tag v-model="queryParam[item.db_field_name]"
-                                  :placeholder="$t('pleaseSelect')+item.db_field_txt" :type="'select'"
-                                  :triggerChange="false" :dictCode="item.dict_field"/>
-            </a-form-item>
-          </template>
-          <!--   日期区间  -->
-          <template v-else-if="[FieldType.DATE_SINGLE.value, FieldType.DATE_MORE.value].includes(item.field_show_type)">
-            <a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-range-picker v-model="queryParam[item.db_field_name]"
-                              :placeholder="$t('pleaseSelect')+item.db_field_txt"
-                              format="YYYY-MM-DD" value-format="YYYY-MM-DD"
-                              @change="onChange(item.db_field_name)"></a-range-picker>
-            </a-form-item>
-          </template>
-          <!--  字典单选框  -->
-          <template v-else-if="item.field_show_type === FieldType.PULL_SINGLE.value">
-            <a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <j-dict-select-tag v-model="queryParam[item.db_field_name]"
-                                 :placeholder="$t('pleaseSelect')+item.db_field_txt"
-                                 :type="'select'"
-                                 :triggerChange="false" :dictCode="item.dict_field"/>
-            </a-form-item>
-          </template>
-        </template>
-        <template v-if="index >= 2 && toggleSearchStatus">
-          <!--   树形选择器   -->
-          <template v-if="item.field_show_type === FieldType.TREE.value">
-            <a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-tree-select
-                tree-node-filter-prop="title"
-                v-model="queryParam[item.db_field_name]"
-                :maxTagCount="1"
-                :getPopupContainer="triggerNode=> triggerNode.parentNode"
-                :tree-data="item.tree"
-                tree-checkable
-                :placeholder="$t('pleaseSelect')+item.db_field_txt"
-              />
-            </a-form-item>
-          </template>
-          <!--   输入框  -->
-          <template v-else-if="[FieldType.TEXT_STRING.value, FieldType.TEXT.value,FieldType.PERSON.value,
-                FieldType.STANDARD.value, FieldType.TEXT_LINK.value].includes(item.field_show_type)">
-            <a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input :placeholder="$t('pleaseEnter')+item.db_field_txt"
-                       v-model="queryParam[item.db_field_name]"></a-input>
-            </a-form-item>
-          </template>
-          <!--   数字输入框   -->
-          <template v-else-if="item.field_show_type === FieldType.TEXT_NUMBER.value">
-            <a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input-number :placeholder="$t('pleaseEnter')+item.db_field_txt"
-                              v-model="queryParam[item.db_field_name]" :min="1" :max="99999999"/>
-            </a-form-item>
-          </template>
-          <!--   字典多选框  -->
-          <template v-else-if="item.field_show_type === FieldType.PULL_MORE.value">
-            <a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <j-multi-select-tag v-model="queryParam[item.db_field_name]"
-                                  :placeholder="$t('pleaseSelect')+item.db_field_txt" :type="'select'"
-                                  :triggerChange="false" :dictCode="item.dict_field"/>
-            </a-form-item>
-          </template>
-          <!--   日期区间选择器  -->
-          <template v-else-if="[FieldType.DATE_SINGLE.value, FieldType.DATE_MORE.value].includes(item.field_show_type)">
-            <a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-range-picker v-model="queryParam[item.db_field_name]"
-                              format="YYYY-MM-DD" value-format="YYYY-MM-DD"
-                              @change="onChange(item.db_field_name)"></a-range-picker>
-            </a-form-item>
-          </template>
-          <!--   字典选择器  -->
-          <template v-else-if="item.field_show_type === FieldType.PULL_SINGLE.value">
-            <a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <j-dict-select-tag v-model="queryParam[item.db_field_name]"
-                                 :placeholder="$t('pleaseSelect')+item.db_field_txt"
-                                 :type="'select'"
-                                 :triggerChange="false" :dictCode="item.dict_field"/>
-            </a-form-item>
-          </template>
-        </template>
-      </a-col>
-      <span style="float: right;overflow: hidden;margin-right: 41px;margin-bottom: 20px"
-            class="table-page-search-submitButtons">
-                 <a @click="handleToggleSearch" v-if="searchList.length > 3">
-                    {{ !toggleSearchStatus ? $t('open') : $t('away') }}
-                    <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
-                 </a>
-                 <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>
-      </span>
-    </a-row>
-  </a-form>
-</template>
-
-<script>
-import { getAction } from '@/api/manage'
-export default {
-  name: 'CurrencySearch',
-  props: {
-    url: {
-      type: Object,
-      default: () => {
-        return {}
-      }
-    },
-    flag: {
-      type: String,
-      default: ''
-    },
-    queryParam: {
-      type: Object,
-      default: () => {
-        return {}
-      }
-    }
-  },
-  data () {
-    return {
-      // queryParam: {},
-      toggleSearchStatus: false,
-      searchList: []
-    }
-  },
-  mounted () {
-    this.getSearch()
-  },
-  methods: {
-    searchQuery () {
-      this.$emit('searchQuery', JSON.parse(JSON.stringify(this.queryParam)))
-    },
-    searchReset () {
-      this.queryParam = {}
-      this.$emit('searchReset', JSON.parse(JSON.stringify(this.queryParam)))
-    },
-    getSearch () {
-      const params = {
-        flag: this.flag
-      }
-      getAction(this.url.searchList, params).then((res) => {
-        if (res.success) {
-          this.searchList = res.result
-          this.searchList.push({
-            db_field_name: 'corresponding_standard',
-            db_field_txt: '对应标准',
-            dict_field: '',
-            field_show_type: '10',
-            tree: []
-          })
-        }
-      })
-    },
-    onChange (item) {
-      if (this.queryParam[item] && this.queryParam[item].length > 0) {
-        const startDate = item + '_start'
-        const endDate = item + '_end'
-        this.queryParam[startDate] = this.queryParam[item][0]
-        this.queryParam[endDate] = this.queryParam[item][1]
-      } else {
-        this.queryParam[item] = []
-      }
-    },
-    handleToggleSearch () {
-      this.toggleSearchStatus = !this.toggleSearchStatus
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/components/selection/StandardSelection.vue

@@ -8,53 +8,16 @@
         {{this.$t('standardSelect.standardSelection')}}
       </a-button>
     </div>
-    <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">
-        <currency-search
-          :flag="'1'"
-          :url="url"
-          :queryParam='queryParam'
-          @searchQuery="searchQuery"
-          @searchReset="searchReset"
-        />
-        <a-table
-          :components="drag(columns,'cloumns')"
-          :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>
+    <standard-selection-modal ref="standardSelectionModal" v-bind="$attrs" @input="modalInput" @change="modalChange"></standard-selection-modal>
   </div>
 </template>
 
 <script>
-import CurrencySearch from './CurrencySearch'
-import { ResizeHeader, ResizeColumnProvide } from '@/mixins/header'
-import { postAction } from '@/api/manage'
+import StandardSelectionModal from './StandardSelectionModal'
 
 export default {
   name: 'StandardSelection',
-  components: { CurrencySearch },
-  mixins: [ResizeColumnProvide, ResizeHeader],
+  components: { StandardSelectionModal },
   props: ['query', 'value', 'standard'],
   computed: {
     isDisabled () {
@@ -66,121 +29,22 @@ export default {
   },
   data () {
     return {
-      visible: false,
-      confirmLoading: false,
-      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' // 搜索字段
-      }
     }
   },
-  mounted () {
-    this.replacePage()
-  },
   methods: {
     // 点击选择标准按钮
     standardClick () {
-      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
-      postAction('document/bussDocumentLibraryEO/replacePageInfo', 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 = []
-        }
-      })
-    },
-    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'))
-      }
+      this.$refs.standardSelectionModal.open()
     },
+    // 输入框输入监听
     indexClick (event) {
       this.$emit('input', event.target.value)
     },
-    onSelectChange (value, row) {
-      this.selectedRowKeys = value
-      this.selectedRowList = row
+    modalInput (value) {
+      this.$emit('input', value)
     },
-    searchQuery (queryParam) {
-      const queryParamQuery = JSON.parse(JSON.stringify(queryParam))
-      Object.keys(queryParamQuery).forEach(res => {
-        if (queryParamQuery[res] instanceof Array) {
-          queryParamQuery[res] = queryParamQuery[res].join(',')
-        }
-      })
-      this.queryParam = queryParamQuery
-      this.replacePage()
-    },
-    searchReset (queryParam) {
-      this.queryParam = queryParam
-      this.replacePage()
+    modalChange (fieldName, value) {
+      this.$emit('change', fieldName, value)
     }
   }
 }

src/components/selection/StandardSelectionModal.vue

@@ -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>