Pārlūkot izejas kodu

feature(订单管理系统):
1、项目管理中的编辑改为详情里边的编辑,
2、跟进记录权限修改

niezch 2 gadi atpakaļ
vecāks
revīzija
0494efd37c

+ 414 - 0
src/views/plat/questionnaire/detail.vue

@@ -0,0 +1,414 @@
+<template>
+  <div class="details">
+    <div class="side-layout">
+      <div class="info">
+        <div class="title">
+          <p>调研问卷</p>
+        </div>
+        <header>
+          <el-descriptions :colon="false" :column="7" direction="vertical">
+            <el-descriptions-item content-class-name="my-content" label="单位名称" label-class-name="my-label">
+              <span style="color: #1890ff; cursor: pointer">
+                {{ details.unitName }}
+              </span>
+            </el-descriptions-item>
+          </el-descriptions>
+        </header>
+        <el-tabs v-model="activeName" @tab-click="handleClick">
+          <el-tab-pane label="详细信息" name="details">
+            <el-descriptions
+              border
+              :column="2"
+              :content-style="{ width: '25%', 'word-break': 'break-all' }"
+              :label-style="{ width: '25%' }"
+              size="small">
+              <el-descriptions-item label="单位名称">
+                {{ details.unitName }}
+              </el-descriptions-item>
+              <el-descriptions-item label="职位">
+                {{ details.objPosition }}
+              </el-descriptions-item>
+              <el-descriptions-item label="称呼">
+                {{ details.objName }}
+              </el-descriptions-item>
+              <el-descriptions-item label="电话">
+                {{ details.objPhone }}
+              </el-descriptions-item>
+              <el-descriptions-item label="咨询事项">
+                {{ details.csnMatters }}
+              </el-descriptions-item>
+              <el-descriptions-item label="跟进状态">
+                {{ details.qstStatus === '10' ? '待跟进' : '已跟进' }}
+              </el-descriptions-item>
+              <el-descriptions-item label="跟进情况">
+                {{ details.followUp }}
+              </el-descriptions-item>
+              <el-descriptions-item label="创建时间">
+                {{ details.createdTime }}
+              </el-descriptions-item>
+              <el-descriptions-item label="问题描述" :span="24">
+                {{ details.remark }}
+              </el-descriptions-item>
+            </el-descriptions>
+          </el-tab-pane>
+        </el-tabs>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  import { mapGetters } from 'vuex'
+  import questionnaireApi from '@/api/plat/questionnaire'
+
+  export default {
+    name: 'BusinessDetail',
+    components: {},
+    data() {
+      return {
+        id: undefined,
+        details: {},
+        activeName: 'details',
+      }
+    },
+    computed: {
+      ...mapGetters({
+        avatar: 'user/avatar',
+        username: 'user/username',
+      }),
+    },
+    created() {
+      this.id = parseInt(this.$route.query.id)
+      this.init()
+    },
+    mounted() {},
+    methods: {
+      init() {
+        Promise.all([questionnaireApi.getEntityById({ id: this.id })]).then(([details]) => {
+          if (details.data) this.details = details.data
+          // console.log(this.details,"this.details")
+          // debugger
+        })
+      },
+      handleClick() {},
+    },
+  }
+</script>
+
+<style lang="scss" scoped>
+  ::v-deep .el-tabs__content {
+    overflow: auto;
+  }
+
+  $base: '.details';
+  #{$base} {
+    height: calc(100vh - 60px - 12px * 2 - 40px);
+    display: flex;
+    padding: 20px 40px;
+
+    > .el-row {
+      flex: 1;
+
+      > .el-col {
+        height: 100%;
+      }
+    }
+
+    .title {
+      p,
+      h3 {
+        margin: 0;
+      }
+
+      p {
+        font-size: 14px;
+        font-weight: 400;
+        line-height: 22px;
+      }
+
+      h3 {
+        font-size: 24px;
+        font-weight: 500;
+        line-height: 36px;
+        color: #333;
+        display: flex;
+        justify-content: space-between;
+      }
+    }
+
+    header {
+      height: 74px;
+      background: rgba(196, 196, 196, 0.5);
+      border-radius: 4px;
+      display: flex;
+      align-items: center;
+      padding: 0 20px;
+      margin-top: 16px;
+
+      ::v-deep .el-descriptions__body {
+        background: transparent;
+      }
+
+      ::v-deep .my-label {
+        font-size: 14px;
+        font-weight: 600;
+        color: #1d66dc;
+      }
+
+      ::v-deep .my-content {
+        font-size: 14px;
+        font-weight: 600;
+        color: #333;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+    }
+
+    .el-tabs {
+      height: calc(100% - 148px);
+      display: flex;
+      flex-direction: column;
+
+      ::v-deep .el-tabs__content {
+        flex: 1;
+
+        .el-tab-pane {
+          height: 100%;
+        }
+      }
+    }
+
+    .buttons {
+      padding-top: 28px;
+      text-align: right;
+    }
+
+    .records {
+      margin: 0;
+      padding: 10px 20px;
+      list-style: none;
+      height: calc(100% - 60px);
+      overflow-y: auto;
+
+      > li {
+        display: flex;
+
+        & + li {
+          margin-top: 10px;
+        }
+      }
+
+      .date {
+        width: 100px;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+
+        h2,
+        h3 {
+          margin: 0;
+        }
+
+        h2 {
+          font-size: 26px;
+          line-height: 32px;
+        }
+      }
+
+      .content {
+        flex: 1;
+        list-style: none;
+
+        li {
+          display: flex;
+
+          & + li {
+            margin-top: 10px;
+          }
+        }
+
+        .user-avatar {
+          font-size: 40px;
+        }
+
+        .text {
+          flex: 1;
+          padding-left: 20px;
+
+          p {
+            font-weight: 500;
+            margin: 0;
+            line-height: 20px;
+
+            span {
+              color: #1d66dc;
+            }
+          }
+
+          p:nth-child(2) {
+            margin-bottom: 10px;
+          }
+
+          .action {
+            font-weight: bold;
+            color: #333;
+          }
+        }
+      }
+    }
+
+    .follow {
+      height: 100%;
+      padding: 10px 20px;
+      overflow: auto;
+
+      > li {
+        display: flex;
+
+        + li {
+          margin-top: 10px;
+        }
+      }
+
+      .date {
+        width: 100px;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+
+        h2,
+        h3 {
+          margin: 0;
+        }
+
+        h2 {
+          font-size: 26px;
+          line-height: 32px;
+        }
+      }
+
+      .content {
+        flex: 1;
+        list-style: none;
+
+        > li {
+          border: 1px solid rgb(215, 232, 244);
+          background: rgb(247, 251, 254);
+          border-radius: 4px;
+          padding: 8px;
+          overflow: hidden;
+
+          .text-container {
+            display: flex;
+          }
+
+          .comments {
+            padding-left: 60px;
+            margin-top: 10px;
+            max-height: 190px;
+            overflow: auto;
+
+            li {
+              display: flex;
+              border-top: 1px solid #e3e5e7;
+
+              .text {
+                flex: 1;
+                padding: 0 10px;
+
+                p {
+                  font-weight: 500;
+                  margin: 0;
+                  line-height: 32px;
+                }
+
+                p:first-child {
+                  line-height: 30px;
+                  font-weight: bold;
+                }
+
+                p:last-child {
+                  font-size: 12px;
+                  color: #9499a0;
+                  text-align: right;
+                }
+              }
+            }
+          }
+
+          + li {
+            margin-top: 10px;
+          }
+        }
+
+        .user-avatar {
+          font-size: 40px;
+        }
+
+        .text {
+          flex: 1;
+          padding-left: 20px;
+          padding-right: 10px;
+
+          p {
+            font-weight: 500;
+            margin: 0;
+            line-height: 32px;
+
+            span {
+              color: #1d66dc;
+            }
+          }
+
+          .action {
+            display: flex;
+            justify-content: space-between;
+
+            span:first-child {
+              font-weight: bold;
+              color: #333;
+            }
+          }
+
+          .footer {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+          }
+        }
+      }
+    }
+
+    .no-follow {
+      height: 100%;
+      width: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 12px;
+      color: rgba(0, 0, 0, 0.65);
+    }
+  }
+
+  .height-enter-active,
+  .height-leave-active {
+    transition: all 0.5s;
+  }
+
+  .height-enter-to,
+  .height-leave {
+    height: 190px;
+  }
+
+  .height-enter, .height-leave-to /* .fade-leave-active below version 2.1.8 */ {
+    height: 0;
+  }
+
+  ::v-deep .el-descriptions__table tbody {
+    td,
+    th {
+      width: 25%;
+    }
+  }
+</style>

+ 17 - 2
src/views/plat/questionnaire/index.vue

@@ -58,8 +58,13 @@
 
     <el-table v-loading="listLoading" border :data="list" :height="height" @selection-change="setSelectRows">
       <el-table-column align="center" show-overflow-tooltip type="selection" />
-
-      <el-table-column align="center" label="单位名称" prop="unitName" show-overflow-tooltip />
+      <el-table-column align="center" label="单位名称" prop="unitName" show-overflow-tooltip>
+        <template #default="{ row }">
+          <el-button class="link-button" type="text" @click="handleDetail(row)">
+            {{ row.unitName }}
+          </el-button>
+        </template>
+      </el-table-column>
       <el-table-column align="center" label="职位" prop="objPosition" show-overflow-tooltip />
       <el-table-column align="center" label="称呼" prop="objName" show-overflow-tooltip />
       <el-table-column align="center" label="电话" prop="objPhone" show-overflow-tooltip />
@@ -148,6 +153,16 @@
           this.$refs['edit'].showEdit()
         }
       },
+      // 跳转详情
+      handleDetail(row) {
+        this.$router.push({
+          name: 'QuestionnaireDetail',
+          query: {
+            id: row.id,
+          },
+          params: '',
+        })
+      },
       handleDelete(row) {
         if (row.id) {
           this.$baseConfirm('你确定要删除当前项吗', null, async () => {

+ 9 - 1
src/views/report/followup/index.vue

@@ -1,7 +1,15 @@
+<!--
+ * @Author: niezch@dashoo.cn
+ * @Date: 2023-04-03 09:32:08
+ * @LastEditors: niezch@dashoo.cn
+ * @LastEditTime: 2023-04-06 18:07:13
+ * @Description: file content
+ * @FilePath: \opms_frontend\src\views\report\followup\index.vue
+-->
 <template>
   <div class="detail">
     <h2 style="text-align: center">跟进记录统计报表</h2>
-    <div style="float: right">
+    <div style="float: right; margin-bottom: 10px">
       <p>
         月份:
         <el-date-picker v-model="month" type="month" value-format="yyyy-MM-dd" @change="fetchData" />