update 征求意见修改前、修改后、修改理由添加弹框展示详情功能

src/views/businessSupport/askForAdvice/AskForAdviceDetail.vue

@@ -54,9 +54,10 @@
         :scroll="{x: '100%'}"
         @change="handleTableChange">
 
-        <!--修改前的跳转标准详情-->
+        <!--修改前、修改后、修改理由弹框显示内容-->
-        <template v-slot:standardDetail="{text, record}">
+        <template v-slot:modalDetail="{text, record}">
-          <a-button type="primary" @click="toDetailPage">{{ $t('docTool.split.clickToView') }}</a-button>
+          <div class="table-text" @click="showContent(text)" v-if="text">{{ text }}</div>
+          <div v-else>{{ global.emptyLine }}</div>
         </template>
 
         <template v-slot:file="{text}">
@@ -64,6 +65,8 @@
         </template>
       </j-table>
     </div>
+
+    <text-content-modal ref="textContentModal" />
   </internal-detail-page>
 </template>
 
@@ -75,10 +78,11 @@ import JTable from '../../../components/jero/JTable'
 import { JeroListMixin } from '../../../mixins/JeroListMixin'
 import { queryAskForAdviceDetail } from '../../../api/businessSupport'
 import { StandardSource } from '../../../enums/commonEnums'
+import TextContentModal from './modules/TextContentModal'
 
 export default {
   name: 'AskForAdviceDetail',
-  components: { JTable, FileEcho, InternalDetailPage },
+  components: { JTable, FileEcho, InternalDetailPage, TextContentModal },
   mixins: [JeroListMixin],
   data () {
     return {
@@ -118,21 +122,21 @@ export default {
               align: 'center',
               width: 180,
               dataIndex: 'modificationBefore',
-              scopedSlots: { customRender: 'text' }
+              scopedSlots: { customRender: 'modalDetail' }
             },
             { // 修改后
               title: this.$t('workCenter.enStandardChange.afterUpdate'),
               align: 'center',
               width: 180,
               dataIndex: 'modificationAfter',
-              scopedSlots: { customRender: 'text' }
+              scopedSlots: { customRender: 'modalDetail' }
             },
             { // 修改理由
               title: this.$t('workCenter.enStandardChange.updateReason'),
               align: 'center',
               width: 180,
               dataIndex: 'modificationReason',
-              scopedSlots: { customRender: 'text' }
+              scopedSlots: { customRender: 'modalDetail' }
             }
           ]
         },
@@ -304,6 +308,9 @@ export default {
       this.$openPageNewSheet({
         path, query
       })
+    },
+    showContent (text) {
+      this.$refs.textContentModal.open(text)
     }
   }
 }

src/views/businessSupport/askForAdvice/modules/TextContentModal.vue

@@ -0,0 +1,42 @@
+<template>
+  <j-modal
+    :title="$t('view')"
+    :visible="visible"
+    :width="1000"
+    :footer="false"
+    switchFullscreen
+    @cancel="handleCancel">
+    <div class="text-content">{{ content }}</div>
+  </j-modal>
+</template>
+
+<script>
+export default {
+  name: 'TextContentModal',
+  data () {
+    return {
+      visible: false,
+      content: null
+    }
+  },
+  methods: {
+    open (text) {
+      this.content = text
+      this.visible = true
+    },
+    handleCancel () {
+      this.visible = false
+      this.content = null
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+.text-content {
+  max-height: calc(100vh - 200px - 55px);
+  overflow: auto;
+  margin: 0 -24px;
+  padding: 0 24px;
+}
+</style>

src/views/workCenter/standardConsultationProcess/StandardConsultationProcess.vue

@@ -179,6 +179,12 @@
               :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
               :loading="loading">
 
+              <!--修改前、修改后、修改理由弹框显示内容-->
+              <template v-slot:modalDetail="{text, record}">
+                <div class="table-text" @click="showContent(text)" v-if="text">{{ text }}</div>
+                <div v-else>{{ global.emptyLine }}</div>
+              </template>
+
               <!--    操作栏   -->
               <div slot="action" slot-scope="{record, index}" class="action-span-cell">
                 <a @click="handleEdit(record, index)" class="table-ope-btn">{{ $t('edit') }}</a>
@@ -205,6 +211,13 @@
                           :extra-form="collectExtraForm"
                           :all-disabled="disabledConsultationList"
                           :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }">
+
+            <!--修改前、修改后、修改理由弹框显示内容-->
+            <template v-slot:modalDetail="{text, record}">
+              <div class="table-text" @click="showContent(text)" v-if="text">{{ text }}</div>
+              <div v-else>{{ global.emptyLine }}</div>
+            </template>
+
             <!--意见，汇总节点才用插槽，用表头控制了-->
             <template v-slot:opinion="{text, record, index}">
               <j-dict-select-tag :value="record.isAdopt"
@@ -276,6 +289,8 @@
     <batch-write-opinion-modal ref="opinionModal" @ok="handleWriteOpinion" />
     <!--转办选人-->
     <user-select-modal ref="userSelectModal" check-required @change="continueTurnTo" />
+    <!--修改前、修改后、修改理由展示完整内容-->
+    <text-content-modal ref="textContentModal" />
   </internal-detail-page>
 </template>
 
@@ -304,10 +319,12 @@ import {
 } from '../../../api/workCenter'
 import UserSelectModal from '../../../components/selection/UserSelectModal'
 import { getFileInfo } from '../../../api/api'
+import TextContentModal from '../../businessSupport/askForAdvice/modules/TextContentModal'
 
 export default {
   name: 'StandardConsultationProcess',
   components: {
+    TextContentModal,
     UserSelectModal,
     FileEcho,
     PersonnelInfo,
@@ -461,21 +478,21 @@ export default {
               align: 'center',
               width: 180,
               dataIndex: 'modificationBefore',
-              scopedSlots: { customRender: 'text' }
+              scopedSlots: { customRender: 'modalDetail' }
             },
             { // 修改后
               title: this.$t('workCenter.enStandardChange.afterUpdate'),
               align: 'center',
               width: 180,
               dataIndex: 'modificationAfter',
-              scopedSlots: { customRender: 'text' }
+              scopedSlots: { customRender: 'modalDetail' }
             },
             { // 修改理由
               title: this.$t('workCenter.enStandardChange.updateReason'),
               align: 'center',
               width: 180,
               dataIndex: 'modificationReason',
-              scopedSlots: { customRender: 'text' }
+              scopedSlots: { customRender: 'modalDetail' }
             }
           ]
         },
@@ -520,21 +537,21 @@ export default {
               align: 'center',
               width: 180,
               dataIndex: 'modificationBefore',
-              scopedSlots: { customRender: 'text' }
+              scopedSlots: { customRender: 'modalDetail' }
             },
             { // 修改后
               title: this.$t('workCenter.enStandardChange.afterUpdate'),
               align: 'center',
               width: 180,
               dataIndex: 'modificationAfter',
-              scopedSlots: { customRender: 'text' }
+              scopedSlots: { customRender: 'modalDetail' }
             },
             { // 修改理由
               title: this.$t('workCenter.enStandardChange.updateReason'),
               align: 'center',
               width: 180,
               dataIndex: 'modificationReason',
-              scopedSlots: { customRender: 'text' }
+              scopedSlots: { customRender: 'modalDetail' }
             }
           ]
         },
@@ -682,21 +699,21 @@ export default {
               align: 'center',
               width: 180,
               dataIndex: 'modificationBefore',
-              scopedSlots: { customRender: 'text' }
+              scopedSlots: { customRender: 'modalDetail' }
             },
             { // 修改后
               title: this.$t('workCenter.enStandardChange.afterUpdate'),
               align: 'center',
               width: 180,
               dataIndex: 'modificationAfter',
-              scopedSlots: { customRender: 'text' }
+              scopedSlots: { customRender: 'modalDetail' }
             },
             { // 修改理由
               title: this.$t('workCenter.enStandardChange.updateReason'),
               align: 'center',
               width: 180,
               dataIndex: 'modificationReason',
-              scopedSlots: { customRender: 'text' }
+              scopedSlots: { customRender: 'modalDetail' }
             }
           ]
         },
@@ -1166,6 +1183,9 @@ export default {
      */
     handleOpinionChange (value, index) {
       this.$set(this.dataSource[index], 'isAdopt', value)
+    },
+    showContent (text) {
+      this.$refs.textContentModal.open(text)
     }
   }
 }

src/views/workCenter/standardConsultationProcess/modules/ConsultationModal.vue

@@ -40,22 +40,22 @@
             <!--修改前-->
             <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('workCenter.enStandardChange.beforeUpdate')">
               <a-input :placeholder="$t('pleaseEnter') + $t('workCenter.enStandardChange.beforeUpdate')"
-                       :maxLength="50"
+                       :maxLength="500"
-                       @change="event => event.target.value = event.target.value.trim()"
+                       type="textarea"
                        v-decorator="['modificationBefore', validatorRules.modificationBefore]" />
             </a-form-item>
             <!--  修改后  -->
             <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('workCenter.enStandardChange.afterUpdate')">
               <a-input :placeholder="$t('pleaseEnter') + $t('workCenter.enStandardChange.afterUpdate')"
-                       :maxLength="50"
+                       :maxLength="500"
-                       @change="event => event.target.value = event.target.value.trim()"
+                       type="textarea"
                        v-decorator="['modificationAfter', validatorRules.modificationAfter]" />
             </a-form-item>
             <!--  修改理由  -->
             <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('workCenter.enStandardChange.updateReason')">
               <a-input :placeholder="$t('pleaseEnter') + $t('workCenter.enStandardChange.updateReason')"
-                       :maxLength="50"
+                       :maxLength="500"
-                       @change="event => event.target.value = event.target.value.trim()"
+                       type="textarea"
                        v-decorator="['modificationReason', validatorRules.modificationReason]" />
             </a-form-item>
           </a-form>