档案管理

src/views/archivesManage/archivesList/archivesDetail.vue

@@ -34,11 +34,14 @@
       <span class="dialog-right-top" />
       <span class="dialog-left-bottom" />
       <div class="setting-dialog">
+        <!-- tab -->
         <ul class="archives-tab">
           <li :class="{'active': archivesTabIndex == 0}" @click="changeActiveTab(0)">基本信息</li>
           <li v-if="isEditOrAdd !== 'add'" :class="{'active': archivesTabIndex == 1}" @click="changeActiveTab(1)">上传附件</li>
         </ul>
+        <!-- form -->
         <PreviewForm v-if="formPreviewData.length && archivesTabIndex == 0" ref="previewForm" :is-disabled="false" :form-preview-data.sync="formPreviewData" :selected-category="selectedCategory" :arc-id="arcId" />
+        <!-- 上传附件 -->
         <UploadFile v-if="archivesTabIndex==1" />
         <div slot="footer" class="dialog-footer">
           <el-button :loading="crud.status.cu === 2" type="primary" @click="handlerArchivesSubmit">保存</el-button>
@@ -143,7 +146,7 @@ export default {
           group: false
         },
         queryOnPresenterCreated: false,
-        sort: ['department,asc']
+        sort: []
       })
     ]
   },
@@ -173,7 +176,8 @@ export default {
       selectedData: null,
       archivesTabIndex: 0, // 新增
       tabDisabled: true,
-      arcId: null // 档案ID
+      arcId: null, // 档案ID
+      arrySort: []
     }
   },
   watch: {
@@ -207,12 +211,20 @@ export default {
       getTableDisplayFields({ categoryId: this.selectedCategory.id }).then(data => {
         this.tableDisplayFields = data
         this.getTableDisplayFieldsLoading = false
-        return true
+
+        this.tableDisplayFields.map(item => {
+          if (item.displayOrder) {
+            this.arrySort.push(item.fieldName + ', ' + (item.displayOrder === 1 ? 'asc' : 'desc'))
+          }
+        })
+        console.log(this.arrySort)
       })
+      this.crud.sort = this.arrySort
     },
     [CRUD.HOOK.beforeToCU](crud, form, btn) {
       this.isEditOrAdd = btn
       this.selectedData = crud.selections
+      this.archivesTabIndex = 0
       if (this.isEditOrAdd === 'add') {
         this.tabDisabled = true
         this.arcId = null
@@ -232,27 +244,12 @@ export default {
             this.$refs.previewForm.addOrUpdateForm = this.selectedData[0]
           }
         })
-        return true
       })
     },
-    // [CRUD.HOOK.beforeToEdit](crud, form, btn) {
-    //   console.log(this.crud)
-    //   this.$nextTick(() => {
-    //     console.log(this.$refs.previewForm)
-    //   })
-    // },
     changeActiveTab(index) {
       this.archivesTabIndex = index
     },
     handlerArchivesSubmit() {
-      // let arcId
-      // if (this.isEditOrAdd === 'add') {
-      //   arcId = null
-      //   this.tabDisabled = true
-      // } else if (this.isEditOrAdd === 'edit') {
-      //   arcId = this.selectedData[0].id
-      //   this.tabDisabled = false
-      // }
       this.$refs.previewForm.submitForm('addOrUpdateForm')
     },
     // table - 当前选中得row
@@ -313,6 +310,9 @@ export default {
       height: calc(100vh - 174px);
     }
     .preview-content {
+      width: auto !important;
+      padding: 20px 144px 0 150px!important;
+      margin-right: 6px;
       overflow: hidden;
       overflow-y: auto;
       .el-textarea__inner {

src/views/archivesManage/archivesList/module/uploadFile.vue

@@ -11,7 +11,7 @@
       ref="table"
       :data="tableData"
       style="min-width: 100%"
-      height="calc(100vh - 315px)"
+      height="calc(100vh - 382px)"
       @row-click="clickRowHandler"
       @selection-change="selectionChangeHandler"
     >
@@ -24,7 +24,7 @@
       <el-table-column prop="fileCover" label="缩览图" min-width="60" align="center">
         <template slot-scope="scope">
           <div v-if="scope.row.fileCover">
-            <img width="60px" height="32px" :src="scope.row.fileCover" @click="showCoverVisible=true">
+            <img width="60px" height="32px" style="object-fit:cover;" :src="scope.row.fileCover" @click="showCoverVisible=true">
           </div>
         </template>
       </el-table-column>
@@ -32,23 +32,25 @@
     </el-table>
 
     <!-- 点击缩略图看大图 -->
-    <el-dialog class="preview-dialog" :modal-append-to-body="false" :close-on-click-modal="false" :before-close="handleClose" :visible="showCoverVisible" title="查看大图">
+    <el-dialog class="preview-dialog" :append-to-body="true" :close-on-click-modal="false" :before-close="handleClose" :visible="showCoverVisible" title="查看大图">
       <span class="dialog-right-top" />
       <span class="dialog-left-bottom" />
-      <div class="setting-dialog">
-        <img src="https://qiniu.aiyxlib.com/yuekan-5-h5bg.jpg">
+      <div class="setting-dialog" style="max-height:calc(100vh - 230px); overflow:auto;">
+        <img style="width:100%; height:100%;" src="https://qiniu.aiyxlib.com/yuekan-5-h5bg.jpg">
       </div>
     </el-dialog>
   </div>
 </template>
 
 <script>
-// import CRUD, { presenter, header } from '@crud/crud'
-// import crudOperation from '@crud/CRUD.operation'
+import { form } from '@crud/crud'
 import data from './data.json'
 export default {
   name: 'UploadFile',
   components: {},
+  mixins: [
+    form({})
+  ],
   data() {
     return {
       tableData: [],
@@ -67,7 +69,7 @@ export default {
       this.selections = val
     },
     handleClose(done) {
-      this.deleteData = {}
+      this.showCoverVisible = false
       done()
     }
   }

src/views/components/category/PreviewForm.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="preview-content right-preview">
     <el-row :gutter="4">
-      <el-form ref="addOrUpdateForm" :model="addOrUpdateForm" :rules="rules" label-width="120px">
+      <el-form ref="addOrUpdateForm" :model="addOrUpdateForm" :rules="rules" :validate-on-rule-change="false" label-width="120px">
         <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">
@@ -140,8 +140,8 @@ export default {
     // 获取对应字典子集数据
     getAllSubset() {
       this.formPreviewData.map(item => {
+        this.$set(item, 'options', [])
         if (item.dictionaryConfigId) {
-          this.$set(item, 'options', [])
           FetchFindAllSubsetById({ id: item.dictionaryConfigId.id }).then(res => {
             if (item.isInputClass === 'select') {
               this.$set(item, 'options', res)
@@ -182,7 +182,6 @@ export default {
     // tree - select
     selectTree(val) {
       this.addOrUpdateForm[this.treeCurrentFiled.fieldName] = val.dicName
-      this.getAllSubset()
       // 自动重复字段 - 是否重复 - treeSelect方式
       if (this.treeCurrentFiled.isRepeat) {
         const params = {
@@ -212,13 +211,12 @@ export default {
       this.popoverVisible = true
       this.currentFieldName = item.fieldName
       this.tableData = []
-      this.getAllSubset()
     },
     // 动态生成表单
     editFormRow() {
       this.rules = {}
       this.formPreviewData.map(item => {
-        this.$set(this.addOrUpdateForm, item.fieldName, '')
+        // this.$set(this.addOrUpdateForm, item.fieldName, '')
         if (item.isInputClass === 'select') {
           this.$set(this.addOrUpdateForm, item.fieldName, null) // 防止unkonwn
         }
@@ -251,6 +249,13 @@ export default {
           }
         }
       })
+      const parent_id = this.selectedCategory.pid
+      if (parseInt(parent_id) === 0) {
+        this.addOrUpdateForm.parent_id = null
+      } else {
+        this.addOrUpdateForm.parent_id = parent_id
+      }
+      delete this.addOrUpdateForm.id
       console.log(this.addOrUpdateForm)
       this.$refs[formName].validate((valid) => {
         if (valid) {
@@ -260,13 +265,16 @@ export default {
             'jsonString': JSON.stringify(this.addOrUpdateForm)
           }
           edit(params).then(res => {
-            this.$notify({
-              title: res,
-              type: 'success',
-              duration: 2500
-            })
-            this.crud.status.add = CRUD.STATUS.NORMAL
-            this.crud.refresh()
+            if (res) {
+              this.$notify({
+                title: res,
+                type: 'success',
+                duration: 2500
+              })
+              this.crud.status.add = CRUD.STATUS.NORMAL
+              this.crud.status.edit = CRUD.STATUS.NORMAL
+              this.crud.refresh()
+            }
           })
         } else {
           console.log('error submit!!')