修改议题详情样式

src/views/modules/events/issue-change.vue

@@ -16,6 +16,11 @@ export default {
   components: {
     IssueChangeList,
     IssueCloseDetailView
+  },
+  methods: {
+    init () {
+      this.selectComponent = IssueChangeList
+    }
   }
 }
 </script>

src/views/modules/events/issue-close-detail-view.vue

@@ -2,6 +2,7 @@
     <div class="project-handle">
         <el-form :model="dataForm" :rules="dataRule" ref="dataForm" style="width: 100%; height: 100%;">
             <div class="project-detail">
+                <div class="project-detail-tip">议题详情</div>
                 <el-form label-position="right" label-width="120px">
                     <el-form-item label="议题内容:">
                         <div>{{dataForm.issueContent}}</div>
@@ -43,9 +44,13 @@
                 </div>
             </div>
             <div class="project-progress">
+              <div class="project-progress-tip">处理进展</div>
                 <el-form-item>
                     <el-timeline>
-                        <el-timeline-item v-for="(jobFeedbackDTO, index) in dataForm.feedbackDTOList" :key="index" placement="top">
+                        <el-timeline-item
+                          v-for="(jobFeedbackDTO, index) in dataForm.feedbackDTOList"
+                          :key="index" placement="top"
+                          :color="index === dataForm.feedbackDTOList.length - 1 ? '#ccc' : 'green'">
                             <div v-if="jobFeedbackDTO.stateName === '【反馈】'">{{jobFeedbackDTO.createdTime}} {{'【回应】'}}</div>
                             <div v-else>{{jobFeedbackDTO.createdTime}} {{jobFeedbackDTO.stateName}}</div>
                             <div>处理部门： {{jobFeedbackDTO.handlerDept}}</div>
@@ -54,6 +59,9 @@
                     </el-timeline>
                 </el-form-item>
             </div>
+            <div style="width: 100%; text-align:center; float:left;">
+              <el-button size="medium" type="primary" @click="back">返回</el-button>
+            </div>
         </el-form>
         <el-dialog width="90%" title="评论" :visible.sync="innerVisible" append-to-body>
             <el-table :data="commentsDTOs" border style="width: 100%;">
@@ -112,8 +120,8 @@ export default {
     this.init()
   },
   methods: {
-    backToItemDeal () {
-      this.$parent.selectComponent = 'ItemDeal'
+    back () {
+      this.$parent.init()
     },
     initBmap (latitude, longitude) {
       this.map = new BMap.Map('map')
@@ -195,18 +203,31 @@ export default {
 <style lang="scss" scoped>
     .project-handle {
         width: 100%;
-        height: calc(100vh - 50px - 38px - 15px);
+        height: calc(100vh - 120px);
         background: #ffffff;
         box-sizing: border-box;
         padding: 10px;
         .project-detail {
-            width: 79%;
-            height: 70%;
-            border: 2px solid #ccc;
-            box-sizing: border-box;
-            padding: 10px;
-            float:left;
-            margin-bottom: 1%;
+          width: 79%;
+          height: 80%;
+          border: 2px solid #ccc;
+          box-sizing: border-box;
+          padding: 10px;
+          padding-top: 20px;
+          float:left;
+          margin-bottom: 1%;
+          position:relative;
+          .project-detail-tip {
+            position: absolute;
+            top: 0;
+            left:0;
+            width: 80px;
+            height: 30px;
+            line-height: 30px;
+            color: #ffffff;
+            background: #4ac38b;
+            text-align:center;
+          }
             .el-form {
                 width: 58%;
                 height: 100%;
@@ -240,14 +261,27 @@ export default {
             }
         }
         .project-progress {
-            width: 20%;
-            height: 100%;
-            float: right;
-            border: 2px solid #ccc;
-            box-sizing: border-box;
-            margin-left: 1%;
-            padding-top: 20px;
-            overflow-y:auto;
+          width: 20%;
+          height: 80%;
+          float: right;
+          border: 2px solid #ccc;
+          box-sizing: border-box;
+          margin-left: 1%;
+          padding-top: 20px;
+          overflow-y:auto;
+          position: relative;
+          padding-top: 40px;
+          .project-progress-tip {
+            position: absolute;
+            top: 0;
+            left:0;
+            width: 80px;
+            height: 30px;
+            line-height: 30px;
+            color: #ffffff;
+            background: #0098ff;
+            text-align:center;
+          }
             &::-webkit-scrollbar {
                 width: 5px;
                 height: 1px;

src/views/modules/events/issue-close.vue

@@ -16,6 +16,11 @@ export default {
   components: {
     IssueClose,
     IssueCloseDetailView
+  },
+  methods: {
+    init () {
+      this.selectComponent = IssueClose
+    }
   }
 }
 </script>

src/views/modules/events/issue-process-detail-view.vue

@@ -2,6 +2,7 @@
     <div class="project-handle">
         <el-form :model="dataForm" :rules="dataRule" ref="dataForm" style="width: 100%; height: 100%;">
             <div class="project-detail">
+                <div class="project-detail-tip">议题详情</div>
                 <el-form label-position="right" label-width="120px">
                     <el-form-item label="议题内容:" prop="eventContent">
                         <div>{{dataForm.issueContent}}</div>
@@ -36,9 +37,13 @@
                 </div>
             </div>
             <div class="project-progress">
+                <div class="project-progress-tip">处理进展</div>
                 <el-form-item>
                     <el-timeline>
-                        <el-timeline-item v-for="(jobFeedbackDTO, index) in dataForm.jobFeedbackDTOS" :key="index" placement="top">
+                        <el-timeline-item
+                          v-for="(jobFeedbackDTO, index) in dataForm.jobFeedbackDTOS"
+                          :key="index" placement="top"
+                          :color="index === dataForm.jobFeedbackDTOS.length - 1 ? '#ccc': 'green'">
                             <div v-if="jobFeedbackDTO.stateName === '【反馈】'">{{jobFeedbackDTO.createdTime}} {{'【回应】'}}</div>
                             <div v-else>{{jobFeedbackDTO.createdTime}} {{jobFeedbackDTO.stateName}}</div>
                             <div>处理部门： {{jobFeedbackDTO.handlerDept}}</div>
@@ -48,6 +53,7 @@
                 </el-form-item>
             </div>
             <div class="handle-operation">
+               <div class="handle-operation-tip">处理操作</div>
               <el-form label-width="120px" label-position="right" style="width: 720px;" >
                 <el-form-item label="处理:" prop="state">
                     <el-select v-model="dataForm.state" placeholder="请选择">
@@ -204,7 +210,7 @@ export default {
 <style lang="scss" scoped>
     .project-handle {
         width: 100%;
-        height: calc(100vh - 50px - 38px - 15px);
+        height: calc(100vh - 120px);
         background: #ffffff;
         box-sizing: border-box;
         padding: 10px;
@@ -214,8 +220,21 @@ export default {
             border: 2px solid #ccc;
             box-sizing: border-box;
             padding: 10px;
+            padding-top: 20px;
             float:left;
             margin-bottom: 1%;
+            position:relative;
+            .project-detail-tip {
+              position: absolute;
+              top: 0;
+              left:0;
+              width: 80px;
+              height: 30px;
+              line-height: 30px;
+              color: #ffffff;
+              background: #4ac38b;
+              text-align:center;
+            }
             .el-form {
                 width: 58%;
                 height: 100%;
@@ -257,6 +276,19 @@ export default {
             margin-left: 1%;
             padding-top: 20px;
             overflow-y:auto;
+            position: relative;
+            padding-top: 40px;
+            .project-progress-tip {
+              position: absolute;
+              top: 0;
+              left:0;
+              width: 80px;
+              height: 30px;
+              line-height: 30px;
+              color: #ffffff;
+              background: #0098ff;
+              text-align:center;
+            }
             &::-webkit-scrollbar {
                 width: 5px;
                 height: 1px;
@@ -271,13 +303,38 @@ export default {
             }
         }
         .handle-operation {
-          padding-top: 20px;
+          padding-top: 30px;
           box-sizing: border-box;
           width: 79%;
           height: 49%;
           box-sizing: border-box;
           border: 2px solid #ccc;
           float:left;
+          position: relative;
+          overflow-y: auto;
+          .handle-operation-tip {
+            position: absolute;
+            top: 0;
+            left:0;
+            width: 80px;
+            height: 30px;
+            line-height: 30px;
+            color: #ffffff;
+            background: #ff7600;
+            text-align:center;
+          }
+          &::-webkit-scrollbar {
+            width: 5px;
+            height: 1px;
+          }
+          &::-webkit-scrollbar-thumb {
+            border-radius: 5px;
+            background: #aaa;
+          }
+          &::-webkit-scrollbar-track {
+            border-radius: 10px;
+            background: #ccc;
+          }
         }
     }
 </style>

src/views/modules/events/issue-process.vue

@@ -18,6 +18,11 @@ export default {
     IssueProcessList,
     IssueProcessDetailView,
     IssueCloseDetailView
+  },
+  methods: {
+    init () {
+      this.selectComponent = IssueProcessList
+    }
   }
 }
 </script>

src/views/modules/events/issue-reject-detail-view.vue

@@ -2,6 +2,7 @@
     <div class="project-handle">
         <el-form :model="dataForm" ref="dataForm" style="width: 100%; height: 100%;">
             <div class="project-detail">
+                <div class="project-detail-tip">议题详情</div>
                 <el-form label-position="right" label-width="120px">
                     <el-form-item label="议题内容:" prop="eventContent">
                         <div>{{dataForm.eventContent}}</div>
@@ -36,6 +37,9 @@
                     <div id="map"></div>
                 </div>
             </div>
+            <div style="width: 100%; text-align:center;">
+              <el-button size="medium" type="primary" @click="back">返回</el-button>
+            </div>
         </el-form>
     </div>
 </template>
@@ -64,8 +68,8 @@ export default {
     this.init()
   },
   methods: {
-    backToItemDeal () {
-      this.$parent.selectComponent = 'ItemDeal'
+    back () {
+      this.$parent.init()
     },
     initBmap (latitude, longitude) {
       this.map = new BMap.Map('map')
@@ -113,18 +117,31 @@ export default {
 <style lang="scss" scoped>
     .project-handle {
         width: 100%;
-        height: calc(100vh - 50px - 38px - 15px);
+        height: calc(100vh - 120px);
         background: #ffffff;
         box-sizing: border-box;
         padding: 10px;
         .project-detail {
-            width: 100%;
-            height: 70%;
-            border: 2px solid #ccc;
-            box-sizing: border-box;
-            padding: 10px;
-            float:left;
-            margin-bottom: 1%;
+          width: 100%;
+          height: 80%;
+          border: 2px solid #ccc;
+          box-sizing: border-box;
+          padding: 10px;
+          padding-top: 20px;
+          float:left;
+          margin-bottom: 1%;
+          position:relative;
+          .project-detail-tip {
+            position: absolute;
+            top: 0;
+            left:0;
+            width: 80px;
+            height: 30px;
+            line-height: 30px;
+            color: #ffffff;
+            background: #4ac38b;
+            text-align:center;
+          }
             .el-form {
                 width: 58%;
                 height: 100%;

src/views/modules/events/issue-reject.vue

@@ -16,6 +16,11 @@ export default {
   components: {
     IssueRejectList,
     IssueRejectDetailView
+  },
+  methods: {
+    init () {
+      this.selectComponent = IssueRejectList
+    }
   }
 }
 </script>

src/views/modules/events/issue-review-detail-view.vue

@@ -2,6 +2,7 @@
     <div class="project-handle">
         <el-form :model="dataForm" :rules="dataRule" ref="dataForm" style="width: 100%; height: 100%;">
             <div class="project-detail">
+              <div class="project-detail-tip">议题详情</div>
                 <el-form label-position="right" label-width="120px">
                     <el-form-item label="议题内容:" prop="eventContent">
                         <div>{{dataForm.eventContent}}</div>
@@ -31,6 +32,7 @@
                 </div>
             </div>
             <div class="handle-operation">
+              <div class="handle-operation-tip">处理操作</div>
               <el-form label-width="120px" label-position="right" style="width: 720px;">
                 <el-form-item label="审核:" prop="eventState">
                     <el-radio v-model="dataForm.eventState" label="4">审核通过</el-radio>
@@ -208,7 +210,7 @@ export default {
 <style lang="scss" scoped>
     .project-handle {
         width: 100%;
-        height: calc(100vh - 50px - 38px - 15px);
+        height: calc(100vh - 120px);
         background: #ffffff;
         box-sizing: border-box;
         padding: 10px;
@@ -218,8 +220,21 @@ export default {
             border: 2px solid #ccc;
             box-sizing: border-box;
             padding: 10px;
+            padding-top: 20px;
             float:left;
             margin-bottom: 1%;
+            position:relative;
+            .project-detail-tip {
+              position: absolute;
+              top: 0;
+              left:0;
+              width: 80px;
+              height: 30px;
+              line-height: 30px;
+              color: #ffffff;
+              background: #4ac38b;
+              text-align:center;
+            }
             .el-form {
                 width: 58%;
                 height: 100%;
@@ -275,13 +290,25 @@ export default {
             }
         }
         .handle-operation {
-          padding-top: 20px;
+          padding-top: 30px;
           box-sizing: border-box;
-            width: 100%;
-            height: 49%;
-            box-sizing: border-box;
-            border: 2px solid #ccc;
-            float:left;
+          width: 100%;
+          height: 49%;
+          box-sizing: border-box;
+          border: 2px solid #ccc;
+          float:left;
+          position: relative;
+          .handle-operation-tip {
+            position: absolute;
+            top: 0;
+            left:0;
+            width: 80px;
+            height: 30px;
+            line-height: 30px;
+            color: #ffffff;
+            background: #ff7600;
+            text-align:center;
+          }
         }
     }
 </style>