著录事项

src/api/category/category.js

@@ -14,6 +14,15 @@ export function getCategoryType() {
   })
 }
 
+// 根据字典id查询子集
+export function FetchArchivesTypeManage(parameter) {
+  return request({
+    url: 'api/archives-type/manage',
+    method: 'get',
+    params: parameter
+  })
+}
+
 export function add(data) {
   data = Object.assign({ isTypeMetic: data.isType === 6 }, data)
   return request({

src/views/category/descriptionPreview/dictionarylist.json

@@ -1,242 +0,0 @@
-[
-  {
-    "id": "0155503daeb74d1b9b5e955362c1549d",
-    "dicName": "开放状态（数码照片）",
-    "dicCode": "1",
-    "dicExplain": "1111",
-    "dicSequence": 1,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1502808043000
-  },
-  {
-    "id": "08267a6b57904b25bddb217d8474b8a2",
-    "dicName": "实体分类号（基建档案）",
-    "dicCode": "JJ",
-    "dicExplain": "",
-    "dicSequence": 2,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1506405877000
-  },
-  {
-    "id": "34e8b82dda3a474392daea339de94088",
-    "dicName": "实体分类号（文书档案）",
-    "dicCode": "WS",
-    "dicExplain": "",
-    "dicSequence": 6,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1506404217000
-  },
-  {
-    "id": "548bd3451ab340e68bec3c38c9ec613c",
-    "dicName": "实体分类号（照片档案）",
-    "dicCode": "STFLH",
-    "dicExplain": "",
-    "dicSequence": 7,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1506576879000
-  },
-  {
-    "id": "6b7848261e284b7696678434d9493e25",
-    "dicName": "机构（问题）",
-    "dicCode": "JGWT",
-    "dicExplain": "",
-    "dicSequence": 10,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1502701875000
-  },
-  {
-    "id": "6bff273d4b634388936076cf17f385fe",
-    "dicName": "载体类型",
-    "dicCode": "ZTLX",
-    "dicExplain": "",
-    "dicSequence": 11,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1502716319000
-  },
-  {
-    "id": "7e37e1acfd144d8aa39cead27fdfdfb9",
-    "dicName": "实体分类号（科研档案）",
-    "dicCode": "KY",
-    "dicExplain": "",
-    "dicSequence": 12,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1506405843000
-  },
-  {
-    "id": "7ff29fcdfa0b4c4594554b7595b5b5a2",
-    "dicName": "照片格式（数码照片）",
-    "dicCode": "",
-    "dicExplain": "",
-    "dicSequence": 13,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1502808697000
-  },
-  {
-    "id": "80a4b7e0b96e4cc8b91ccf40f04d1ef9",
-    "dicName": "民族",
-    "dicCode": "MZ",
-    "dicExplain": "",
-    "dicSequence": 14,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1502716302000
-  },
-  {
-    "id": "83f43a7172174c9c8b72d28ffa4568c2",
-    "dicName": "文种",
-    "dicCode": "WZ",
-    "dicExplain": "",
-    "dicSequence": 15,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1502716739000
-  },
-  {
-    "id": "89e4dd6697904e409834f3223c10e341",
-    "dicName": "体裁特征（档案编研）",
-    "dicCode": "TCTZ",
-    "dicExplain": "",
-    "dicSequence": 16,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1506252920000
-  },
-  {
-    "id": "ba88ae3ef4ff45968a64aa5579b2c365",
-    "dicName": "归档标识",
-    "dicCode": "ZJBS",
-    "dicExplain": "",
-    "dicSequence": 17,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1502716666000
-  },
-  {
-    "id": "d02ffae28f0d4a9ca349c0f62935e7bc",
-    "dicName": "实物类型",
-    "dicCode": "SWLX",
-    "dicExplain": "",
-    "dicSequence": 18,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1502716333000
-  },
-  {
-    "id": "f08bc3b382914081ad4c85d103617e90",
-    "dicName": "密级",
-    "dicCode": "MJ",
-    "dicExplain": "",
-    "dicSequence": 20,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1502701884000
-  },
-  {
-    "id": "f646a296b4774d068ea4230c3fb46eb1",
-    "dicName": "全宗号",
-    "dicCode": "QZH",
-    "dicExplain": "",
-    "dicSequence": 21,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1506563573000
-  },
-  {
-    "id": "fc9f6f108dbf49058cd4c37478588296",
-    "dicName": "选题范围（档案编研）",
-    "dicCode": "XTFW",
-    "dicExplain": "",
-    "dicSequence": 22,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1506252853000
-  },
-  {
-    "id": "ffc7568110734450a0c919e11025a9f0",
-    "dicName": "照片类型",
-    "dicCode": "",
-    "dicExplain": "",
-    "dicSequence": 23,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1502802295000
-  },
-  {
-    "id": "72ef92154a3346cf815b217713787f99",
-    "dicName": "保管期限",
-    "dicCode": "BGQX",
-    "dicExplain": "",
-    "dicSequence": 24,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1518488145000
-  },
-  {
-    "id": "8788c42e706c41699dd5e47eddf4522d",
-    "dicName": "操作类型（档案保管）",
-    "dicCode": "CZLX",
-    "dicExplain": "用于库房管理",
-    "dicSequence": 25,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1520036877000
-  },
-  {
-    "id": "903355fdc98c4e409dfa19badacf7447",
-    "dicName": "实体分类号（实物档案）",
-    "dicCode": "STFL",
-    "dicExplain": "",
-    "dicSequence": 26,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1524754064000
-  },
-  {
-    "id": "92626488bab34b9bba7aad14cd8c44ab",
-    "dicName": "会计凭证（类别）",
-    "dicCode": "KJPZ",
-    "dicExplain": "",
-    "dicSequence": 27,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1524837185000
-  },
-  {
-    "id": "f46e7388709d406a93e811158201a9b4",
-    "dicName": "会计账簿（类别）",
-    "dicCode": "KJZB",
-    "dicExplain": "",
-    "dicSequence": 28,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1524839595000
-  },
-  {
-    "id": "21feabb625ba44a9b0cd11ce92468e64",
-    "dicName": "会计报告（类别）",
-    "dicCode": "KJBG",
-    "dicExplain": "",
-    "dicSequence": 29,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1524885086000
-  },
-  {
-    "id": "ba4b9d56ee234f1e9171418e4c0a7a54",
-    "dicName": "会计其他（类别）",
-    "dicCode": "KJQT",
-    "dicExplain": "",
-    "dicSequence": 30,
-    "dicType": 0,
-    "dicPid": "0",
-    "createTime": 1524891919000
-  }
-]

src/views/category/descriptionPreview/index.vue

@@ -5,7 +5,7 @@
         <p>字段调整 显示字段</p>
       </div>
       <ul class="des-fields">
-        <li v-for="(item,index) in showFields" v-show="item.isInput" :key="index" :class="[ fieldsActive == index ?'fields-active':'']" @click="selectField(index)">
+        <li v-for="(item,index) in allFieldsData" v-show="item.isInput" :key="index" :class="[ fieldsActive == index ?'fields-active':'']" @click="selectField(index)">
           <el-tooltip class="item" effect="dark" :content="item.fieldCnName" :enterable="false" placement="top">
             <p>{{ item.fieldCnName }}</p>
           </el-tooltip>
@@ -17,7 +17,7 @@
       <!-- 收起展开 -->
       <el-collapse-transition>
         <ul v-show="isCollaspeHiddenFields" class="des-fields">
-          <li v-for="(item,index) in showFields" v-show="!item.isInput" :key="index" :class="[ fieldsActive ==index ?'fields-active':'']" @click="selectField(index)">
+          <li v-for="(item,index) in allFieldsData" v-show="!item.isInput" :key="index" :class="[ fieldsActive == index ?'fields-active':'']" @click="selectField(index)">
             <el-tooltip class="item" effect="dark" :content="item.fieldCnName" :enterable="false" placement="top">
               <p>{{ item.fieldCnName }}</p>
             </el-tooltip>
@@ -34,7 +34,7 @@
       <div class="des-title">
         <p>界面预览效果</p>
       </div>
-      <PreviewForm :is-disabled="false" />
+      <PreviewForm :is-disabled="false" :all-fields-data="allFieldsData" />
     </div>
 
     <!-- 修改字段 -->
@@ -55,7 +55,7 @@
       <span class="dialog-left-bottom" />
       <div class="setting-dialog">
         <i class="drag-tip">提示：请通过拖动鼠标来调整当前顺序</i>
-        <PreviewForm :is-disabled="true" />
+        <PreviewForm :is-disabled="true" :all-fields-data="allFieldsData" />
         <div slot="footer" class="dialog-footer">
           <el-button type="primary" @click="previewFormVisible = false">保存</el-button>
         </div>
@@ -65,15 +65,23 @@
 </template>
 
 <script>
-import data from './data.json'
-import PreviewForm from './module/PreviewForm'
-import SettingForm from './module/SettingForm'
+import PreviewForm from '@/views/components/category/PreviewForm'
+import SettingForm from '@/views/components/category/SettingForm'
+import { FetchArchivesTypeManage } from '@/api/category/category'
 export default {
   name: 'DescriptionPreview',
   components: { PreviewForm, SettingForm },
+  props: {
+    selectedCategory: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
   data() {
     return {
-      showFields: [], // 假数据
+      allFieldsData: [],
       isCollaspeHiddenFields: true, // 隐藏字段收起展开
       settingFormVisible: false, // 修改编辑字段 - dialog
       previewFormVisible: false, // 界面预览form - dialog
@@ -81,11 +89,28 @@ export default {
       thisFields: {} // 当前项字段内容
     }
   },
+  watch: {
+    selectedCategory: function(newValue, oldValue) {
+      this.crud.refresh()
+    }
+  },
   mounted() {
-    this.showFields = data.data
-    this.thisFields = this.showFields[this.fieldsActive]
+    this.getArchivesType()
   },
   methods: {
+    getArchivesType() {
+      FetchArchivesTypeManage({ categoryId: this.selectedCategory.id }).then(res => {
+        this.allFieldsData = res
+        this.allFieldsData.forEach((item, index) => {
+          if (item.isInput) {
+            console.log(item)
+            // this.fieldsActive = index
+            // this.thisFields = arr[this.fieldsActive]
+            return
+          }
+        })
+      })
+    },
     handleClose(done) {
       this.settingFormVisible = false
       this.previewFormVisible = false
@@ -94,15 +119,12 @@ export default {
     },
     settingForm() {
       this.settingFormVisible = true
-      this.$nextTick(() => {
-        this.$refs.editForm.getDictrionaryList()
-      })
     },
     // 当前选中的字段
     selectField(index) {
       this.hiddenFieldsActive = -1
       this.fieldsActive = index
-      this.thisFields = this.showFields[this.fieldsActive]
+      this.thisFields = this.allFieldsData[this.fieldsActive]
     },
     // 修改字段"保存"提交
     editSubmit() {

src/views/category/descriptionPreview/module/PreviewForm.vue → src/views/components/category/PreviewForm.vue

@@ -2,24 +2,15 @@
   <div class="preview-content right-preview">
     <el-row :gutter="4">
       <el-form ref="addOrUpdateForm" :model="addOrUpdateForm" :rules="rules" label-width="100px">
-        <draggable v-bind="{draggable:'.dragg-item',animation:500}" :disabled="!isDisabled" @update="datadragEnd">
-          <el-col v-for="(item,index) in formPreviewData" :key="index" class="dragg-item" :span="item.isLine ? 24 : 12">
+        <draggable v-bind="{draggable:'.drag-item',animation:500}" :disabled="!isDisabled" @update="datadragEnd">
+          <el-col v-for="(item,index) in formPreviewData" :key="index" class="drag-item" :span="item.isLine ? 24 : 12">
             <el-form-item :label="item.fieldCnName" :prop="item.fieldName">
               <!-- select  -->
-              <!-- <el-select
-                v-if="item.isInputClass === 'select'"
-                v-model="addOrUpdateForm[item.fieldName]"
-                placeholder=""
-                :style="{ width: item.editLength+'px'}"
-                :disabled="isDisabled"
-                :validate-event="isDisabled"
-              >
-                <el-option v-for="option in selectData" :key="option.id" :label="option.dicName" :value="option.dicName" />
-              </el-select> -->
               <treeselect
                 v-if="item.isInputClass === 'select'"
-                :options="options"
-                :disable-branch-nodes="true"
+                v-model="addOrUpdateForm[item.fieldName]"
+                :options="item.options"
+                :normalizer="normalizer"
                 placeholder=""
                 :style="{ width: item.editLength+'px'}"
                 :disabled="isDisabled"
@@ -62,7 +53,16 @@
       <span class="dialog-right-top" />
       <span class="dialog-left-bottom" />
       <div class="setting-dialog">
-        <el-table ref="table" :data="tableData" highlight-current-row style="width: 100%;">
+        <el-table
+          ref="table"
+          :data="tableData"
+          highlight-current-row
+          row-key="id"
+          :tree-props="{children: 'childMenus', hasChildren: 'hasChildren'}"
+          style="width: 100%;"
+          @selection-change="handleSelectionChange"
+          @row-click="clickRowHandler"
+        >
           <el-table-column type="selection" width="55" />
           <el-table-column prop="dicName" label="字典名称" />
           <el-table-column prop="dicCode" label="字典代码" />
@@ -74,11 +74,10 @@
 </template>
 
 <script>
-import formData from '../data.json'
+import formData from './data.json'
 import draggable from 'vuedraggable'
 import Treeselect from '@riophae/vue-treeselect'
 import '@riophae/vue-treeselect/dist/vue-treeselect.css'
-// import { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
 import { FetchFindAllSubsetById } from '@/api/archivesConfig/dictDetail'
 export default {
   name: 'PreviewForm',
@@ -95,37 +94,57 @@ export default {
       addOrUpdateForm: {},
       rules: {},
       tableData: [],
-      selectData: {},
       popoverVisible: false,
-      options: []
-      // normalizer(node) {
-      //   return {
-      //     id: node.key,
-      //     label: node.name,
-      //     children: node.subOptions
-      //   }
-      // }
+      options: [],
+      normalizer(node) {
+        if (node.childMenus == null || node.childMenus === 'null') {
+          delete node.childMenus
+        }
+        return {
+          id: node.id,
+          label: node.dicName,
+          children: node.childMenus
+        }
+      }
     }
   },
   mounted() {
     this.formPreviewData = formData.data
     this.editFormRow()
-    this.loadDepts()
+    this.getAllSubset()
   },
   methods: {
-    // 获取弹窗内部门数据
-    loadDepts() {
-      FetchFindAllSubsetById({ id: '4028e3d480d116120180d116ebb60000' }).then(res => {
-        console.log(res)
-        this.options = res
-        // parentNode.children = res.content.map(function(obj) {
-        //   if (obj.hasChildren) {
-        //     obj.children = null
-        //   }
-        //   return obj
-        // })
+    // 获取对应字典子集数据
+    getAllSubset() {
+      this.formPreviewData.map(item => {
+        if (item.sysDictionaryId) {
+          FetchFindAllSubsetById({ id: item.sysDictionaryId }).then(res => {
+            if (item.isInputClass === 'select') {
+              item.options = res
+            } else if (item.isInputClass === 'popover') {
+              this.tableData = res
+            }
+          })
+        }
+      })
+    },
+    // popover - table 单选
+    clickRowHandler(row) {
+      this.$refs.table.clearSelection()
+      this.$refs.table.toggleRowSelection(row)
+    },
+    // popover - table 选中得项
+    handleSelectionChange(val) {
+      this.formPreviewData.map(item => {
+        if (item.sysDictionaryId && item.isInputClass === 'popover') {
+          if (val.length > 0) {
+            this.addOrUpdateForm[item.fieldName] = val[0].dicName
+          }
+          this.popoverVisible = false
+        }
       })
     },
+    // 动态生成表单
     editFormRow(row) {
       this.rules = {}
       this.formPreviewData.map(item => {
@@ -139,18 +158,18 @@ export default {
       })
       this.addOrUpdateForm = Object.assign({}, row)
     },
+    // 预览界面排序
     datadragEnd(evt) {
       evt.preventDefault()
       console.log('拖动前的索引 :' + evt.oldIndex)
       console.log('拖动后的索引 :' + evt.newIndex)
-      // console.log(this.colors)// 拖拽排序后会改变原先数据索引(排序)
+      // console.log(this.formPreviewData)// 拖拽排序后会改变原先数据索引(排序)
       // console.log('获取拖拽改变数据索引后，拖动前的索引的元素 :' +
-      //           this.colors[evt.oldIndex])
+      //           this.formPreviewData[evt.oldIndex])
       // console.log('获取拖拽改变数据索引后，被拖拽的元素 :' +
-      //           this.colors[evt.newIndex])
+      //           this.formPreviewData[evt.newIndex])
     },
     submitForm(formName) {
-      console.log(this.addOrUpdateForm)
       this.$refs[formName].validate((valid) => {
         if (valid) {
           alert('submit!')

src/views/category/descriptionPreview/module/SettingForm.vue → src/views/components/category/SettingForm.vue

@@ -33,8 +33,8 @@
 
           <el-form-item label="对应字典" prop="sysDictionaryId">
             <el-input v-if="isDisabled" v-model="form.sysDictionaryId" readonly />
-            <el-select v-else v-model="form.sysDictionaryId" placeholder="">
-              <el-option v-for="item in dictionaryData" :key="item.id" :label="item.dicName" :value="item.dicCode" />
+            <el-select v-else v-model="form.sysDictionaryId" placeholder="" value-key="dicName" @change="selectDictionary">
+              <el-option v-for="item in dictionaryData" :key="item.id" :label="item.dicName" :value="item.id" />
             </el-select>
           </el-form-item>
           <el-form-item label="显示长度" prop="editLength">
@@ -82,7 +82,6 @@
 </template>
 
 <script>
-// import dictionarylist from '../dictionarylist.json'
 import { getDicts } from '@/api/archivesConfig/dict'
 export default {
   name: 'SettingForm',
@@ -168,6 +167,7 @@ export default {
       ],
       // 对应字典
       dictionaryData: []
+      // dictionaryId: null
     }
   },
   watch: {
@@ -230,9 +230,11 @@ export default {
         this.dictionaryData = res
       })
     },
+    // selectDictionary(value) {
+    //   this.dictionaryId = value
+    // },
     // 著录形式为'下拉框'、'弹出框'的，对应字典不为空，反之为空
     selectInputClass(value) {
-      console.log(value)
       if (value === 'select' || value === 'popover') {
         this.getDictrionaryList()
       } else {
@@ -292,6 +294,13 @@ export default {
       }
     },
     submitForm(formName) {
+      // 对应字典必填判断
+      if (this.form.isInputClass === 'select' || this.form.isInputClass === 'popover') {
+        if (!this.form.sysDictionaryId) {
+          this.$message.error('对应字典项不可为空！')
+          return
+        }
+      }
       // 选择'自动补零'，位数必填
       if (this.form.isFilling) {
         if (!this.form.fillingDigit) {
@@ -299,6 +308,7 @@ export default {
           return
         }
       }
+      // 显示长度限制
       if (this.form.editLength) {
         if (this.form.editLength > 510) {
           this.$message.error('显示长度最大510')

src/views/category/descriptionPreview/data.json → src/views/components/category/data.json

@@ -4,11 +4,11 @@
 	"data": [{
 		"id": "FFAFBB1647D459C82085A",
 		"categoryId": "FFAFBB1647D459C82080A",
-		"sysDictionaryId": null,
+		"sysDictionaryId": "4028e3d480d116120180d116ebb60000",
 		"fieldName": "department",
 		"fieldCnName": "部门名称",
 		"isDefaultValue": "",
-		"isInputClass": "text",
+		"isInputClass": "select",
 		"isDataType": 1,
 		"isDataTypeDetails": "varchar",
 		"isColumnLength": 100,
@@ -39,11 +39,11 @@
 	}, {
 		"id": "FFAFBB1647D459C82082D",
 		"categoryId": "FFAFBB1647D459C82080A",
-		"sysDictionaryId": null,
+		"sysDictionaryId": "4028e3d480d116120180d116ebb60000",
 		"fieldName": "archive_no",
 		"fieldCnName": "档号",
 		"isDefaultValue": "",
-		"isInputClass": "text",
+		"isInputClass": "popover",
 		"isDataType": 1,
 		"isDataTypeDetails": "varchar",
 		"isColumnLength": 100,
@@ -60,7 +60,7 @@
 		"isInherit": true,
 		"isFilling": true,
 		"fillingDigit": 2,
-		"isRepeat": true,
+		"isRepeat": false,
 		"isDisplay": true,
 		"displayOrder": 2,
 		"isDisplayformat": true,
@@ -109,7 +109,7 @@
 	}, {
 		"id": "FFAFBB1647D459C82084C",
 		"categoryId": "FFAFBB1647D459C82080A",
-		"sysDictionaryId": "BGQX",
+		"sysDictionaryId": "EAC68B9FE234EDE61B2200",
 		"fieldName": "retention",
 		"fieldCnName": "保管期限",
 		"isDefaultValue": "",