Merge remote-tracking branch 'origin/dev_third_stage' into dev_third_stage

jero-boot/jero-boot-modules/src/main/java/com/jero/modules/report/service/impl/LawsMonthlyReportWriteEOServiceImpl.java

@@ -38,6 +38,7 @@ import com.jero.modules.system.service.impl.SysCategoryServiceImpl;
 import com.jero.modules.system.service.impl.SysDictItemServiceImpl;
 import com.jero.modules.system.util.StringUtils;
 import org.apache.poi.hssf.usermodel.HeaderFooter;
+import org.apache.poi.xwpf.usermodel.BreakType;
 import org.apache.poi.xwpf.usermodel.ParagraphAlignment;
 import org.apache.poi.xwpf.usermodel.TOC;
 import org.apache.poi.xwpf.usermodel.XWPFDocument;
@@ -735,9 +736,10 @@ public class LawsMonthlyReportWriteEOServiceImpl extends ServiceImpl<LawsMonthly
 			content = "Content";
 		}
 		String moth = lawsMonthlyReportWriteEOS.get(0).getMonth().replaceAll("-", "年") + "月";
-		//单独设置每页右侧的时间
+		//标题
-		WordUtil.exportWord(document, titleCN, null, ParagraphAlignment.CENTER, 0, 18,
+		WordUtil.exportWord(document, titleCN, null, ParagraphAlignment.CENTER, 0, 14,
 				false, false, "Blue Sky Noto Regular",null,null);
+		//主要内容
 		WordUtil.exportWord(document, content, null, ParagraphAlignment.LEFT, 0, 12,
 				false, true, "Blue Sky Noto Regular",null,null);
 		//生成页脚
@@ -779,7 +781,7 @@ public class LawsMonthlyReportWriteEOServiceImpl extends ServiceImpl<LawsMonthly
 				}
 				if(StringUtils.isNotBlank(twoTitle)){
 					WordUtil.exportWord(document, twoNumber+" "+twoTitle, null, ParagraphAlignment.LEFT,
-							0, 12, false, true, "Blue Sky Noto Regular","1","二级标题");
+							2, 12, false, true, "Blue Sky Noto Regular","1","二级标题");
 					twoCount++;
 				}
 
@@ -793,7 +795,7 @@ public class LawsMonthlyReportWriteEOServiceImpl extends ServiceImpl<LawsMonthly
 					}
 					if(org.apache.commons.lang3.StringUtils.isNotBlank(reportTitle)){
 						WordUtil.exportWord(document, reportCount+". "+reportTitle, null, ParagraphAlignment.LEFT,
-								0, 12, false, false, "Blue Sky Noto Regular","2","三级标题");
+								4, 12, false, false, "Blue Sky Noto Regular","2","三级标题");
 						reportCount++;
 					}
 				}
@@ -916,6 +918,10 @@ public class LawsMonthlyReportWriteEOServiceImpl extends ServiceImpl<LawsMonthly
 			}else{
 				oneTitle = lawsMonthlyReportTitleTemplateEO.getTitleEn();
 			}
+			//每个一级目录单独占一页
+			if(oneCount > 1){
+				document.createParagraph().createRun().addBreak(BreakType.PAGE);
+			}
 			if(StringUtils.isNotBlank(oneTitle)){
 				WordUtil.exportWord(document, oneNumber+" "+oneTitle, null, ParagraphAlignment.LEFT,
 						0, 14, false, true, "Blue Sky Noto Regular","0","一级标题");
@@ -939,6 +945,10 @@ public class LawsMonthlyReportWriteEOServiceImpl extends ServiceImpl<LawsMonthly
 				}else{
 					twoTitle = monthlyReportTitleTemplateEO.getTitleEn();
 				}
+				//每个二级目录单独占一页
+				if(twoCount > 1){
+					document.createParagraph().createRun().addBreak(BreakType.PAGE);
+				}
 				if(StringUtils.isNotBlank(twoTitle)){
 					WordUtil.exportWord(document, twoNumber+" "+twoTitle, null, ParagraphAlignment.LEFT,
 							0, 12, false, true, "Blue Sky Noto Regular","1","二级标题");

jero-web/src/components/PersonnelSelection/index.vue

@@ -31,11 +31,39 @@
       <a-input-search style="margin-bottom: 8px" :placeholder="$t('NodeQuickLookup')"
                       v-model="searchModel" @search="onSearch"/>
       <div class="drawer-content">
+        <!--        <a-checkbox-group v-model="checkboxList">-->
+        <!--          <vxe-list height="540" class="my-tree" :loading="loading" :data="gData">-->
+        <!--            <template #default="{ items }">-->
+        <!--              <div-->
+        <!--                class="my-tree-item"-->
+        <!--                v-for="item in items"-->
+        <!--                :key="item.id"-->
+        <!--                :class="[`level-${item._LEVEL}`, {'has-child': item._HAS_CHILDREN, 'is-expand': item._EXPAND}]"-->
+        <!--                :style="{paddingLeft: `${item._LEVEL * 20}px`}">-->
+        <!--                <a-icon type="caret-right"-->
+        <!--                        v-if="item._HAS_CHILDREN && !item._EXPAND"-->
+        <!--                        class="caret-right"-->
+        <!--                        @click="toggleTreeNode(item)"/>-->
+        <!--                <a-icon type="caret-down"-->
+        <!--                        class="caret-right"-->
+        <!--                        v-if="item._HAS_CHILDREN && item._EXPAND"-->
+        <!--                        @click="toggleTreeNode(item)"/>-->
+        <!--                <a-checkbox-->
+        <!--                  :indeterminate="item._HAS_CHILDREN"-->
+        <!--                  :checked="item._HAS_CHILDREN"-->
+        <!--                  class="checkbox"-->
+        <!--                  :value="item.id">-->
+        <!--                </a-checkbox>-->
+        <!--                &lt;!&ndash;              <i class="tree-icon fa fa-chevron-right" @click="toggleTreeNode(item)"></i>&ndash;&gt;-->
+        <!--                <span class="tree-label">{{ item.name }}</span>-->
+        <!--              </div>-->
+        <!--            </template>-->
+        <!--          </vxe-list>-->
+        <!--        </a-checkbox-group>-->
         <a-tree
           style="margin-bottom: 60px;height: 600px"
           v-if="treeVisible"
           checkable
-          checkStrictly
           :loading="loading"
           :tree-data="gData"
           @check="onCheck"
@@ -56,6 +84,8 @@
 
 <script>
   import { getAction, postAction } from '@/api/manage'
+  import XEUtils from 'xe-utils'
+  import VXETable from 'vxe-table'
 
   export default {
     name: 'index',
@@ -65,6 +95,7 @@
         loading: true,
         gData: [],
         autoExpandParent: true,
+        checkboxList: [],
         expandedKeys: [],
         visible: false,
         treeVisible: false,
@@ -83,15 +114,94 @@
 
     },
     methods: {
+      // loadTree(size) {
+      //   this.loading = true
+      //   setTimeout(() => {
+      //     const trerData = JSON.parse(JSON.stringify(this.gData))
+      //     // 将树结构拍平，构建列表树结构
+      //     XEUtils.eachTree(trerData, (item, index, items, paths, parent, nodes) => {
+      //       // 层级
+      //       item._LEVEL = nodes.length - 1
+      //       // 是否展开
+      //       item._EXPAND = false
+      //       // 是否可视
+      //       item._VISIBLE = !item._LEVEL
+      //       // 是否有子节点
+      //       item._HAS_CHILDREN = item.children && item.children.length > 0
+      //       // 是否叶子节点
+      //       item._IS_LEAF = !item._HAS_CHILDREN
+      //     })
+      //     this.tree = trerData
+      //     this.refreshTree()
+      //     this.loading = false
+      //   }, 200)
+      // },
+      // // 切换树节点的展开、收缩
+      // toggleTreeNode(row) {
+      //   if (row._HAS_CHILDREN) {
+      //     this.setTreeExpand(row, !row._EXPAND)
+      //   }
+      // },
+      // setTreeExpand(row, isExpand) {
+      //   const matchObj = XEUtils.findTree(this.tree, item => item === row)
+      //   row._EXPAND = isExpand
+      //   if (matchObj) {
+      //     XEUtils.eachTree(matchObj.item.children, (item, index, items, path, parent) => {
+      //       item._VISIBLE = parent ? parent._EXPAND && parent._VISIBLE : isExpand
+      //     })
+      //   }
+      //   this.refreshTree()
+      // },
+      // refreshTree() {
+      //   const treeList = XEUtils.toTreeArray(this.tree)
+      //   this.fullList = treeList
+      //   this.gData = treeList.filter(item => item._VISIBLE)
+      // },
       standardClick() {
         this.treeVisible = false
         this.departId = ''
         this.searchModel = ''
         this.userIds = []
         this.userName = []
-        this.queryDepartUserTreeList(1)
+        // let gData = localStorage.getItem('gData')
+        // if (gData) {
+        //   this.gData = this.toTree(JSON.parse(gData))
+        //   this.treeVisible = true
+        //   this.loadTree()
+        // } else {
+          this.queryDepartUserTreeList(1)
+        // }
         this.visible = true
       },
+      //将数据拼成树形结构
+      toTree(config) {
+        // 删除 所有 children,以防止多次调用
+        config.forEach(function(item) {
+          delete item.children
+        })
+        // 将数据存储为 以 id 为 KEY 的 map 索引数据列
+        let map = {}
+        config.forEach((item) => {
+          item.label = item.name
+          item.key = item.id
+
+          item.title = item.name + (item.itemName ? ' ' + item.itemName : '')
+          map[item.id] = item
+        })
+        let val = []
+        config.forEach((item) => {
+          // 以当前遍历项，的pid,去map对象中找到索引的id
+          let parent = map[item.parentId]
+          // 如果找到索引，那么说明此项不在顶级当中,那么需要把此项添加到，他对应的父级中
+          if (parent) {
+            (parent.children || (parent.children = [])).push(item)
+          } else {
+            //如果没有在map中找到对应的索引ID,那么直接把 当前的item添加到 val结果集中，作为顶级
+            val.push(item)
+          }
+        })
+        return val
+      },
       standardDelete() {
         this.$emit('input', null)
         this.$forceUpdate()
@@ -103,7 +213,7 @@
       // },
 
       onCheck(checkedKeys, info) {
-        this.userIds = checkedKeys.checked
+        this.userIds = checkedKeys
         this.userName = []
         if (this.userIds.length > 0) {
           for (let i = 0; i < this.userIds.length; i++) {
@@ -227,6 +337,8 @@
           gData = ''
         }
         this.confirmLoading = true
+        //queryDepartUserTreeList
+        //queryUserTreeList
         postAction('sys/user/queryDepartUserTreeList', {
           departId: this.departId,
           json: gData,
@@ -234,7 +346,10 @@
         }).then((res) => {
           this.confirmLoading = false
           if (res.success) {
+            this.loading = false
+            // localStorage.setItem('gData', JSON.stringify(res.result))
             this.gData = res.result
+            // this.gData[0].isLeaf = false
             this.defaultExpandedKeys = [this.departId]
             if (num == 1) {
               if (this.userName && this.userName.length == 0) {
@@ -312,4 +427,46 @@
     height: calc(100% - 60px);
     overflow: auto;
   }
+
+  .my-tree {
+    padding: 0 10px;
+    /*border: 1px solid #e8eaec;*/
+  }
+
+  .my-tree .my-tree-item {
+    height: 32px;
+    line-height: 32px;
+  }
+
+  .my-tree .my-tree-item.has-child .tree-icon {
+    visibility: visible;
+    transition: all 0.3s;
+  }
+
+  .my-tree .my-tree-item.is-expand .tree-icon {
+    transform: rotate(90deg);
+  }
+
+  .my-tree .tree-icon {
+    cursor: pointer;
+    width: 20px;
+    line-height: 20px;
+    text-align: center;
+    visibility: hidden;
+    user-select: none;
+  }
+
+  .caret-right {
+    margin-right: 4px;
+    font-size: 14px;
+  }
+
+  .checkbox {
+    margin-right: 8px;
+  }
+
+  ::v-deep .ant-checkbox-group {
+    width: 100%;
+    height: 600px;
+  }
 </style>

jero-web/src/views/businessSupport/problemKnowledgeBase/components/problemKnowledgeBaseList.vue

@@ -1,20 +1,8 @@
 <template>
   <div class="box">
     <div class="search-detail-wrap">
-      <a-form layout="inline" @keyup.enter.native="onSearch">
-        <div class="box-title-text">
-          <div class="title-text" :title="$t('searchContent')">
-            <span>{{$t('searchContent')}}</span>
-          </div>
-          <a-input class="box-input" :placeholder="$t('PleaseEnter')+$t('searchContent')"
-                   v-model="searchStr"></a-input>
-          <a-button class="box-button" type="primary" @click="onSearch">{{$t('query')}}</a-button>
-          <a-button class="box-button" style="margin-left: 8px" @click="ResetSearch">{{$t('reset')}}</a-button>
-        </div>
-      </a-form>
-    </div>
-    <div class="box-content">
       <div class="box-content-left">
+        <div class="classification">{{$t('classification')}}:</div>
         <template v-for="tag in tagList">
           <a-checkable-tag
             :key="tag.id"
@@ -26,88 +14,190 @@
           </a-checkable-tag>
         </template>
       </div>
-      <div class="box-content-right">
+      <div class="box-content-content">
-        <div @click="classificationClick" class="operator-text-text-index">
+        <div class="box-content-content-index" :title="$t('classificationMaintenance')"
+             @click="classificationClick">
           <a-icon type="setting"/>
           {{$t('classificationMaintenance')}}
         </div>
-        <div @click="managePublishingClick" class="operator-text-text-index">
+      </div>
-          <a-icon type="carry-out"/>
+      <a-form layout="inline" @keyup.enter.native="onSearch">
-          {{$t('managePublishing')}}
+        <div class="box-title-text">
+          <!--          <div class="title-text" :title="$t('searchContent')">-->
+          <!--            <span>{{$t('searchContent')}}</span>-->
+          <!--          </div>-->
+          <a-input-search class="box-input" :placeholder="$t('PleaseEnter')+$t('searchContent')"
+                          allowClear
+                          @search="onSearch"
+                          v-model="searchStr"></a-input-search>
+          <!--          <a-button class="box-button" type="primary" @click="onSearch">{{$t('query')}}</a-button>-->
+          <!--          <a-button class="box-button" style="margin-left: 8px" @click="ResetSearch">{{$t('reset')}}</a-button>-->
         </div>
-        <div @click="newlyAddedClick" class="operator-text-text-index">
+      </a-form>
-          <a-icon type="plus"/>
+    </div>
-          {{$t('newlyAdded')}}
+    <div v-if="isTrue">
+      <div class="box-content">
+        <div class="box-content-right">
+          <!--        <div  class="operator-text-text-index">-->
+          <!--          <a-icon type="setting"/>-->
+          <!--          {{$t('classificationMaintenance')}}-->
+          <!--        </div>-->
+          <div @click="managePublishingClick" class="operator-text-text-index">
+            <a-icon type="carry-out"/>
+            {{$t('managePublishing')}}
+          </div>
+          <div @click="newlyAddedClick" class="operator-text-text-index">
+            <a-icon type="plus"/>
+            {{$t('newlyAdded')}}
+          </div>
         </div>
       </div>
-    </div>
+      <div v-if="conList.length > 0" style="margin-top: 16px;height: calc(100vh - 260px);overflow:auto;">
-    <div v-if="conList.length > 0" style="margin-top: 16px;height: calc(100vh - 260px);overflow:auto;">
+        <div class="content-box" v-for="(item,index) in conList" :key="index">
-      <li v-for="(item,index) in conList" :key="item.id">
+          <div class="content-box-top" @click="detailClcik(item)">
-        <div style="margin-bottom: 10px;position: relative">
+            <span class="content-box-top-text">
-          <!--          <a-checkbox :value="item.id" class="checkbox-left"></a-checkbox>-->
+             {{ item.title }}
-          <div class="text-text-right"
+            </span>
-               :class="{ 'null-input':index % 2 == 0 ? true : false}">
+            <span class="content-box-top-color"
-            <div class="text-header" @click="titleClick(item)">
+                  v-if="item.problemTypeNameList && item.problemTypeNameList.length > 0"
-              <a-tooltip placement="topLeft" :mouseEnterDelay="0.5">
+                  :title="val"
-                <template slot="title">
+                  v-for="val in item.problemTypeNameList">
-                  <span v-html="item.title"></span>
+                {{val}}
-                </template>
+            </span>
-                <span class="text-header-text" style="cursor: pointer" v-html="item.title"></span>
+          </div>
-              </a-tooltip>
+          <div class="content-box-content" @click="detailClcik(item)">
+            <div class="content-box-content-top" v-html="item.contentOne">
+
             </div>
-            <div class="text-content">
+            <div class="content-box-content-botton">
-              {{item.contentOne}}
+              <div class="content-box-content-botton-text"
+                   v-if="item.accessoryFileNameList && item.accessoryFileNameList.length > 0"
+                   :title="val.fileName"
+                   v-for="val in item.accessoryFileNameList">
+                {{val.fileName}}
+              </div>
+            </div>
+          </div>
+          <div class="content-box-xian" @click="detailClcik(item)"></div>
+          <div class="content-box-button">
+            <div class="content-box-button-left" @click="detailClcik(item)">
+              <div class="content-box-button-text">
+                <a-icon type="user"/>
+                {{item.createBy}}
+              </div>
+              <div class="content-box-button-text">
+                <a-icon type="audit"/>
+                {{item.problemTypeName}}
+              </div>
+              <div class="content-box-button-text">
+                <a-icon type="history"/>
+                {{item.createTime}}
+              </div>
+            </div>
+            <div class="content-box-button-right">
+              <div class="content-box-button-text" @click="forwardClick(item)">
+                <a-icon type="logout"/>
+                {{$t('forward')}}
+              </div>
+              <div class="content-box-button-text">
+                <a-icon type="eye"/>
+                <span class="text">
+                {{item.browsingHistoryCount}}
+                </span>
+              </div>
+              <div class="content-box-button-text"
+                   @click="starClick(item)"
+                   :class="{'icon-active':item.collectEO && item.collectEO.collectStatus == 'Collect' ? true : false}">
+                <a-icon class="icon" type="star"/>
+                <span class="text">{{item.collectCount}}</span>
+              </div>
+              <div class="content-box-button-text"
+                   @click="likeClick(item)"
+                   :class="{'icon-active':item.praiseEO && item.praiseEO.praiseStatus == 'Praise' ? true : false}">
+                <a-icon type="like"/>
+                <span class="text">{{item.praiseCount}}</span>
+              </div>
             </div>
           </div>
         </div>
-      </li>
+        <!--      <div v-for="(item,index) in conList" :key="item.id">-->
-    </div>
+        <!--        <div style="margin-bottom: 10px;position: relative">-->
-    <div class="noData" v-else>
+        <!--          <div class="text-text-right"-->
-      {{$t('noData')}}
+        <!--               :class="{ 'null-input':index % 2 == 0 ? true : false}">-->
-    </div>
+        <!--            <div class="text-header" @click="titleClick(item)">-->
-    <div class="page" v-if="conList.length > 0">
+        <!--              <a-tooltip placement="topLeft" :mouseEnterDelay="0.5">-->
-      <a-pagination
+        <!--                <template slot="title">-->
-        :show-total="total => $t('total')+` ${total} `+$t('strip')"
+        <!--                  <span v-html="item.title"></span>-->
-        show-quick-jumper
+        <!--                </template>-->
-        show-size-changer
+        <!--                <span class="text-header-text" style="cursor: pointer" v-html="item.title"></span>-->
-        :page-size.sync="pageSize"
+        <!--              </a-tooltip>-->
-        :total="total"
+        <!--            </div>-->
-        :current="pageNo"
+        <!--            <div class="text-content">-->
-        @change="pageOnChange"
+        <!--              {{item.contentOne}}-->
-        @showSizeChange="SizeChange"
+        <!--            </div>-->
-      />
+        <!--          </div>-->
+        <!--        </div>-->
+        <!--      </div>-->
+      </div>
+      <div class="noData" v-else>
+        {{$t('noData')}}
+      </div>
+      <div class="page" v-if="conList.length > 0">
+        <a-pagination
+          :show-total="total => $t('total')+` ${total} `+$t('strip')"
+          show-quick-jumper
+          show-size-changer
+          :page-size.sync="pageSize"
+          :total="total"
+          :current="pageNo"
+          @change="pageOnChange"
+          @showSizeChange="SizeChange"
+        />
+      </div>
     </div>
+    <problemKnowledgeBaseListView ref="problemKnowledgeBaseListViewRef"
+                                  @problemKnowledgeBase="problemKnowledgeBase" v-else/>
     <JLoading :loading="loading">{{$t('dataLoading')}}</JLoading>
     <classificationMaintenanceModel @classificationMaintenanceModelForm="classificationMaintenanceModelForm"
                                     ref="classificationMaintenanceModelRef"/>
+    <SelectedBy ref="SelectedByRef" :title="$t('forward')" @SelectedByForm="SelectedByForm"></SelectedBy>
   </div>
 </template>
 
 <script>
-  import { getAction, postAction, downloadFile } from '@/api/manage'
+  import { getAction, postAction, downloadFile, putAction } from '@/api/manage'
   import classificationMaintenanceModel from './classificationMaintenanceModel'
+  import SelectedBy from '@/components/SelectedBy/index'
+  import problemKnowledgeBaseListView from './problemKnowledgeBaseListView'
+  import { mapGetters } from 'vuex'
 
   export default {
     name: 'problemKnowledgeBaseList',
     components: {
-      classificationMaintenanceModel
+      classificationMaintenanceModel,
+      SelectedBy,
+      problemKnowledgeBaseListView
     },
     data() {
       return {
         searchContent: '',
         checkboxText: [],
         conList: [],
+        isTrue: false,
         searchStr: '',
         total: 0,
         selectedTags: [],
         loading: false,
+        queryBase: {},
         pageSize: 10,
+        queryForm: {},
         tagList: [],
         downLoadFileUrl: window._CONFIG['domianPreviewURL'] + '/sys/common/download',
         pageNo: 1,
         url: {
           getInfoList: '/problemKnowledgeBase/problemKnowledgeBaseEO/page'
-        }
+        },
+        CommentQuery: {}
       }
     },
     mounted() {
@@ -116,10 +206,12 @@
         this.searchStr = serial_number
         localStorage.removeItem('serial_number')
       }
+      this.isTrue = true
       this.getList()
       this.replacePage()
     },
     methods: {
+      ...mapGetters(['userInfo']),
       replacePage() {
         getAction('/problemKnowledgeBase/problemKnowledgeBaseClassifyEO/list', {}).then((res) => {
           if (res.success) {
@@ -129,10 +221,50 @@
           }
         })
       },
+      likeClick(val) {
+        let praiseStatus = ''
+        if (val.praiseEO && val.praiseEO.praiseStatus == 'Praise') {
+          praiseStatus = 'Cancel praise'
+        } else {
+          praiseStatus = 'Praise'
+        }
+        let query = {
+          problemKnowledgeBaseId: val.id,
+          praiseUserId: this.userInfo().id,
+          praiseStatus: praiseStatus,
+          id: val.praiseEO ? val.praiseEO.id : undefined
+        }
+        putAction('/problemKnowledgeBase/problemKnowledgeBasePraiseEO/edit', query).then((res) => {
+          this.getList()
+        })
+      },
+      starClick(val) {
+        let collectStatus = ''
+        if (val.collectEO && val.collectEO.collectStatus == 'Collect') {
+          collectStatus = 'Cancel Collect'
+        } else {
+          collectStatus = 'Collect'
+        }
+        let query = {
+          problemKnowledgeBaseId: val.id,
+          collectUserId: this.userInfo().id,
+          collectStatus: collectStatus,
+          id: val.collectEO ? val.collectEO.id : undefined
+        }
+        putAction('/problemKnowledgeBase/problemKnowledgeBaseCollectEO/edit', query).then((res) => {
+          this.getList()
+        })
+      },
+      problemKnowledgeBase() {
+        this.pageNo = 1
+        this.isTrue = true
+        this.getList()
+      },
       classificationMaintenanceModelForm() {
         this.replacePage()
       },
       onSearch() {
+        this.isTrue = true
         this.pageNo = 1
         this.getList()
       },
@@ -142,6 +274,7 @@
           ? [...selectedTags, tag]
           : selectedTags.filter(t => t !== tag)
         this.selectedTags = nextSelectedTags
+        this.isTrue = true
         this.getList()
       },
       ResetSearch() {
@@ -218,6 +351,35 @@
           }
         })
         window.open(newUrl.href, '_blank')
+      },
+      forwardClick(row) {
+        this.queryForm = row
+        this.$refs.SelectedByRef.getPush()
+      },
+      SelectedByForm(userIds) {
+        let query = {
+          userIds: userIds,
+          departIds: userIds,
+          problemKnowledgeBaseId: this.queryForm.id,
+          problemKnowledgeBaseTitle: this.queryForm.title
+        }
+        postAction('/problemKnowledgeBase/problemKnowledgeBaseEO/forward', query).then((res) => {
+          if (res.success) {
+            this.$message.success(this.$t('OperationSuccessful'))
+            this.$refs.SelectedByRef.visible = false
+            this.$refs.SelectedByRef.submitLoading = false
+            this.getList()
+          } else {
+            this.$message.warning(this.$t('operationFailed'))
+            this.$refs.SelectedByRef.submitLoading = false
+          }
+        })
+      },
+      detailClcik(val) {
+        this.isTrue = false
+        this.$nextTick(() => {
+          this.$refs.problemKnowledgeBaseListViewRef.getData(JSON.parse(JSON.stringify(val)))
+        })
       }
     }
   }
@@ -226,11 +388,14 @@
 <style scoped lang="less">
   .search-detail-wrap {
     width: 100%;
-    margin: 0 auto;
+    overflow: hidden;
+    /*margin: 0 auto;*/
   }
 
   .box-title-text {
     line-height: 1.4;
+    width: 360px;
+    float: right;
     display: flex;
     align-items: center;
     margin-bottom: 10px;
@@ -255,9 +420,8 @@
   .box-input {
     /*min-width: 200px;*/
     display: inline-block;
-    width: 50%;
+    width: 100%;
     height: 38px;
-    margin-top: 2px;
     margin-right: 16px;
   }
 
@@ -266,11 +430,44 @@
   }
 
   .box-content-left {
-    width: 100%;
+    width: calc(100% - 520px);
+    float: left;
     font-size: 14px;
     font-weight: 400;
     color: #040B29;
-    margin-top: 20px;
+    margin-right: 10px;
+  }
+
+  .box-content-content {
+    float: left;
+    width: 150px;
+    text-align: center;
+  }
+
+  .box-content-content-index {
+    width: 108px;
+    height: 40px;
+    background: rgba(0, 179, 190, 0.06);
+    border: 1px solid #00BEBE;
+    border-radius: 4px;
+    text-align: center;
+    font-size: 14px;
+    color: #00B3BE;
+    line-height: 40px;
+    cursor: pointer;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    padding: 0 6px;
+  }
+
+  .classification {
+    display: inline-block;
+    font-size: 14px;
+    color: #000F16;
+    margin-right: 10px;
+    overflow: hidden;
+    margin-bottom: 7px;
   }
 
   .box-content-right {
@@ -381,14 +578,202 @@
   }
 
   ::v-deep .ant-tag-checkable:not(.ant-tag-checkable-checked):hover {
-    border: 1px #21c9cc solid;
+    background: #00B3BE;
-    color: #21c9cc;
+    border: 1px solid #00BEBE;
+    color: #fff;
+
   }
 
   ::v-deep p {
     margin: 0;
     padding: 0;
   }
+
+  ::v-deep .ant-input {
+    height: 40px;
+  }
+
+  .content-box {
+    width: 100%;
+    height: auto;
+    padding: 24px 24px 16px 24px;
+    box-sizing: border-box;
+    border: 1px solid #E6E6E9;
+    border-radius: 4px;
+    position: relative;
+    margin-bottom: 20px;
+
+    .content-box-top {
+      width: 100%;
+      height: auto;
+
+      .content-box-top-text {
+        font-size: 16px;
+        font-weight: bold;
+        color: #040B29;
+        cursor: pointer;
+        overflow: hidden;
+        display: inline-block;
+      }
+
+      .content-box-top-color {
+        font-size: 12px;
+        cursor: pointer;
+        font-weight: 400;
+        color: #00BEBE;
+        padding: 0 10px;
+        box-sizing: border-box;
+        display: inline-block;
+        height: 22px;
+        line-height: 22px;
+        background: #DBF2F3;
+        border-radius: 3px;
+        margin-left: 6px;
+        max-width: 120px;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        overflow: hidden;
+      }
+    }
+
+    .content-box-content {
+      width: 100%;
+      height: auto;
+      margin-top: 16px;
+      margin-bottom: 10px;
+
+      .content-box-content-top {
+        font-size: 14px;
+        font-weight: 400;
+        color: #040B29;
+        display: -webkit-box;
+        text-overflow: ellipsis;
+        /*! autoprefixer: off */
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 2;
+        /*! autoprefixer: on;*/
+        text-justify: inter-ideograph;
+        word-break: break-all;
+        overflow: hidden;
+      }
+
+      .content-box-content-botton {
+        width: 100%;
+        margin-top: 10px;
+
+        .content-box-content-botton-text {
+          width: 118px;
+          height: 32px;
+          display: inline-block;
+          text-align: center;
+          line-height: 32px;
+          padding: 0 6px;
+          background: #EFF1F3;
+          border-radius: 4px;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          overflow: hidden;
+          font-size: 12px;
+          font-weight: 400;
+          color: #040B29;
+          margin-right: 10px;
+          cursor: pointer;
+        }
+      }
+    }
+
+    .content-box-xian {
+      width: 100%;
+      position: absolute;
+      border-bottom: 1px #EFF1F3 solid;
+      left: 0;
+      /*margin-top: 10px;*/
+    }
+
+    .content-box-button {
+      width: 100%;
+      margin-top: 26px;
+      overflow: hidden;
+
+      .content-box-button-left {
+        width: 50%;
+        float: left;
+
+        .content-box-button-text {
+          display: inline-block;
+          margin-right: 30px;
+          font-size: 14px;
+          font-weight: 400;
+          color: #6F7385;
+          word-break: break-all;
+        }
+      }
+
+      .content-box-button-right {
+        width: 50%;
+        float: left;
+        text-align: right;
+
+        .content-box-button-text {
+          display: inline-block;
+          margin-left: 30px;
+          font-size: 14px;
+          font-weight: 400;
+          color: #040B29;
+          cursor: pointer;
+        }
+      }
+    }
+  }
+
+  .box-title-text-index {
+    line-height: 1.4;
+    display: flex;
+    /*align-items: center;*/
+  }
+
+  .title-text-index {
+    width: 88px;
+    text-align: right;
+    display: inline-block;
+    font-weight: 500;
+    font-size: 14px;
+    margin-right: 16px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    height: 42px;
+    line-height: 48px;
+    color: #000F16;
+  }
+
+  .box-input-index {
+    display: inline-block;
+    height: 38px;
+    width: 100%;
+  }
+
+  .itemModel {
+    width: 100%;
+    display: inline-block;
+    margin-bottom: 12px;
+  }
+
+  .Required {
+    color: red;
+    margin-right: 4px;
+  }
+
+  .icon-active {
+    color: #00B3BE !important;
+  }
+
+  .text {
+    min-width: 16px;
+    text-align: left;
+    display: inline-block;
+    margin-left: 3px;
+  }
 </style>
 <style>
   .box-content-left .ant-tag {
@@ -398,13 +783,12 @@
   }
 
   .box-content-left .ant-tag-checkable {
-    padding: 4px 10px;
+    padding: 9px 10px;
     display: inline-block;
     box-sizing: border-box;
-    margin-bottom: 10px;
     background: #fff;
-    border: 1px #d9d9d9 solid;
+    background: rgba(4, 11, 41, 0.06);
-    color: rgba(0, 0, 0, 0.65);
+    color: #363C54;
     max-width: 150px;
     overflow: hidden;
     white-space: nowrap;
@@ -413,7 +797,8 @@
   }
 
   .box-content-left .ant-tag-checkable-checked {
-    border: 1px #21c9cc solid;
+    background: #00B3BE;
-    color: #21c9cc;
+    border: 1px solid #00BEBE;
+    color: #fff;
   }
 </style>

jero-web/src/views/businessSupport/problemKnowledgeBase/components/problemKnowledgeBaseListView.vue

@@ -0,0 +1,707 @@
+<template>
+  <div>
+    <div class="content-box" style="margin-top: 16px">
+      <div class="content-box-top">
+        <a-icon type="arrow-left" @click="back" class="icon-left"/>
+        <span class="content-box-top-text">
+             {{ queryForm.title }}
+        </span>
+        <span class="content-box-top-color"
+              v-if="queryForm.problemTypeNameList && queryForm.problemTypeNameList.length > 0"
+              :title="val"
+              v-for="val in queryForm.problemTypeNameList">
+                {{val}}
+        </span>
+      </div>
+      <div class="content-box-content">
+        <div class="content-box-content-top" v-html="queryForm.content">
+
+        </div>
+        <div class="content-box-content-botton">
+          <div class="content-box-content-botton-text"
+               v-if="queryForm.accessoryFileNameList && queryForm.accessoryFileNameList.length > 0"
+               v-for="item in queryForm.accessoryFileNameList">
+            <span @click="pdfPreview(item)" :title="item.fileName" class="file-text">{{item.fileName}}</span>
+            <a-icon @click="download(item)" type="download" class="icon-text"/>
+          </div>
+        </div>
+      </div>
+      <div class="content-box-xian"></div>
+      <div class="content-box-button">
+        <div class="content-box-button-left">
+          <div class="content-box-button-text">
+            <a-icon type="user"/>
+            {{queryForm.createBy}}
+          </div>
+          <div class="content-box-button-text">
+            <a-icon type="audit"/>
+            {{queryForm.problemTypeName}}
+          </div>
+          <div class="content-box-button-text">
+            <a-icon type="history"/>
+            {{queryForm.createTime}}
+          </div>
+        </div>
+        <div class="content-box-button-right">
+          <div class="content-box-button-text" @click="forwardClick(queryForm)">
+            <a-icon type="logout"/>
+            {{$t('forward')}}
+          </div>
+          <div class="content-box-button-text">
+            <a-icon type="eye"/>
+            <span class="text">{{queryForm.browsingHistoryCount}}</span>
+          </div>
+          <div class="content-box-button-text"
+               :class="{'icon-active':this.isCollect}"
+               @click="starClick()"
+          >
+            <a-icon class="icon" type="star"/>
+            <span class="text">{{queryForm.collectCount}}</span>
+          </div>
+          <div class="content-box-button-text"
+               :class="{'icon-active':this.isPraise}"
+               @click="likeClick()">
+            <a-icon type="like"/>
+            <span class="text">{{queryForm.praiseCount}}</span>
+          </div>
+        </div>
+      </div>
+      <div class="content-box-comment">
+        <div class="content-box-comment-text">
+          {{$t('comment')}}
+        </div>
+        <a-form-model :model="formInline" class="formAdd" :rules="rules" ref="ruleForm">
+          <a-row :gutter="24">
+            <a-col :span="24">
+              <div class="box-title-text">
+                <a-form-model-item class="itemModel" prop="commentContent">
+                  <a-textarea :placeholder="$t('pleaseEnter')+$t('comment')"
+                              v-model.trim="formInline.commentContent"
+                              :rows="1"/>
+                </a-form-model-item>
+                <a-button class="header-btn submit"
+                          :loading="loading" @click="release"
+                          type="primary">{{$t('release')}}
+                </a-button>
+              </div>
+            </a-col>
+          </a-row>
+        </a-form-model>
+        <div class="commentContent-text" v-for="(item,index) in releaseList" :key="index">
+          <div class="commentContent-header">
+            <span class="commentContent-yuan"></span>
+            <span class="commentContent-title">{{item.createBy}}</span>
+            <span class="commentContent-time">{{item.createTime}}</span>
+          </div>
+          <div class="commentContent-content">
+            {{item.commentContent}}
+          </div>
+          <div class="answer-text" style="margin-bottom: 14px" @click="messageClick(item)">
+            {{$t('answer')}}
+          </div>
+          <div class="commentContent-text-one" v-for="(val,index1) in item.problemKnowledgeBaseCommentVOList"
+               v-if="item.problemKnowledgeBaseCommentVOList && item.problemKnowledgeBaseCommentVOList.length > 0">
+            <div class="commentContent-header">
+              <span class="commentContent-yuan"></span>
+              <span class="commentContent-title">{{val.createBy}}</span>
+              <span class="commentContent-time">{{val.createTime}}</span>
+            </div>
+            <div class="commentContent-content">
+              {{val.commentContent}}
+            </div>
+            <div class="answer-text" @click="messageClick(item)">
+              {{$t('answer')}}
+            </div>
+          </div>
+        </div>
+      </div>
+      <SelectedBy ref="SelectedByRef" :title="$t('forward')" @SelectedByForm="SelectedByForm"></SelectedBy>
+    </div>
+    <a-modal
+      :title="$t('replyToComments')"
+      :width="700"
+      :visible="visibleComment"
+      :confirm-loading="confirmLoading"
+      :maskClosable="false"
+      @ok="handleOkComment"
+      @cancel="handleCancelComment"
+    >
+      <a-form-model :model="formInlineComment" class="formAdd" :rules="rulesComment" ref="ruleFormComment">
+        <a-row :gutter="24">
+          <a-col :span="24">
+            <div class="box-title-text">
+              <div class="title-text">
+                <span class="Required">*</span>
+                <span class="title-text-text" :title="$t('replyToComments')">{{$t('replyToComments')}}</span>
+              </div>
+              <a-form-model-item class="itemModel" :prop="'replyContent'">
+                <a-textarea
+                  :placeholder="$t('PleaseEnter')+$t('replyToComments')"
+                  :disabled="false"
+                  v-model.trim="formInlineComment.replyContent" :rows="4"/>
+              </a-form-model-item>
+            </div>
+          </a-col>
+        </a-row>
+      </a-form-model>
+    </a-modal>
+  </div>
+
+</template>
+
+<script>
+  import { getAction, postAction, downloadFile, putAction } from '@/api/manage'
+  import SelectedBy from '@/components/SelectedBy/index'
+  import { mapGetters } from 'vuex'
+  import { Base64 } from 'js-base64'
+
+  export default {
+    name: 'problemKnowledgeBaseListView',
+    components: {
+      SelectedBy
+    },
+    data() {
+      return {
+        visibleComment: false,
+        releaseList: [],
+        loading: false,
+        formInline: {},
+        confirmLoading: false,
+        formInlineComment: {},
+        rulesComment: {
+          replyContent: [
+            {
+              required: true,
+              message: this.$t('replyToComments') + this.$t('cannotEmpty'),
+              trigger: 'blur'
+            },
+            {
+              max: 300,
+              message: this.$t('replyToComments') + this.$t('cannotExceed') + 300 + this.$t('Characters'),
+              trigger: 'blur'
+            }
+          ]
+        },
+        rules: {
+          commentContent: [
+            {
+              max: 300,
+              message: this.$t('comment') + this.$t('cannotExceed') + 300 + this.$t('Characters'),
+              trigger: 'blur'
+            }
+          ]
+        },
+        queryBase: {},
+        CommentQuery: {},
+        queryForm: {},
+        isPraise: false,
+        downLoadFileUrl: window._CONFIG['domianPreviewURL'] + '/sys/common/download',
+        isCollect: false
+      }
+    },
+    mounted() {
+
+    },
+    methods: {
+      ...mapGetters(['userInfo']),
+      pdfPreview(fileQuery) {
+        let fileName = fileQuery.fileName
+        let index1 = fileName.lastIndexOf('.')
+        let index2 = fileName.length
+        let fileSuffix = fileName.substring(index1, index2)
+        if (fileSuffix == '.pdf') {
+          window.open('/pdf/web/viewer.html?file=' + encodeURIComponent('/jero-boot/sys/common/pdf/viewFile?id=' + fileQuery.id+'&userName='+this.userInfo().username))
+        } else if (fileSuffix == '.docx' || fileSuffix == '.doc') {
+          let url = window._CONFIG['onlinePreviewDomainURL'] + '?url=' + Base64.encode(this.downLoadFileUrl + '/' + fileQuery.id + fileSuffix)
+          window.open(url, '_blank')
+        } else if (fileSuffix == '.xlsx' || fileSuffix == '.xls'
+          || fileSuffix == '.png' || fileSuffix == '.jpeg' || fileSuffix == '.gif' || fileSuffix == '.jpg') {
+          let url = window._CONFIG['onlinePreviewDomainURL'] + '?url=' + Base64.encode(this.downLoadFileUrl + '/' + fileQuery.id + fileSuffix)
+          window.open(url, '_blank')
+        } else {
+          downloadFile('/sys/common/downLoadFile', fileQuery.fileName, { id: fileQuery.id })
+        }
+      },
+      download(item) {
+        downloadFile('/sys/common/downLoadFile', item.fileName, { id: item.id ,userName:this.userInfo().username})
+      },
+      getData(val) {
+        this.queryBase = val
+        this.queryById()
+        this.releaseData()
+        this.viewAdd()
+      },
+      viewAdd() {
+        let query = {
+          problemKnowledgeBaseId: this.queryBase.id,
+          browsingUserId: this.userInfo().id
+        }
+        postAction('/problemKnowledgeBase/problemKnowledgeBaseBrowsingHistoryEO/add', query).then((res) => {
+        })
+      },
+      queryById() {
+        let query = {
+          id: this.queryBase.id
+        }
+        getAction('/problemKnowledgeBase/problemKnowledgeBaseEO/queryById', query).then((res) => {
+          if (res.success) {
+            this.queryForm = res.result || {}
+            this.queryForm = { ...this.queryForm }
+            if (this.queryForm.praiseEO && this.queryForm.praiseEO.praiseStatus == 'Praise') {
+              this.isPraise = true
+            } else {
+              this.isPraise = false
+            }
+            if (this.queryForm.collectEO && this.queryForm.collectEO.collectStatus == 'Collect') {
+              this.isCollect = true
+            } else {
+              this.isCollect = false
+            }
+          }
+        })
+      },
+      likeClick() {
+        let praiseStatus = ''
+        this.isPraise = !this.isPraise
+        if (this.isPraise) {
+          praiseStatus = 'Praise'
+          this.queryForm.praiseCount = this.queryForm.praiseCount + 1
+        } else {
+          praiseStatus = 'Cancel praise'
+          this.queryForm.praiseCount = this.queryForm.praiseCount - 1
+        }
+        let query = {
+          problemKnowledgeBaseId: this.queryBase.id,
+          praiseUserId: this.userInfo().id,
+          praiseStatus: praiseStatus,
+          id: this.queryForm.praiseEO ? this.queryForm.praiseEO.id : undefined
+        }
+        putAction('/problemKnowledgeBase/problemKnowledgeBasePraiseEO/edit', query).then((res) => {
+          if (!this.queryForm.praiseEO || !this.queryForm.praiseEO.id) {
+            this.queryById()
+          }
+        })
+      },
+      starClick() {
+        let collectStatus = ''
+        this.isCollect = !this.isCollect
+        if (this.isCollect) {
+          collectStatus = 'Collect'
+          this.queryForm.collectCount = this.queryForm.collectCount + 1
+        } else {
+          collectStatus = 'Cancel Collect'
+          this.queryForm.collectCount = this.queryForm.collectCount - 1
+        }
+        let query = {
+          problemKnowledgeBaseId: this.queryBase.id,
+          collectUserId: this.userInfo().id,
+          collectStatus: collectStatus,
+          id: this.queryForm.collectEO ? this.queryForm.collectEO.id : undefined
+        }
+        putAction('/problemKnowledgeBase/problemKnowledgeBaseCollectEO/edit', query).then((res) => {
+          if (!this.queryForm.collectEO || !this.queryForm.collectEO.id) {
+            this.queryById()
+          }
+        })
+      },
+      release() {
+        if (!this.formInline.commentContent) {
+          this.$message.warning(this.$t('pleaseEnter'))
+          return
+        }
+        this.$refs.ruleForm.validate(valid => {
+          if (valid) {
+            let query = {
+              problemKnowledgeBaseId: this.queryBase.id,
+              commentContent: this.formInline.commentContent,
+              commentUserId: this.userInfo().id
+            }
+            this.loading = true
+            postAction('/problemKnowledgeBase/problemKnowledgeBaseCommentEO/add', query).then((res) => {
+              if (res.success) {
+                this.$message.success(this.$t('OperationSuccessful'))
+                this.$refs.ruleForm.clearValidate()
+                this.releaseData()
+                this.formInline = {}
+                this.loading = false
+              } else {
+                this.$message.warning(this.$t('operationFailed'))
+                this.loading = false
+              }
+            })
+          }
+        })
+      },
+      handleOkComment() {
+        this.$refs.ruleFormComment.validate(valid => {
+          if (valid) {
+            let query = {
+              commentId: this.CommentQuery.id,
+              replyContent: this.formInlineComment.replyContent
+            }
+            this.confirmLoading = true
+            postAction('/project/problemKnowledgeBaseReplyEO/add', query).then((res) => {
+              if (res.success) {
+                this.$message.success(this.$t('OperationSuccessful'))
+                this.visibleComment = false
+                this.confirmLoading = false
+                this.releaseData()
+              } else {
+                this.confirmLoading = false
+                this.$message.success(this.$t('operationFailed'))
+              }
+            })
+          }
+        })
+      },
+      handleCancelComment() {
+        this.visibleComment = false
+      },
+      messageClick(val) {
+        this.CommentQuery = val
+        this.visibleComment = true
+        this.formInlineComment = {}
+        this.$nextTick(() => {
+          this.$refs.ruleFormComment.clearValidate()
+        })
+      },
+      releaseData() {
+        let query = {
+          problemKnowledgeBaseId: this.queryBase.id
+        }
+        getAction('/problemKnowledgeBase/problemKnowledgeBaseCommentEO/list', query).then((res) => {
+          if (res.success) {
+            this.releaseList = res.result || []
+          } else {
+            this.releaseList = []
+          }
+        })
+      },
+      back() {
+        this.$emit('problemKnowledgeBase')
+      },
+      forwardClick(row) {
+        this.queryForm = row
+        this.$refs.SelectedByRef.getPush()
+      },
+      SelectedByForm(userIds) {
+        let query = {
+          userIds: userIds,
+          departIds: userIds,
+          problemKnowledgeBaseId: this.queryForm.id,
+          problemKnowledgeBaseTitle: this.queryForm.title
+        }
+        postAction('/problemKnowledgeBase/problemKnowledgeBaseEO/forward', query).then((res) => {
+          if (res.success) {
+            this.$message.success(this.$t('OperationSuccessful'))
+            this.$refs.SelectedByRef.visible = false
+            this.$refs.SelectedByRef.submitLoading = false
+          } else {
+            this.$message.warning(this.$t('operationFailed'))
+            this.$refs.SelectedByRef.submitLoading = false
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped lang="less">
+  .content-box {
+    width: 100%;
+    height: auto;
+    /*padding: 24px 24px 16px 24px;*/
+    /*box-sizing: border-box;*/
+    border: 1px solid #E6E6E9;
+    border-radius: 4px;
+    position: relative;
+    margin-bottom: 20px;
+
+    .content-box-top {
+      width: 100%;
+      height: auto;
+      padding: 20px 24px;
+      box-sizing: border-box;
+      background: #F7F7F8;
+      border-bottom: 1px solid #E6E6E9;
+      display: flex;
+      align-items: center;
+      .icon-left {
+        font-size: 16px;
+        margin-right: 6px;
+        font-weight: bold;
+      }
+
+      .content-box-top-text {
+        font-size: 18px;
+        font-weight: bold;
+        color: #040B29;
+        margin-left: 6px;
+      }
+
+      .content-box-top-color {
+        font-size: 12px;
+        font-weight: 400;
+        color: #00BEBE;
+        padding: 0 10px;
+        box-sizing: border-box;
+        display: inline-block;
+        height: 22px;
+        line-height: 22px;
+        background: #DBF2F3;
+        border-radius: 3px;
+        margin-left: 12px;
+        max-width: 120px;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        overflow: hidden;
+      }
+    }
+
+    .content-box-content {
+      width: 100%;
+      height: auto;
+      margin-top: 16px;
+      padding: 0 24px;
+      margin-bottom: 16px;
+      box-sizing: border-box;
+
+      .content-box-content-top {
+        font-size: 14px;
+        font-weight: 400;
+        color: #040B29;
+        display: -webkit-box;
+        text-overflow: ellipsis;
+        /*! autoprefixer: off */
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 2;
+        /*! autoprefixer: on;*/
+        text-justify: inter-ideograph;
+        word-break: break-all;
+        overflow: hidden;
+      }
+
+      .content-box-content-botton {
+        width: 100%;
+        margin-top: 10px;
+
+        .content-box-content-botton-text {
+          width: 140px;
+          height: 32px;
+          display: inline-block;
+          text-align: center;
+          line-height: 32px;
+          padding: 0 6px;
+          background: #EFF1F3;
+          border-radius: 4px;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          overflow: hidden;
+          font-size: 12px;
+          font-weight: 400;
+          color: #040B29;
+          margin-right: 10px;
+          cursor: pointer;
+
+          .file-text {
+            width: 90px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            display: inline-block;
+            margin-right: 6px;
+            cursor: pointer;
+          }
+
+          .icon-text {
+            font-size: 16px;
+            overflow: hidden;
+            margin-bottom: 9px;
+            color: #00B3BE;
+            cursor: pointer;
+          }
+        }
+      }
+    }
+
+    .content-box-xian {
+      width: 100%;
+      position: absolute;
+      border-bottom: 1px #EFF1F3 solid;
+      left: 0;
+    }
+
+    .content-box-button {
+      width: 100%;
+      margin-top: 32px;
+      overflow: hidden;
+      padding: 0 24px 16px 24px;
+      border-bottom: 1px #EFF1F3 solid;
+
+      .content-box-button-left {
+        width: 50%;
+        float: left;
+
+        .content-box-button-text {
+          display: inline-block;
+          margin-right: 30px;
+          font-size: 14px;
+          font-weight: 400;
+          color: #6F7385;
+          word-break: break-all;
+        }
+      }
+
+      .content-box-button-right {
+        width: 50%;
+        float: left;
+        text-align: right;
+
+        .content-box-button-text {
+          display: inline-block;
+          margin-left: 30px;
+          font-size: 14px;
+          font-weight: 400;
+          color: #040B29;
+          cursor: pointer;
+        }
+      }
+    }
+
+    .content-box-comment {
+      width: 100%;
+      padding: 0 24px;
+      box-sizing: border-box;
+
+      .content-box-comment-text {
+        height: 60px;
+        line-height: 60px;
+        font-size: 16px;
+        font-weight: 400;
+        color: #000F16;
+      }
+
+      .commentContent-text {
+        width: 100%;
+        margin-bottom: 20px;
+
+        .commentContent-header {
+          width: 100%;
+          display: flex;
+          align-items: center;
+
+          .commentContent-yuan {
+            display: inline-block;
+            width: 5px;
+            height: 5px;
+            background: #00BEBE;
+            border-radius: 50%;
+          }
+
+          .commentContent-title {
+            font-size: 14px;
+            margin-left: 8px;
+            font-weight: bold;
+            color: #040B29;
+          }
+
+          .commentContent-time {
+            font-size: 14px;
+            margin-left: 8px;
+            font-weight: 400;
+            color: #6F7385;
+          }
+        }
+
+        .commentContent-content {
+          width: 100%;
+          margin-left: 12px;
+          font-size: 14px;
+          font-weight: 400;
+          color: #040B29;
+          margin-top: 6px;
+        }
+
+        .answer-text {
+          display: inline-block;
+          padding: 3px 14px;
+          background: #FFFFFF;
+          border: 1px solid #E6E6E9;
+          border-radius: 3px;
+          font-size: 12px;
+          font-weight: 400;
+          color: #040B29;
+          margin-left: 12px;
+          margin-top: 6px;
+          cursor: pointer;
+        }
+
+        .commentContent-text-one {
+          width: 100%;
+          margin-left: 12px;
+          background: #F6F7FA;
+          border-radius: 4px;
+          padding: 20px 20px 0 20px;
+          box-sizing: border-box;
+        }
+
+        .commentContent-text-one:last-child {
+          padding-bottom: 20px;
+        }
+      }
+    }
+  }
+
+  .box-title-text {
+    line-height: 1.4;
+    display: flex;
+    /*align-items: center;*/
+  }
+
+  .title-text {
+    width: 88px;
+    text-align: right;
+    display: inline-block;
+    font-weight: 500;
+    font-size: 14px;
+    margin-right: 16px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    height: 42px;
+    line-height: 48px;
+    color: #000F16;
+  }
+
+  .box-input {
+    display: inline-block;
+    height: 38px;
+    width: 100%;
+  }
+
+  .itemModel {
+    width: 100%;
+    display: inline-block;
+    margin-bottom: 12px;
+  }
+
+  .header-btn {
+    height: 38px;
+    margin-left: 16px;
+  }
+
+  .icon-active {
+    color: #00B3BE !important;
+  }
+
+  .text {
+    min-width: 16px;
+    text-align: left;
+    display: inline-block;
+    margin-left: 3px;
+  }
+  .Required {
+    color: red;
+    margin-right: 4px;
+  }
+</style>

jero-web/src/views/businessSupport/technologyAssessment/components/TermInformation.vue

@@ -261,16 +261,23 @@
               itemId: res.id,
               itemNum: res.items_num,
               itemName: res.items_name,
-              itemContent: res.iterms_conditions
+              itemContent: res.iterms_conditions,
+              zhan3_shi4_shun4_xu4: res.zhan3_shi4_shun4_xu4 || ''
             })
           })
         }
         this.dataList = this.ImportFileData.concat(this.dataListData)
+        this.dataList.sort((a, b) => {
+          a.zhan3_shi4_shun4_xu4 - b.zhan3_shi4_shun4_xu4
+        })
         this.dataList = [...this.dataList]
       },
       getPersonnelList(res) {
         this.ImportFileData = this.ImportFileData.concat(res)
         this.dataList = this.dataListData.concat(this.ImportFileData)
+        this.dataList.sort((a, b) => {
+          a.zhan3_shi4_shun4_xu4 - b.zhan3_shi4_shun4_xu4
+        })
         this.dataList = [...this.dataList]
       },
       getUUID() {