Merge remote-tracking branch 'origin/fourthStage-treeSelect' into fourthStage

src/components/customField/AddForm.vue

@@ -134,16 +134,25 @@
                                :label-in-value="false"
                                :placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
                 <!--16、树形弹框选择-->
-                <tree-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"
-                                :placeholder="$t('pleaseSelect')+item.dbFieldTxt"
-                                v-model="formInline[item.dbFieldName]"
-                                @nameChange="treeSelectNameChange"
-                                :filedName="item.dbFieldName"
-                                type="checkbox"
-                                :options-href="item.fieldHref"
-                                :nameStr="formInline[item.dbFieldName + '_dictText']"
-                                :dict-id="item.dictId"
-                                :disabled="disabled || disabledFieldList.includes(item.dbFieldName)" />
+<!--                <tree-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"-->
+<!--                                :placeholder="$t('pleaseSelect')+item.dbFieldTxt"-->
+<!--                                v-model="formInline[item.dbFieldName]"-->
+<!--                                @nameChange="treeSelectNameChange"-->
+<!--                                :filedName="item.dbFieldName"-->
+<!--                                type="checkbox"-->
+<!--                                :options-href="item.fieldHref"-->
+<!--                                :nameStr="formInline[item.dbFieldName + '_dictText']"-->
+<!--                                :dict-id="item.dictId"-->
+<!--                                :disabled="disabled || disabledFieldList.includes(item.dbFieldName)" />-->
+                <tree-data-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"
+                                     :placeholder="$t('pleaseSelect')+item.dbFieldTxt"
+                                     v-model="formInline[item.dbFieldName]"
+                                     :fieldName="item.dbFieldName"
+                                     :nameStr="formInline[item.dbFieldName + '_dictText']"
+                                     @nameChange="treeDataSelectNameChange"
+                                     :optionsHref="item.treeFirstHref"
+                                     :dict-id="item.dictId"
+                                     :disabled="disabled || disabledFieldList.includes(item.dbFieldName)"/>
               </a-form-model-item>
             </div>
           </template>
@@ -174,10 +183,11 @@ import JMultipleDatePicker from '../JMultipleDatePicker'
 import UserSelection from '../selection/UserSelection'
 import { getAction } from '../../api/manage.js'
 import { ajaxGetDictItems, getDictByCode, getFormDictTreeList } from '../../api/api.js'
-import TreeSelection from '../selection/TreeSelection'
+// import TreeSelection from '../selection/TreeSelection'
 import { getStandardGradeClassification } from '../../api/enterpriseStandardLibraryApi'
 import STreeSelect from '../STreeSelect'
-import { getDomesticStandardDetail } from '../../api/standardRegulationLibraryApi';
+import { getDomesticStandardDetail } from '../../api/standardRegulationLibraryApi'
+import TreeDataSelection from '../selection/TreeDataSelection'
 
 // 本系统限制可以上传的文件格式
 const CAN_UPLOAD_FILE_TYPE = 'pdf,docx,doc,xlsx,xls,ppt,pptx,rar,zip,jpg,jpeg,png,avi,wmv,mov,rm,mp4,cad'
@@ -193,8 +203,9 @@ export default {
     JDictSelectTag,
     JMultiSelectTag,
     UploadFile,
-    TreeSelection,
-    STreeSelect
+    // TreeSelection,
+    STreeSelect,
+    TreeDataSelection
   },
   props: {
     url: {
@@ -859,6 +870,9 @@ export default {
     treeSelectNameChange (value, fieldName) {
       this.formInline[fieldName + '_dictText'] = value
     },
+    treeDataSelectNameChange (value, fieldName) {
+      this.formInline[fieldName + '_dictText'] = value
+    },
     submit () {
       this.$refs.ruleForm.validate(valid => {
         if (valid) {

src/components/selection/TreeDataSelectModal.vue

@@ -0,0 +1,531 @@
+<template>
+  <j-modal
+    :title="$t('userSelect.select')"
+    :width="width"
+    :visible="visible"
+    switchFullscreen
+    :maskClosable="false"
+    :confirmLoading="confirmLoading"
+    @ok="handleOk"
+    @cancel="handleCancel">
+
+    <div class="modal-content">
+      <a-spin :spinning="topLoading">
+        <a-input-search style="margin-bottom: 1px" :placeholder="$t('pleaseEnter') + $t('treeSelection.primaryNodeName')" @search="onSearch" />
+        <a-tree
+          ref="tree"
+          :checkable="checkable"
+          :checkStrictly="true"
+          :replaceFields="replaceFields"
+          :class="treeScreenClass"
+          :treeData="treeData"
+          :autoExpandParent="autoExpandParent"
+          @check="onCheck"
+          @select="onSelect"
+          @expand="onExpand"
+          @load="onLoad"
+          :loadData="loadData"
+          :expandedKeys="expandedKeys"
+          :checkedKeys="checkedKeys"
+          :loadedKeys="loadedKeys"
+          :selectedKeys.sync="selectedKeys">
+
+          <template slot="title" slot-scope="{dataRef}">
+          <span v-if="searchValue && dataRef[replaceFields.title].indexOf(searchValue) > -1">
+            <span style="color: #f50">{{ dataRef[replaceFields.title] }}</span>
+          </span>
+            <span v-else>{{ dataRef[replaceFields.title] }}</span>
+          </template>
+        </a-tree>
+      </a-spin>
+    </div>
+
+    <p class="modal-content-title">{{ $t('treeSelection.selectedData') }}</p>
+    <a-spin :spinning="bottomLoading">
+      <div v-if="dataSourceRight && dataSourceRight.length > 0" class="name-content">
+        <div v-for="(item, index) in dataSourceRight" :key="item[replaceFields.key]" class="name-div">
+          {{ item[replaceFields.title] }}
+          <a-icon type="close" @click="handleDelete(item, index)" />
+        </div>
+      </div>
+      <a-empty v-else />
+    </a-spin>
+
+    <!--底部父子关联操作和确认取消按钮-->
+    <template slot="footer" v-if="treeOpera && checkable">
+      <div class="drawer-bootom-button">
+        <a-dropdown style="float: left" :trigger="['click']" placement="topCenter">
+          <a-menu slot="overlay">
+            <a-menu-item key="1" @click="switchCheckStrictly(2)">{{ $t('parentChildConnection') }}</a-menu-item>
+            <a-menu-item key="2" @click="switchCheckStrictly(1)">{{ $t('cancelConnection') }}</a-menu-item>
+          </a-menu>
+          <a-button>
+            {{ treeOperationText }} <a-icon type="up" />
+          </a-button>
+        </a-dropdown>
+<!--        <a-button style="float: left" @click="switchCheckStrictly(parentChildRelate ? 1 : 2)">{{ treeOperationText }}</a-button>-->
+        <a-button @click="handleCancel" type="primary" style="margin-right: 0.8rem">{{ $t('close') }}</a-button>
+        <a-button @click="handleOk" type="primary" >{{ $t('confirm') }}</a-button>
+      </div>
+    </template>
+  </j-modal>
+</template>
+
+<script>
+import { getAction, postAction } from '../../api/manage'
+
+export default {
+  name: 'TreeDataSelectModal',
+  props: {
+    value: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    checkable: { // 是否多选
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    // 是否校验必选
+    checkRequired: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    // 获取数据的接口
+    optionsHref: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    // 标签库的限制，只能选第三级
+    isTagLibraryRestriction: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    dictId: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    treeOpera: { // 是否可以切换父子关联
+      type: Boolean,
+      required: false,
+      default: true
+    }
+  },
+  computed: {
+    treeScreenClass () {
+      return {
+        'my-dept-select-tree': true,
+        fullscreen: this.fullscreen
+      }
+    },
+    treeOperationText () {
+      return this.parentChildRelate ? this.$t('parentChildConnection') : this.$t('cancelConnection')
+    }
+  },
+  watch: {
+    // 是否只能选第三级
+    isTagLibraryRestriction (val) {
+      if (val) {
+        this.setOnlySelectThreeLevel(this.treeData)
+      }
+    },
+    value (val) {
+      if (val) {
+        this.checkedKeys = val.split(',')
+      }
+    },
+    optionsHref: {
+      immediate: true,
+      handler (val) {
+        console.log('-------------optionsHref', val)
+        if (val === '/laws/standard/partName/queryFirstList') {
+          // 是涉及系统/部件
+          this.replaceFields = { children: 'childPartNameList', title: 'name', key: 'code' }
+          this.lazyLoadHref = '/laws/standard/partName/getChild'
+          this.searchFieldName = 'nodeName'
+          this.lazyLoadPidFieldName = 'parentCode'
+        } else { // 标签库
+          this.replaceFields = { children: 'childrenList', title: 'itemText', key: 'itemValue' }
+          this.lazyLoadHref = '/laws/dictTree/getChild'
+          this.searchFieldName = 'nodeName'
+          this.lazyLoadPidFieldName = 'dictItemId'
+        }
+      }
+    }
+  },
+  created () {
+    // if (this.treeOpera) {
+    //   this.switchCheckStrictly(1)
+    // }
+  },
+  data () {
+    return {
+      width: 800,
+      visible: false,
+      confirmLoading: false,
+      topLoading: false,
+      bottomLoading: false,
+      parentChildRelate: true, // 父子节点是否关联
+      autoExpandParent: false, // 是否自动展开父节点
+      treeData: [],
+      expandedKeys: [],
+      checkedKeys: [],
+      checkedRows: [],
+      selectedKeys: [],
+      loadedKeys: [],
+      searchValue: '', // 查询框内容
+      replaceFields: {},
+      dataSourceRight: [],
+      lazyLoadHref: '', // 懒加载接口
+      searchFieldName: '', // 查询传的字段名
+      lazyLoadPidFieldName: '' // 懒加载传父级的字段名
+    }
+  },
+  methods: {
+    show () {
+      this.visible = true
+      this.treeData = []
+      this.checkedRows = []
+      this.checkedKeys = []
+      this.loadedKeys = []
+      this.selectedKeys = []
+      this.dataSourceRight = []
+      this.searchValue = ''
+      this.getTreeData()
+      if (this.value) {
+        if (this.checkable) {
+          this.checkedKeys = this.value.split(',')
+        } else {
+          this.selectedKeys = this.value.split(',')
+        }
+        // 初始化选中数据列表
+        this.getSelectedList(this.value)
+      }
+      this.$forceUpdate()
+    },
+    onCheck (checkedKeys, info) {
+      console.log('----------onCheck', checkedKeys)
+      console.log('----------info.checked', info.checked)
+      console.log('----------info.node', info.node.dataRef)
+      if (this.checkable) {
+        // 是多选
+        if (this.parentChildRelate) {
+          // 是父子关联
+          if (info.checked) {
+            // 是选中数据了
+            let childrenList = []
+            if (info.node.dataRef[this.replaceFields.children]) {
+              // 有子节点获取子节点数据
+              childrenList = info.node.dataRef[this.replaceFields.children].map(item => item[this.replaceFields.key])
+            }
+            this.checkedKeys = [...this.checkedKeys, ...checkedKeys.checked, ...childrenList]
+          } else {
+            // 是取消选中了，把当前和子节点都取消选中
+            let currAndChildNode = []
+            if (info.node.dataRef[this.replaceFields.children]) {
+              // 有子节点获取子节点数据
+              const childrenNode = info.node.dataRef[this.replaceFields.children].map(item => item[this.replaceFields.key])
+              currAndChildNode = [...childrenNode, info.node.dataRef[this.replaceFields.key]]
+            } else {
+              currAndChildNode = [info.node.dataRef[this.replaceFields.key]]
+            }
+            this.checkedKeys = this.checkedKeys.filter(item => !currAndChildNode.includes(item))
+          }
+          // 处理下方显示已选数据
+          if (info.checked) {
+            console.log('------------增加了数据')
+            // 说明是增加了数据,把点击的数据和子数据追加进去
+            for (const key of checkedKeys.checked) {
+              // 当前选中没在选中列表中的加进去
+              if (!this.dataSourceRight.find(item => item[this.replaceFields.key] === key)) {
+                // 右侧不存在，追加到右侧表格
+                this.dataSourceRight.push(info.node.dataRef)
+              }
+            }
+            if (info.node.dataRef[this.replaceFields.children]) {
+              // 有子集追加
+              for (const keyItem of info.node.dataRef[this.replaceFields.children]) {
+                // 当前选中的子集没在列表中的加进去
+                if (!this.dataSourceRight.find(item => item[this.replaceFields.key] === keyItem[this.replaceFields.key])) {
+                  // 右侧不存在，追加到右侧表格
+                  this.dataSourceRight.push(keyItem)
+                }
+              }
+            }
+          } else {
+            console.log('----------删除了数据')
+            // 说明是删除了数据
+            if (this.checkedKeys && this.checkedKeys.length > 0) {
+              // 还有选中数据，从dataSourceRight里面找到点击的数据和他的子数据清空
+              for (let i = 0; i < this.dataSourceRight.length; i++) {
+                if (!this.checkedKeys.find(item => item === this.dataSourceRight[i][this.replaceFields.key])) {
+                  // 表格选中中没有找到这一条数据，说明已经被删了
+                  this.dataSourceRight.splice(i, 1)
+                  i--
+                }
+              }
+            } else {
+              // 已经没有选中数据了，直接清空展示数据
+              this.dataSourceRight = []
+            }
+          }
+        } else {
+          // 不是父子关联
+          console.log('-----------checkedKeys', this.checkedKeys, checkedKeys)
+          if (info.checked) {
+            // 是选中数据了
+            this.checkedKeys = [...this.checkedKeys, ...checkedKeys.checked]
+          } else {
+            // 是取消选中了
+            this.checkedKeys = this.checkedKeys.filter(item => item !== info.node.dataRef[this.replaceFields.key])
+          }
+          // 处理下方显示已选数据
+          if (info.checked) {
+            console.log('------------不父子关联增加了数据')
+            // 说明是增加了数据,把点击的数据追加进去
+            for (const key of checkedKeys.checked) {
+              // 当前选中没在选中列表中的加进去
+              if (!this.dataSourceRight.find(item => item[this.replaceFields.key] === key)) {
+                // 右侧不存在，追加到右侧表格
+                this.dataSourceRight.push(info.node.dataRef)
+              }
+            }
+          } else {
+            console.log('----------不父子关联删除了数据')
+            // 说明是删除了数据
+            if (this.checkedKeys && this.checkedKeys.length > 0) {
+              // 还有选中数据，从dataSourceRight里面找到点击的数据和他的子数据清空
+              for (let i = 0; i < this.dataSourceRight.length; i++) {
+                if (!this.checkedKeys.find(item => item === this.dataSourceRight[i][this.replaceFields.key])) {
+                  // 表格选中中没有找到这一条数据，说明已经被删了
+                  this.dataSourceRight.splice(i, 1)
+                  i--
+                }
+              }
+            } else {
+              // 已经没有选中数据了，直接清空展示数据
+              this.dataSourceRight = []
+            }
+          }
+        }
+      }
+    },
+    onSelect (selectedKeys, info) {
+      // 取消关联的情况下才走onSelect的逻辑
+      if (!this.parentChildRelate) {
+        if (selectedKeys && selectedKeys.length > 0) {
+          // 说明是选中了数据
+          this.selectedKeys = [...selectedKeys]
+          this.dataSourceRight = [info.node.dataRef]
+        } else {
+          // 没有数据，直接清空
+          this.selectedKeys = []
+          this.dataSourceRight = []
+        }
+      }
+    },
+    onLoad (loadedKeys) {
+      this.loadedKeys = loadedKeys
+    },
+    onExpand (expandedKeys) {
+      console.log('========expandedKeys', expandedKeys)
+      this.expandedKeys = expandedKeys
+    },
+    // 异步加载
+    async loadData (node) {
+      console.log('-------------loadData', node)
+      if (node.dataRef.children) {
+        return
+      }
+      this.topLoading = true
+      const params = {}
+      if (this.optionsHref !== '/laws/standard/partName/queryFirstList') {
+        // 不是涉及系统部件
+        params.dictId = this.dictId
+      }
+      // 查询条件的名称
+      if (this.searchValue) {
+        params[this.searchFieldName] = this.searchValue
+      }
+      // 父节点id
+      if (this.optionsHref === '/laws/standard/partName/queryFirstList') {
+        // 是涉及系统部件
+        params[this.lazyLoadPidFieldName] = node.dataRef.code
+      } else {
+        params[this.lazyLoadPidFieldName] = node.dataRef.id
+      }
+      await getAction(this.lazyLoadHref, params).then(res => {
+        if (res.success) {
+          node.dataRef[this.replaceFields.children] = res.result.record || res.result
+        }
+      }).finally(() => {
+        this.topLoading = false
+      })
+    },
+    handleCancel () {
+      this.visible = false
+    },
+    close () {
+      this.visible = false
+      this.checkedKeys = []
+      this.expandedKeys = []
+      this.loadedKeys = []
+      this.dataSourceRight = []
+      this.treeData = []
+      this.searchValue = ''
+    },
+    onSearch (value) {
+      this.searchValue = value
+      // this.autoExpandParent = true
+      this.getTreeData()
+      this.expandedKeys = []
+      this.loadedKeys = []
+      this.$forceUpdate()
+    },
+    // 设置树只能选第三级
+    setOnlySelectThreeLevel (treeData) {
+      for (const item of treeData) {
+        item.disabled = item.level + '' !== '3'
+        item.disableCheckbox = item.level + '' !== '3'
+        if (item.childPartNameList && item.childPartNameList.length > 0) {
+          this.setOnlySelectThreeLevel(item.childPartNameList)
+        }
+      }
+    },
+    // 切换父子关联
+    switchCheckStrictly (v) {
+      if (v === 1) {
+        // 取消父子关联
+        this.parentChildRelate = false
+      } else if (v === 2) {
+        // 增加父子关联
+        this.parentChildRelate = true
+      }
+    },
+    getTreeData () {
+      this.topLoading = true
+      const params = {}
+      if (this.optionsHref !== '/laws/standard/partName/queryFirstList') {
+        // 不是涉及系统部件
+        params.dictId = this.dictId
+      }
+      // 查询条件的名称
+      if (this.searchValue) {
+        params[this.searchFieldName] = this.searchValue
+      }
+      getAction(this.optionsHref, params).then(res => {
+        if (res.success) {
+          this.treeData = res.result.records || res.result
+        }
+      }).finally(() => {
+        this.topLoading = false
+      })
+    },
+    // 已选数据列表的删除
+    handleDelete (record, index) {
+      this.dataSourceRight.splice(index, 1)
+      if (this.checkable) {
+        // 多选从checkedKeys里面筛选出去
+        this.checkedKeys = this.checkedKeys.filter(item => item !== record[this.replaceFields.key])
+      } else {
+        // 单选从selectedKeys里面筛选出去
+        this.selectedKeys = this.selectedKeys.filter(item => item !== record[this.replaceFields.key])
+      }
+    },
+    handleOk () {
+      if (this.checkRequired && (!this.checkedKeys || this.checkedKeys.length === 0)) {
+        this.$message.warning(this.$t('selectLeastOne'))
+        return
+      }
+      this.$emit('nameChange', this.dataSourceRight.map(item => item[this.replaceFields.title]).join(','))
+      this.$emit('change', this.dataSourceRight.map(item => item[this.replaceFields.key]).join(','))
+      this.$emit('listChange', this.dataSourceRight)
+      this.close()
+    },
+    getSelectedList (codes) {
+      this.bottomLoading = true
+      const params = {
+        selectNodeCodes: codes,
+        dictId: this.dictId
+      }
+      let url
+      // 涉及系统/部件
+      if (this.optionsHref === '/laws/standard/partName/queryFirstList') {
+        url = '/laws/standard/partName/echo'
+      } else { // 标签库
+        url = '/laws/dictTree/echo'
+      }
+      if (!url) {
+        return
+      }
+      postAction(url, params).then(res => {
+        if (res.success) {
+          this.dataSourceRight = JSON.parse(JSON.stringify(res.result))
+        }
+      }).finally(() => {
+        this.bottomLoading = false
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+/deep/ .ant-modal-content {
+  padding-bottom: 18px;
+}
+.my-dept-select-tree{
+  height:350px;
+
+  &.fullscreen{
+    height: calc(100vh - 250px);
+  }
+  overflow-y: scroll;
+}
+
+.modal-content-title {
+  color: #1D2129;
+  font-weight: 500;
+  margin-right: 12px;
+  margin-bottom: 0;
+  margin-top: 16px;
+}
+
+.drawer-bootom-button {
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  border-top: 1px solid #e8e8e8;
+  padding: 10px 16px;
+  text-align: right;
+  left: 0;
+  background: #fff;
+  border-radius: 0 0 2px 2px;
+}
+
+.name-content {
+  display: flex;
+  flex-wrap: wrap;
+  max-height: 200px;
+  overflow-y: auto;
+  .name-div {
+    width: auto;
+    padding: 5px 16px;
+    margin-right: 12px;
+    margin-top: 8px;
+    background: rgba(213, 44, 38, 0.08);
+    border-radius: 4px 4px 4px 4px;
+    opacity: 1;
+    color: @primary-color;
+    white-space: nowrap;
+    /deep/ .anticon {
+      margin-left: 4px;
+    }
+  }
+}
+</style>

src/components/selection/TreeDataSelection.vue

@@ -0,0 +1,152 @@
+<template>
+  <div class="components-input-demo-presuffix">
+    <div class="user-organ-wrap">
+      <a-input class="user-input"
+               :class="{'input-readonly': !disabled,'user-input': showBtn}"
+               @click="openModal"
+               :disabled="disabled"
+               :placeholder="placeholder"
+               v-model="nameStr"
+               :title="nameStr"
+               readOnly>
+        <a-icon v-if="nameStr" slot="suffix" type="close-circle" @click="handleEmpty" title="清空"/>
+      </a-input>
+      <a-button type="primary" class="button-box" @click="openModal" :disabled="disabled" v-if="showBtn && !disabled">
+        {{ $t('select') }}
+      </a-button>
+    </div>
+
+    <tree-data-select-modal
+      ref="selectModal"
+      :checkable="checkable"
+      :value="value"
+      :dict-id="dictId"
+      v-bind="$attrs"
+      :options-href="optionsHref"
+      @change="handleChange"
+      @nameChange="nameChange"
+      @listChange="listChange"/>
+  </div>
+</template>
+
+<script>
+import TreeDataSelectModal from './TreeDataSelectModal'
+
+export default {
+  name: 'TreeDataSelection',
+  components: { TreeDataSelectModal },
+  props: {
+    checkable: { // 是否多选
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    value: {
+      type: String,
+      required: false
+    },
+    disabled: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    // 获取数据的接口
+    optionsHref: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    // 名称字符串
+    nameStr: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    fieldName: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    dictId: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    showBtn: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    placeholder: {
+      type: String,
+      default: ''
+    }
+  },
+  watch: {
+    nameStr: {
+      immediate: true,
+      handler (val) {
+        console.log('----------nameStr', val)
+      }
+    }
+  },
+  data () {
+    return {
+      visible: false,
+      confirmLoading: false
+    }
+  },
+  methods: {
+    openModal () {
+      this.$refs.selectModal.show()
+    },
+    handleChange (value) {
+      this.$emit('change', value, this.fieldName)
+    },
+    nameChange (value) {
+      this.$emit('nameChange', value, this.fieldName)
+    },
+    listChange (value) {
+      this.$emit('listChange', value, this.fieldName)
+    },
+    handleEmpty () {
+      if (this.disabled) {
+        return
+      }
+      this.handleChange('')
+      this.nameChange('')
+      this.listChange([])
+    }
+  },
+  model: {
+    prop: 'value',
+    event: 'change'
+  }
+}
+</script>
+
+<style scoped lang="less">
+.user-organ-wrap {
+  width: 100%;
+  position: relative;
+  display: flex;
+  align-items: center;
+  //height: 39.98px;
+
+  .user-input {
+    resize: none;
+    //width: calc(100% - 70px);
+  }
+
+  // 因为需要加title，所以不能把鼠标事件去掉
+  /deep/ .input-readonly.ant-input-disabled {
+    background: #fff;
+    color: rgba(0, 0, 0, 0.65);
+    cursor: default;
+  }
+
+  .button-box {
+    margin-left: 5px;
+  }
+}
+</style>

src/views/documentTool/documentSplit/modules/SplitAddForm.vue

@@ -150,8 +150,8 @@
                                  :label-in-value="false"
                                  @change="updateDom"
                                  :placeholder="$t('pleaseSelect')+item.dbFieldTxt + getPlaceholderSuffix(item)" />
-                  <!--16、树形弹框选择-->
-                  <tree-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"
+                  <!--16、树形弹框选择 属性标识字段-->
+                  <tree-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value && item.dbFieldName === 'property_tag'"
                                   :placeholder="$t('pleaseSelect')+item.dbFieldTxt + getPlaceholderSuffix(item)"
                                   v-model="formInline[item.dbFieldName]"
                                   :filedName="item.dbFieldName"
@@ -163,6 +163,16 @@
                                   :children-column-name="getTreeSelectionChildrenColumnName(item)"
                                   :is-tag-library-restriction="item.dbFieldName === 'property_tag'"
                                   :search-field-name="item.dbFieldName === 'property_tag' ? 'firstNodeName' : null" />
+                  <!--16、树形弹框选择 标签内容维护或者零部件名称的字段-->
+                  <tree-data-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"
+                                       :placeholder="$t('pleaseSelect')+item.dbFieldTxt + getPlaceholderSuffix(item)"
+                                       v-model="formInline[item.dbFieldName]"
+                                       :fieldName="item.dbFieldName"
+                                       :nameStr="formInline[item.dbFieldName + '_dictText']"
+                                       @nameChange="treeDataSelectNameChange"
+                                       :optionsHref="item.treeFirstHref"
+                                       :disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
+                                       :dict-id="item.dictId"/>
                 </a-form-model-item>
               </div>
             </template>
@@ -238,6 +248,7 @@ import { getAction } from '../../../../api/manage'
 import { getFormDictTreeList } from '../../../../api/api'
 import STreeSelect from '../../../../components/STreeSelect'
 import TreeSelection from '../../../../components/selection/TreeSelection'
+import TreeDataSelection from '../../../../components/selection/TreeDataSelection'
 
 export default {
   name: 'SplitAddForm',
@@ -248,7 +259,8 @@ export default {
     UploadFile,
     StandardSelection,
     SplitDetailAddTypeCheck,
-    STreeSelect
+    STreeSelect,
+    TreeDataSelection
   },
   data () {
     return {
@@ -581,6 +593,10 @@ export default {
       this.formInline[this.uploadName] = attIdList.join(',')
       this.formInline = { ...this.formInline }
     },
+    // 树形弹框名称改变
+    treeDataSelectNameChange (value, fieldName) {
+      this.formInline[fieldName + '_dictText'] = value
+    },
     // 正则替换小数点
     limitNumber (value) {
       if (typeof value === 'string') {

src/views/documentTool/documentSplit/modules/SplitDetailBatchEditDrawer.vue

@@ -146,7 +146,7 @@
                                  :label-in-value="false"
                                  :placeholder="$t('pleaseSelect')+item.dbFieldTxt + getPlaceholderSuffix(item)" />
                   <!--16、树形弹框选择-->
-                  <tree-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"
+                  <tree-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value && item.dbFieldName === 'property_tag'"
                                   :placeholder="$t('pleaseSelect')+item.dbFieldTxt + getPlaceholderSuffix(item)"
                                   v-model="formInline[item.dbFieldName]"
                                   :filedName="item.dbFieldName"
@@ -158,6 +158,15 @@
                                   :children-column-name="getTreeSelectionChildrenColumnName(item)"
                                   :is-tag-library-restriction="item.dbFieldName === 'property_tag'"
                                   :search-field-name="item.dbFieldName === 'property_tag' ? 'firstNodeName' : null" />
+                  <tree-data-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"
+                                       :placeholder="$t('pleaseSelect')+item.dbFieldTxt + getPlaceholderSuffix(item)"
+                                       v-model="formInline[item.dbFieldName]"
+                                       :fieldName="item.dbFieldName"
+                                       :nameStr="formInline[item.dbFieldName + '_dictText']"
+                                       @nameChange="treeDataSelectNameChange"
+                                       :optionsHref="item.treeFirstHref"
+                                       :disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
+                                       :dict-id="item.dictId"/>
                 </a-form-model-item>
               </div>
             </template>
@@ -187,10 +196,11 @@ import { getFormDictTreeList } from '../../../../api/api'
 import { getAction } from '../../../../api/manage'
 import STreeSelect from '../../../../components/STreeSelect'
 import TreeSelection from '../../../../components/selection/TreeSelection'
+import TreeDataSelection from '../../../../components/selection/TreeDataSelection'
 
 export default {
   name: 'SplitDetailBatchEditDrawer',
-  components: { TreeSelection, UserSelection, StandardSelection, UploadFile, JMultipleDatePicker, STreeSelect },
+  components: { TreeSelection, UserSelection, StandardSelection, UploadFile, JMultipleDatePicker, STreeSelect, TreeDataSelection },
   data () {
     return {
       FieldType,
@@ -384,6 +394,10 @@ export default {
       this.formInline[this.uploadName] = attIdList.join(',')
       this.formInline = { ...this.formInline }
     },
+    // 树形弹框名称改变
+    treeDataSelectNameChange (value, fieldName) {
+      this.formInline[fieldName + '_dictText'] = value
+    },
     handleSave () {
       if (this.confirmLoading) {
         return

src/views/workCenter/annualRevisionPlanActivelyReport/modules/ContactEnterSendTaskModal.vue

@@ -402,15 +402,23 @@
                 </span>
               </div>
               <a-form-model-item class="item-model" prop="componentName">
-                <tree-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"
-                                v-model="formInline.componentName"
-                                @nameChange="treeSelectNameChange"
-                                filedName="componentName"
-                                type="checkbox"
-                                :nameStr="formInline.componentName_dictText"
-                                options-href="/laws/standard/partName/"
-                                :disabled="disabled" />
-                </a-form-model-item>
+<!--                <tree-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"-->
+<!--                                v-model="formInline.componentName"-->
+<!--                                @nameChange="treeSelectNameChange"-->
+<!--                                filedName="componentName"-->
+<!--                                type="checkbox"-->
+<!--                                :nameStr="formInline.componentName_dictText"-->
+<!--                                options-href="/laws/standard/partName/"-->
+<!--                                :disabled="disabled" />-->
+                <tree-data-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"
+                                     v-model="formInline.componentName"
+                                     fieldName="componentName"
+                                     :nameStr="formInline.componentName_dictText"
+                                     @nameChange="treeSelectNameChange"
+                                     optionsHref="/laws/standard/partName/queryFirstList"
+                                     dict-id="1696007957666533377"
+                                     :disabled="disabled"/>
+              </a-form-model-item>
             </div>
             <!--  授权部门  -->
             <div class="box-title-text form-flex-item-half">
@@ -545,10 +553,11 @@ import Vue from 'vue'
 import { USER_INFO } from '@/store/mutation-types'
 // import { getEnStandardNo } from '@/api/workCenter'
 import TreeSelection from '@/components/selection/TreeSelection'
+import TreeDataSelection from '../../../../components/selection/TreeDataSelection'
 
 export default {
   name: 'ContactEnterSendTaskModal',
-  components: { UserSelection, StandardSelection, UploadFile, TreeSelection },
+  components: { UserSelection, StandardSelection, UploadFile, TreeSelection, TreeDataSelection },
   props: {
     // 是否可以编辑新企标编号
     canEditNewStandardNumber: {

src/views/workCenter/annualRevisionPlanStandardizationInit/modules/BaseInfoTableModal.vue

@@ -381,14 +381,22 @@
                 </span>
               </div>
               <a-form-model-item class="item-model" prop="componentName">
-                <tree-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"
-                                v-model="formInline.componentName"
-                                @nameChange="treeSelectNameChange"
-                                filedName="componentName"
-                                type="checkbox"
-                                :nameStr="formInline.componentName_dictText"
-                                options-href="/laws/standard/partName/"
-                                :disabled="disabled" />
+<!--                <tree-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"-->
+<!--                                v-model="formInline.componentName"-->
+<!--                                @nameChange="treeSelectNameChange"-->
+<!--                                filedName="componentName"-->
+<!--                                type="checkbox"-->
+<!--                                :nameStr="formInline.componentName_dictText"-->
+<!--                                options-href="/laws/standard/partName/"-->
+<!--                                :disabled="disabled" />-->
+                <tree-data-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"
+                                     v-model="formInline.componentName"
+                                     fieldName="componentName"
+                                     :nameStr="formInline.componentName_dictText"
+                                     @nameChange="treeSelectNameChange"
+                                     optionsHref="/laws/standard/partName/queryFirstList"
+                                     dict-id="1696007957666533377"
+                                     :disabled="disabled"/>
               </a-form-model-item>
             </div>
             <!--  授权部门  -->
@@ -522,10 +530,11 @@ import Vue from 'vue'
 import { USER_INFO } from '@/store/mutation-types'
 import TreeSelection from '@/components/selection/TreeSelection'
 import { ajaxGetDictItems } from '@/api/api'
+import TreeDataSelection from '../../../../components/selection/TreeDataSelection'
 
 export default {
   name: 'BaseInfoTableModal',
-  components: { UserSelection, StandardSelection, UploadFile, TreeSelection },
+  components: { UserSelection, StandardSelection, UploadFile, TreeSelection, TreeDataSelection },
   props: {
     /**
      * 部所联络人汇总节点的话三个日期标准化填了的，主起草人不能修改；是联络人的话标准化未填写，联络人必填

src/views/workCenter/enterpriseStandardChange/modules/BaseInfoForm.vue

@@ -198,14 +198,22 @@
               </span>
           </div>
           <a-form-model-item class="item-model" prop="partName">
-            <tree-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"
-                            v-model="formInline.partName"
-                            @nameChange="treeSelectNameChange"
-                            filedName="partName"
-                            type="checkbox"
-                            :nameStr="formInline.partName_dictText"
-                            options-href="/laws/standard/partName/"
-                            :disabled="disabled" />
+<!--            <tree-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"-->
+<!--                            v-model="formInline.partName"-->
+<!--                            @nameChange="treeSelectNameChange"-->
+<!--                            filedName="partName"-->
+<!--                            type="checkbox"-->
+<!--                            :nameStr="formInline.partName_dictText"-->
+<!--                            options-href="/laws/standard/partName/"-->
+<!--                            :disabled="disabled" />-->
+            <tree-data-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"
+                                 v-model="formInline.partName"
+                                 fieldName="partName"
+                                 :nameStr="formInline.partName_dictText"
+                                 @nameChange="treeSelectNameChange"
+                                 optionsHref="/laws/standard/partName/queryFirstList"
+                                 dict-id="1696007957666533377"
+                                 :disabled="disabled"/>
           </a-form-model-item>
         </div>
         <!--  主起草人  -->
@@ -370,6 +378,7 @@ import UserSelection from '@/components/selection/UserSelection'
 import UploadFile from '@/components/UploadFile'
 import TreeSelection from '@/components/selection/TreeSelection'
 import STreeSelect from '@/components/STreeSelect'
+import TreeDataSelection from '../../../../components/selection/TreeDataSelection'
 
 export default {
   name: 'BaseInfoForm',
@@ -378,7 +387,8 @@ export default {
     UserSelection,
     UploadFile,
     TreeSelection,
-    STreeSelect
+    STreeSelect,
+    TreeDataSelection
   },
   props: {
     disabled: {

src/views/workCenter/enterpriseStandardInitChange/modules/ApprovalBaseInfo.vue

@@ -350,14 +350,22 @@
                   </span>
             </div>
             <a-form-model-item class="item-model" prop="componentName">
-              <tree-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"
-                              v-model="formInline.componentName"
-                              @nameChange="treeSelectNameChange"
-                              filedName="componentName"
-                              type="checkbox"
-                              :nameStr="formInline.componentName_dictText"
-                              options-href="/laws/standard/partName/"
-                              :disabled="disabled" />
+<!--              <tree-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"-->
+<!--                              v-model="formInline.componentName"-->
+<!--                              @nameChange="treeSelectNameChange"-->
+<!--                              filedName="componentName"-->
+<!--                              type="checkbox"-->
+<!--                              :nameStr="formInline.componentName_dictText"-->
+<!--                              options-href="/laws/standard/partName/"-->
+<!--                              :disabled="disabled" />-->
+              <tree-data-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"
+                                   v-model="formInline.componentName"
+                                   fieldName="componentName"
+                                   :nameStr="formInline.componentName_dictText"
+                                   @nameChange="treeSelectNameChange"
+                                   optionsHref="/laws/standard/partName/queryFirstList"
+                                   dict-id="1696007957666533377"
+                                   :disabled="disabled"/>
             </a-form-model-item>
           </div>
           <!--  授权部门  -->
@@ -625,10 +633,11 @@ import {
   getStandardGradeClassification
 } from '@/api/enterpriseStandardLibraryApi'
 import { getWorkGroupTreeList, ajaxGetDictItems } from '@/api/api'
+import TreeDataSelection from '../../../../components/selection/TreeDataSelection'
 
 export default {
   name: 'ApprovalBaseInfo',
-  components: { StandardSelection, UserSelection, UploadFile, TreeSelection },
+  components: { StandardSelection, UserSelection, UploadFile, TreeSelection, TreeDataSelection },
   props: {
     projectType: {
       type: [Number, String],

src/views/workCenter/enterpriseStandardInitChange/modules/MergeBaseInfo.vue

@@ -351,14 +351,22 @@
                 </span>
           </div>
           <a-form-model-item class="item-model" prop="componentName">
-            <tree-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"
-                            v-model="formInline.componentName"
-                            @nameChange="treeSelectNameChange"
-                            filedName="componentName"
-                            type="checkbox"
-                            :nameStr="formInline.componentName_dictText"
-                            options-href="/laws/standard/partName/"
-                            :disabled="disabled" />
+<!--            <tree-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"-->
+<!--                            v-model="formInline.componentName"-->
+<!--                            @nameChange="treeSelectNameChange"-->
+<!--                            filedName="componentName"-->
+<!--                            type="checkbox"-->
+<!--                            :nameStr="formInline.componentName_dictText"-->
+<!--                            options-href="/laws/standard/partName/"-->
+<!--                            :disabled="disabled" />-->
+            <tree-data-selection :placeholder="$t('pleaseSelect')+$t('workCenter.enterpriseInitChangePlan.partName')"
+                                 v-model="formInline.componentName"
+                                 fieldName="componentName"
+                                 :nameStr="formInline.componentName_dictText"
+                                 @nameChange="treeSelectNameChange"
+                                 optionsHref="/laws/standard/partName/queryFirstList"
+                                 dict-id="1696007957666533377"
+                                 :disabled="disabled"/>
           </a-form-model-item>
         </div>
         <!--  主起草人  -->
@@ -445,10 +453,11 @@ import {
 import { getFormDictTreeList, ajaxGetDictItems } from '@/api/api'
 import TreeSelection from '@/components/selection/TreeSelection'
 import { getEnStandardNo } from '@/api/workCenter'
+import TreeDataSelection from '../../../../components/selection/TreeDataSelection'
 
 export default {
   name: 'MergeBaseInfo',
-  components: { EnterprisePlanSelection, UserSelection, UploadFile, TreeSelection },
+  components: { EnterprisePlanSelection, UserSelection, UploadFile, TreeSelection, TreeDataSelection },
   props: {
     disabled: {
       type: Boolean,

src/views/workCenter/enterpriseStandardRevision/modules/BaseInfoForm.vue

@@ -167,15 +167,24 @@
                              :label-in-value="false"
                              :placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
               <!--16、树形弹框选择-->
-              <tree-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"
-                              :placeholder="$t('pleaseSelect')+item.dbFieldTxt"
-                              v-model="formInline[item.dbFieldName]"
-                              @nameChange="treeSelectNameChange"
-                              :filedName="item.dbFieldName"
-                              type="checkbox"
-                              :nameStr="formInline[item.dbFieldName + '_dictText']"
-                              :options-href="item.fieldHref"
-                              :disabled="disabled || disabledFieldList.includes(item.dbFieldName)" />
+<!--              <tree-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"-->
+<!--                              :placeholder="$t('pleaseSelect')+item.dbFieldTxt"-->
+<!--                              v-model="formInline[item.dbFieldName]"-->
+<!--                              @nameChange="treeSelectNameChange"-->
+<!--                              :filedName="item.dbFieldName"-->
+<!--                              type="checkbox"-->
+<!--                              :nameStr="formInline[item.dbFieldName + '_dictText']"-->
+<!--                              :options-href="item.fieldHref"-->
+<!--                              :disabled="disabled || disabledFieldList.includes(item.dbFieldName)" />-->
+              <tree-data-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"
+                                   :placeholder="$t('pleaseSelect')+item.dbFieldTxt"
+                                   v-model="formInline[item.dbFieldName]"
+                                   :fieldName="item.dbFieldName"
+                                   :nameStr="formInline[item.dbFieldName + '_dictText']"
+                                   @nameChange="treeSelectNameChange"
+                                   :optionsHref="item.treeFirstHref"
+                                   :dict-id="item.dictId"
+                                   :disabled="disabled || disabledFieldList.includes(item.dbFieldName)"/>
             </a-form-model-item>
           </div>
         </template>
@@ -200,7 +209,7 @@ import StandardSelection from '@/components/selection/StandardSelection'
 import UploadFile from '@/components/UploadFile'
 import EnterprisePlanSelection from '@/components/selection/EnterprisePlanSelection'
 import TreeSelection from '@/components/selection/TreeSelection'
-import error from '../../../result/Error'
+import TreeDataSelection from '../../../../components/selection/TreeDataSelection'
 
 export default {
   name: 'BaseInfoForm',
@@ -210,7 +219,8 @@ export default {
     StandardSelection,
     UploadFile,
     EnterprisePlanSelection,
-    TreeSelection
+    TreeSelection,
+    TreeDataSelection
   },
   props: {
     // 流程发起类型，是自动发起（auto）的还是从新建流程发起的(newProcess)

src/views/workCenter/standardEntryOrChangeProcess/StandardEntryOrChangeProcess.vue

@@ -255,16 +255,25 @@
                                    :label-in-value="false"
                                    :placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
                     <!--16、树形弹框选择-->
-                    <tree-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"
-                                    :placeholder="$t('pleaseSelect')+item.dbFieldTxt"
-                                    v-model="formInline[item.dbFieldName]"
-                                    @nameChange="treeSelectNameChange"
-                                    :filedName="item.dbFieldName"
-                                    type="checkbox"
-                                    :options-href="item.fieldHref"
-                                    :nameStr="formInline[item.dbFieldName + '_dictText']"
-                                    :dict-id="item.dictId"
-                                    :disabled="disabled || disabledFieldList.includes(item.dbFieldName) || isLook" />
+<!--                    <tree-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"-->
+<!--                                    :placeholder="$t('pleaseSelect')+item.dbFieldTxt"-->
+<!--                                    v-model="formInline[item.dbFieldName]"-->
+<!--                                    @nameChange="treeSelectNameChange"-->
+<!--                                    :filedName="item.dbFieldName"-->
+<!--                                    type="checkbox"-->
+<!--                                    :options-href="item.fieldHref"-->
+<!--                                    :nameStr="formInline[item.dbFieldName + '_dictText']"-->
+<!--                                    :dict-id="item.dictId"-->
+<!--                                    :disabled="disabled || disabledFieldList.includes(item.dbFieldName) || isLook" />-->
+                    <tree-data-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"
+                                         :placeholder="$t('pleaseSelect')+item.dbFieldTxt"
+                                         v-model="formInline[item.dbFieldName]"
+                                         :fieldName="item.dbFieldName"
+                                         :nameStr="formInline[item.dbFieldName + '_dictText']"
+                                         @nameChange="treeSelectNameChange"
+                                         :optionsHref="item.treeFirstHref"
+                                         :dict-id="item.dictId"
+                                         :disabled="disabled || disabledFieldList.includes(item.dbFieldName) || isLook"/>
                   </a-form-model-item>
                 </div>
               </template>
@@ -369,6 +378,7 @@ import {
 } from '../../../api/workCenter'
 import { WorkCenterMixin } from '../../../mixins/WorkCenterMixin'
 import STreeSelect from '../../../components/STreeSelect'
+import TreeDataSelection from '../../../components/selection/TreeDataSelection'
 
 export default {
   name: 'StandardEntryOrChangeProcess',
@@ -382,7 +392,8 @@ export default {
     ProcessDetailList,
     UserSelectModal,
     TreeSelection,
-    STreeSelect
+    STreeSelect,
+    TreeDataSelection
   },
   mixins: [WorkCenterMixin],
   data () {