feature(项目管理): 项目管理详情修改

src/views/proj/business/components/BusinessGradation.vue

@@ -0,0 +1,88 @@
+<template>
+  <div style="display: inline-block; margin: 0 10px">
+    <el-button :disabled="nboType === 'A'" type="primary" @click="handleClick('升级')">升级</el-button>
+    <el-button :disabled="nboType === 'C'" type="danger" @click="handleClick('降级')">降级</el-button>
+    <el-dialog :title="title" :visible.sync="dialogFormVisible" width="500px" @close="close">
+      <el-form ref="form" label-width="80px" :model="form" :rules="rules">
+        <el-form-item label="备注信息" prop="remark">
+          <el-input
+            v-model="form.remark"
+            maxlength="300"
+            placeholder="请输入备注信息"
+            rows="5"
+            show-word-limit
+            type="textarea" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="close">取 消</el-button>
+        <el-button type="primary" @click="save">确 定</el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+  import businessApi from '@/api/proj/business'
+
+  export default {
+    name: 'BusinessGradation',
+    props: {
+      // 项目Id
+      busId: {
+        type: Number,
+        required: true,
+      },
+      // 项目类别
+      nboType: {
+        type: String,
+        required: true,
+        validator: function (value) {
+          // 这个值必须匹配下列字符串中的一个
+          return ['A', 'B', 'C'].includes(value)
+        },
+      },
+    },
+    data() {
+      return {
+        title: '项目',
+        form: {
+          id: undefined,
+          remark: undefined,
+        },
+        rules: {},
+        dialogFormVisible: false,
+      }
+    },
+    methods: {
+      // 业务调级（升级、降级）
+      handleClick(type) {
+        this.title = type
+        this.form.id = this.busId
+        this.dialogFormVisible = true
+      },
+      open(row) {
+        this.form.id = row.id
+        this.dialogFormVisible = true
+      },
+      close() {
+        this.$refs['form'].resetFields()
+        this.form = this.$options.data().form
+        this.dialogFormVisible = false
+      },
+      save() {
+        if ((this.title === '降级' && this.nboType === 'A') || (this.title === '升级' && this.nboType === 'C')) {
+          this.form.nboType = 'B'
+        } else {
+          this.form.nboType = this.title === '升级' ? 'A' : 'C'
+        }
+        this.$baseConfirm('你确定要对当前项目' + this.title + '吗', null, async () => {
+          const { msg } = await businessApi.businessGradation(this.form)
+          this.$baseMessage(msg, 'success')
+          this.$emit('fetch-data')
+          this.close()
+        })
+      },
+    },
+  }
+</script>

src/views/proj/business/components/DetailsContact.vue

@@ -17,22 +17,22 @@
     </vab-query-form>
     <el-table v-loading="listLoading" :data="contactList" height="calc(100% - 42px)" @selection-change="setSelectRows">
       <el-table-column align="center" type="selection" />
-      <el-table-column align="center" label="姓名" prop="cuctName" />
-      <el-table-column align="center" label="岗位" prop="postion" />
-      <el-table-column align="center" label="电话" prop="telephone" />
-      <el-table-column align="center" label="微信" prop="wechat" />
-      <el-table-column align="center" label="邮箱" prop="email" />
+      <el-table-column align="center" label="姓名" prop="cuctName" show-overflow-tooltip />
+      <el-table-column align="center" label="岗位" prop="postion" show-overflow-tooltip />
+      <el-table-column align="center" label="电话" prop="telephone" show-overflow-tooltip />
+      <el-table-column align="center" label="微信" prop="wechat" show-overflow-tooltip />
+      <el-table-column align="center" label="邮箱" prop="email" show-overflow-tooltip />
       <!--      <el-table-column align="center" label="是否决策人">-->
       <!--        <template slot-scope="scope">-->
       <!--          <el-switch v-model="scope.row.policy" :active-value="1" disabled :inactive-value="0" />-->
       <!--        </template>-->
       <!--      </el-table-column>-->
-      <el-table-column align="center" label="操作">
+      <el-table-column align="center" label="操作" show-overflow-tooltip>
         <template slot-scope="scope">
           <el-button v-if="scope.row.contactId !== primacyContactId" type="text" @click="setPrimacyContact(scope.row)">
             设为首要联系人
           </el-button>
-          <p v-else>首要联系人</p>
+          <span v-else>首要联系人</span>
         </template>
       </el-table-column>
     </el-table>

src/views/proj/business/components/DetailsFollow.vue

@@ -55,15 +55,21 @@
       </li>
     </ul>
     <div v-else class="no-follow">暂无跟进记录</div>
+    <!-- 跟进详情 -->
+    <FollowDetail ref="followDetail" />
   </div>
 </template>
 
 <script>
   import follow from '@/api/customer/follow'
   import to from 'await-to-js'
+  import FollowDetail from '@/views/customer/components/FollowDetail'
 
   export default {
     name: 'Records',
+    components: {
+      FollowDetail,
+    },
     props: {
       busId: {
         type: Number,
@@ -79,9 +85,27 @@
       console.log(this.busId)
     },
     methods: {
+      // 跟进记录详情
+      showDetail(row) {
+        this.$refs.followDetail.init({ ...row })
+      },
+      // 展开评论
+      showComment(row) {
+        if (!row.comments.length) return this.$message.warning('暂无评论')
+        row.showComment = !row.showComment
+        this.$forceUpdate()
+      },
+      formatType(val) {
+        let str = ''
+        if (val == 10) str = '电话'
+        else if (val == 20) str = '邮件'
+        else if (val == 30) str = '拜访'
+        return str
+      },
       async fetchData() {
         let params = {
           targetId: String(this.busId),
+          targetType: '20',
           DaysBeforeToday: 9999,
         }
         let err, res

src/views/proj/business/components/DetailsRecords.vue

@@ -27,7 +27,8 @@
                 <span>{{ item.opnContent.saleName }}</span>
               </p>
               <p v-if="item.opnType === '40' || item.opnType === '50'">
-                <span>{{ item.opnContent }}</span>
+                项目类别：
+                <span>{{ item.opnContent.origNboType + ' => ' + item.opnContent.nboType }}</span>
               </p>
 
               <p v-if="item.opnContent.custName">
@@ -84,6 +85,8 @@
           return '设置首要联系人'
         } else if (opnType === '70') {
           return '关联了联系人'
+        } else if (opnType === '80') {
+          return '解除关联了联系人'
         } else {
           return ''
         }

src/views/proj/business/components/Transfer.vue

@@ -38,7 +38,7 @@
     data() {
       return {
         form: {
-          Id: undefined,
+          id: undefined,
           userId: undefined,
           userName: undefined,
           remark: undefined,
@@ -61,7 +61,7 @@
         this.form.userName = val.map((item) => item.nickName).join()
       },
       open(row) {
-        this.form.Id = row.id
+        this.form.id = row.id
         this.dialogFormVisible = true
       },
       close() {

src/views/proj/business/detail.vue

@@ -7,12 +7,7 @@
           <h3>
             {{ details.nboName }}
             <span>
-              <el-button :disabled="details.nboType === 'A'" type="primary" @click="handleBusinessGradation('升级')">
-                升级
-              </el-button>
-              <el-button :disabled="details.nboType === 'C'" type="danger" @click="handleBusinessGradation('降级')">
-                降级
-              </el-button>
+              <business-gradation :bus-id="id" :nbo-type="details.nboType" @fetch-data="init" />
               <el-button @click="handleTransfer">转移项目</el-button>
               <el-button>创建工单</el-button>
               <el-button @click="createContract">创建合同</el-button>
@@ -121,16 +116,16 @@
           <el-tab-pane label="工单记录" name="worksheet" />
           <el-tab-pane label="归属记录" name="belong">
             <el-table v-loading="belongLoading" border :data="belongs" height="calc(100% - 42px)">
-              <el-table-column align="center" label="归属销售" prop="opnContent.saleName" />
-              <el-table-column align="center" label="原来归属" prop="opnContent.origSaleName" />
+              <el-table-column align="center" label="归属销售" prop="opnContent.saleName" show-overflow-tooltip />
+              <el-table-column align="center" label="原来归属" prop="opnContent.origSaleName" show-overflow-tooltip />
               <el-table-column align="center" label="操作方式" prop="opnType">
                 <template slot-scope="scope">
                   <el-tag v-if="scope.row.opnType == 30">转移</el-tag>
                 </template>
               </el-table-column>
-              <el-table-column align="center" label="操作人" prop="createdName" />
-              <el-table-column align="center" label="操作时间" min-width="160px" prop="opnDate" />
-              <el-table-column align="center" label="备注" prop="remark" />
+              <el-table-column align="center" label="操作人" prop="createdName" show-overflow-tooltip />
+              <el-table-column align="center" label="操作时间" min-width="160px" prop="opnDate" show-overflow-tooltip />
+              <el-table-column align="center" label="备注" prop="remark" show-overflow-tooltip />
             </el-table>
           </el-tab-pane>
         </el-tabs>
@@ -153,6 +148,7 @@
 </template>
 
 <script>
+  import BusinessGradation from '@/views/proj/business/components/BusinessGradation'
   import to from 'await-to-js'
   import { mapGetters } from 'vuex'
   import businessApi from '@/api/proj/business'
@@ -166,11 +162,20 @@
 
   export default {
     name: 'BusinessDetail',
-    components: { Edit, Transfer, DetailsContact, DetailsContract, DetailsRecords, DetailsFollow, ContractEdit },
+    components: {
+      BusinessGradation,
+      Edit,
+      Transfer,
+      DetailsContact,
+      DetailsContract,
+      DetailsRecords,
+      DetailsFollow,
+      ContractEdit,
+    },
     data() {
       return {
         id: undefined,
-        details: {},
+        details: { nboType: '' },
         product: [],
         abstract: {},
         activeName: 'follow',
@@ -189,24 +194,27 @@
         username: 'user/username',
       }),
     },
-    mounted() {
+    created() {
       this.id = parseInt(this.$route.query.id)
+    },
+    mounted() {
       this.init()
     },
     methods: {
-      async init() {
-        Promise.all([businessApi.getEntityById({ id: this.id })]).then(([details]) => {
-          console.log(details.data)
+      init() {
+        Promise.all([
+          businessApi.getEntityById({ id: this.id }),
+          this.getRecord(),
+          this.handleClick({ name: this.activeName }),
+        ]).then(([details]) => {
           if (details.data) this.details = details.data
         })
-        await this.getRecord()
-        await this.handleClick({ name: this.activeName })
       },
       async getRecord() {
         const [err, res] = await to(businessApi.getBusinessDynamics({ busId: this.id }))
         if (err) return
-        if (res.data.list[0]) {
-          let obj = res.data.list[0]
+        if (res.data.list) {
+          let obj = res.data.list
           const keys = Object.keys(obj).reverse()
           let records = {}
           for (const item of keys) {
@@ -220,13 +228,10 @@
       async handleClick(tab) {
         if (tab.name == 'follow') {
           await this.$refs.follow.fetchData()
-          return
         } else if (tab.name == 'contact') {
           await this.$refs.contact.fetchData()
-          return
         } else if (tab.name == 'contract') {
           this.$refs.detailsContract.open(this.id)
-          return
         } else if (tab.name == 'worksheet') {
           return
         } else if (tab.name == 'belong') {
@@ -238,7 +243,6 @@
           this.belongs = list ? list : []
           this.belongTotal = total
           this.belongLoading = false
-          return
         } else {
           return
         }