From c6b929e9197e7204a1efbd32d550e989bc7410b8 Mon Sep 17 00:00:00 2001
From: z_yu <1534695664@qq.com>
Date: Tue, 7 Jun 2022 17:33:03 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A1=A3=E6=A1=88=E7=AE=A1=E7=90=86=20?=
 =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E5=AD=97=E6=AE=B5=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../archivesList/archivesDetail.vue           | 51 ++++++++++++++-----
 1 file changed, 37 insertions(+), 14 deletions(-)

diff --git a/src/views/archivesManage/archivesList/archivesDetail.vue b/src/views/archivesManage/archivesList/archivesDetail.vue
index 5e23cd1..42c7fa4 100644
--- a/src/views/archivesManage/archivesList/archivesDetail.vue
+++ b/src/views/archivesManage/archivesList/archivesDetail.vue
@@ -22,25 +22,25 @@
       </crudOperation>
     </div>
     <!--表单组件-->
-    <el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title">
+    <el-dialog class="preview-dialog" append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title">
       <span class="dialog-right-top" />
       <span class="dialog-left-bottom" />
       <div class="setting-dialog">
-        <el-form ref="form" :model="form" rules="rules" size="small" label-width="80px">
+        <el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
           <el-col v-for="(item) in formPreviewData" :key="item.id" class="dragg-item" :span="item.isLine ? 24 : 12">
             <el-form-item :label="item.fieldCnName" :prop="item.fieldName">
               <!-- select  -->
               <!--  :disabled="isDisabled":validate-event="isDisabled" -->
-              <el-select v-if="item.displayformatType === 'select'" v-model="form[item.fieldName]" placeholder="" :style="{ width: item.displayformatWidth+'px'}">
+              <el-select v-if="item.isInputClass === 'select'" v-model="form[item.fieldName]" placeholder="" :style="{ width: item.editLength+'px'}">
                 <el-option v-for="option in selectData" :key="option.id" :label="option.dicName" :value="option.dicName" />
               </el-select>
               <!-- text / number / textarea / popover -->
               <!--  :disabled="isDisabled":validate-event="isDisabled" -->
-              <el-input v-if="item.displayformatType !== 'select' && item.displayformatType !== 'date'" v-model="form[item.fieldName]" :type="item.displayformatType === 'popover'? 'text' : item.displayformatType" :rows="item.displayformatType === 'textarea' ? 3 : ''" :class="{'input-popover':(item.displayformatType === 'popover')}" :style="{ width: item.displayformatWidth+'px'}">
-                <i v-if="item.displayformatType === 'popover'" slot="suffix" class="el-input__icon iconfont icon-weibiaoti-2" @click="popoverVisible = true" />
+              <el-input v-if="item.isInputClass !== 'select' && item.isInputClass !== 'date'" v-model="form[item.fieldName]" :type="item.isInputClass === 'popover'? 'text' : item.isInputClass" :rows="item.isInputClass === 'textarea' ? 3 : ''" :class="{'input-popover':(item.isInputClass === 'popover')}" :style="{ width: item.editLength+'px'}">
+                <i v-if="item.isInputClass === 'popover'" slot="suffix" class="el-input__icon iconfont icon-weibiaoti-2" @click="popoverVisible = true" />
               </el-input>
               <!-- date -->
-              <el-date-picker v-if="item.displayformatType === 'date'" v-model="form[item.fieldName]" type="date" align="right" format="yyyy-MM-dd" placeholder="" :clearable="false" :style="{ width: item.displayformatWidth+'px'}" />
+              <el-date-picker v-if="item.isInputClass === 'date'" v-model="form[item.fieldName]" type="date" align="right" format="yyyy-MM-dd" placeholder="" :clearable="false" :style="{ width: item.editLength+'px'}" />
             </el-form-item>
           </el-col>
         </el-form>
@@ -77,8 +77,7 @@
     <el-table ref="table" v-loading="crud.loading || getTableDisplayFieldsLoading" :data="crud.data" highlight-current-row style="width: 100%;" @selection-change="crud.selectionChangeHandler" @row-click="clickRowHandler">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column type="index" label="序号" width="55" align="center" />
-      <!-- :align="field.displayformatType" :width="field.displayformatWidth" -->
-      <el-table-column v-for="field in tableDisplayFields" :key="field.id" :label="field.fieldCnName" show-overflow-tooltip>
+      <el-table-column v-for="field in tableDisplayFields" :key="field.id" :label="field.fieldCnName" :align="field.displayformatType" :width="field.displayLength" show-overflow-tooltip>
         <template slot-scope="scope">
           {{ scope.row[field.fieldName] }}
         </template>
@@ -94,7 +93,6 @@ import { add, edit, getTableDisplayFields, getFormDisplayFields } from '@/api/ar
 import CRUD, { presenter, header, form } from '@crud/crud'
 import crudOperation from '@crud/CRUD.operation'
 import pagination from '@crud/Pagination'
-const defaultForm = {}
 
 export default {
   components: { crudOperation, pagination },
@@ -124,7 +122,7 @@ export default {
     // form(function() {
     //   return Object.assign({ dicPid: this.dicPid }, defaultForm)
     // })
-    form(defaultForm)
+    form({})
   ],
   data() {
     return {
@@ -149,7 +147,10 @@ export default {
       getTableDisplayFieldsLoading: false,
       formPreviewData: [],
       rules: {},
-      popoverVisible: false
+      popoverVisible: false,
+      selectData: [],
+      tableData: [],
+      defaultForm: {}
     }
   },
   methods: {
@@ -164,17 +165,19 @@ export default {
     },
     [CRUD.HOOK.beforeToCU]() {
       getFormDisplayFields({ categoryId: 'FFAFBB1647D459C82080A' }).then(data => {
-        this.formPreviewData = data.showFiled.filter((fields) => { return fields.isDisplay })
+        this.formPreviewData = data.showFiled.filter((fields) => { return fields.isInput })
         this.formPreviewData.map(item => {
           this.rules[item.fieldName] = [
             {
               required: item.isRequired,
-              message: (item.displayformatType === 'text' ? '请输入' : '请选择') + item.fieldCnName,
-              trigger: item.displayformatType === 'text' ? 'blur' : 'change'
+              message: (item.isInputClass === 'text' ? '请输入' : '请选择') + item.fieldCnName,
+              trigger: item.isInputClass === 'text' ? 'blur' : 'change'
             }
           ]
           if (item.isDefaultValue) {
             this.crud.defaultForm[item.fieldName] = item.isDefaultValue
+          } else {
+            this.crud.defaultForm[item.fieldName] = null
           }
         })
         return true
@@ -213,4 +216,24 @@ export default {
 ::v-deep .filter-item input {
   margin-left: 10px;
 }
+.el-input-number.is-controls-right {
+  margin-right: 10px;
+}
+.preview-dialog {
+  ::v-deep .el-dialog {
+    width: 680px;
+    .preview-content {
+      max-height: calc(100vh - 330px);
+      overflow: hidden;
+      overflow-y: auto;
+      .el-textarea__inner {
+        border: 1px solid #339cff;
+        background-color: transparent;
+      }
+    }
+    .el-dialog__header {
+      width: 420px;
+    }
+  }
+}
 </style>