|
|
@@ -0,0 +1,234 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <ul class="records" :style="{ height: height }">
|
|
|
+ <li v-for="(v, index) in dynamicsList" :key="index">
|
|
|
+ <div class="date">
|
|
|
+ {{ parseTime(v.createdTime, '{y}-{m}-{d}') }}
|
|
|
+ <h2>{{ parseTime(v.createdTime, '{y}-{m}-{d}').split('-')[2] }}</h2>
|
|
|
+ <h3>{{ parseTime(v.createdTime, '{y}-{m}-{d}').split('-').splice(0, 2).join('.') }}</h3>
|
|
|
+ </div>
|
|
|
+ <ul class="content">
|
|
|
+ <li>
|
|
|
+ <vab-icon class="user-avatar" icon="account-circle-fill" />
|
|
|
+ <div class="text">
|
|
|
+ <p class="action">{{ v.assignUserName }} {{ v.orderTypeName }}</p>
|
|
|
+ <p>{{ parseTime(v.updatedTime, '{y}-{m}-{d}') }}</p>
|
|
|
+ <el-row
|
|
|
+ v-if="v.orderTypeName == '产品试用申请(硬件)' || v.orderTypeName == '产品试用申请(软件)'"
|
|
|
+ :gutter="20">
|
|
|
+ <el-col v-if="v.feedbackTrail" :span="24">
|
|
|
+ <p class="tit">支持人员总结:</p>
|
|
|
+ <el-descriptions
|
|
|
+ v-for="(row, idx) in v.feedbackTrail"
|
|
|
+ v-show="idx < (v.showLength ? v.showLength : 3)"
|
|
|
+ :key="idx"
|
|
|
+ border
|
|
|
+ :column="2"
|
|
|
+ :content-style="CS"
|
|
|
+ :label-style="LS">
|
|
|
+ <el-descriptions-item label="反馈时间">
|
|
|
+ {{ row.feedbackTrialTime }} {{ v.showLength }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="试用反馈类型">
|
|
|
+ {{ tryType[row.feedbackTrialType] }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="总结/问题">
|
|
|
+ {{ row.feedbackTrialContent }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="客户/经销商反馈">
|
|
|
+ {{ row.feedbackTrialDist }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="计划">
|
|
|
+ {{ row.feedbackTrialPlan }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="更新时间">
|
|
|
+ {{ parseTime(row.feedbackSupportTime, '{y}-{m}-{d}') }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ <div v-if="v.feedbackTrail && v.feedbackTrail.length > 3" style="margin-top: 10px">
|
|
|
+ <el-button size="mini" @click="changeLength(index, 3)">收起</el-button>
|
|
|
+ <el-button size="mini" @click="changeLength(index, 999)">展开</el-button>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row v-if="v.orderTypeName == '技术文件支持' || v.orderTypeName == '售前讲解支持'" :gutter="20">
|
|
|
+ <el-col v-if="v.feedbackSupportTime" :span="24">
|
|
|
+ <p class="tit">支持人员总结:</p>
|
|
|
+ <el-descriptions border :column="2" :content-style="CS" :label-style="LS">
|
|
|
+ <el-descriptions-item label="反馈时间">{{ v.feedbackSupportTime }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="本次讲解情况反馈">
|
|
|
+ {{ v.feedbackSupportContent }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="更新时间">
|
|
|
+ {{ parseTime(v.feedbackSupportTime, '{y}-{m}-{d}') }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ </el-col>
|
|
|
+ <el-col v-if="v.feedbackSaleTime" :span="24">
|
|
|
+ <p class="tit">销售人员反馈:</p>
|
|
|
+ <el-descriptions border :column="2" :content-style="CS" :label-style="LS">
|
|
|
+ <el-descriptions-item label="反馈时间">{{ v.feedbackSaleTime }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item v-if="v.orderTypeName == '售前讲解支持'" label="会议纪要">
|
|
|
+ {{ v.feedbackSaleMeeting }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item v-if="v.orderTypeName == '售前讲解支持'" label="客户/经销商反馈">
|
|
|
+ {{ v.feedbackSaleDist }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item v-if="v.orderTypeName == '技术文件支持'" label="用户反馈">
|
|
|
+ {{ v.feedbackSaleUser }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="下一步计划">
|
|
|
+ {{ v.feedbackSaleNext }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="更新时间">
|
|
|
+ {{ parseTime(v.feedbackSaleTime, '{y}-{m}-{d}') }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ :current-page="queryForm.pageNum"
|
|
|
+ :layout="layout"
|
|
|
+ :page-size="queryForm.pageSize"
|
|
|
+ :total="total"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ @size-change="handleSizeChange" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import workApi from '@/api/work/index'
|
|
|
+ import to from 'await-to-js'
|
|
|
+ export default {
|
|
|
+ name: 'WorkRecords',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ LS: {
|
|
|
+ width: '15%',
|
|
|
+ },
|
|
|
+ CS: {
|
|
|
+ width: '35%',
|
|
|
+ },
|
|
|
+ tryType: {
|
|
|
+ 10: '试用启动反馈',
|
|
|
+ 20: '试用过程反馈',
|
|
|
+ 30: '试用总结反馈',
|
|
|
+ },
|
|
|
+ height: this.$baseTableHeight(0),
|
|
|
+ layout: 'total, sizes, prev, pager, next, jumper',
|
|
|
+ total: 0,
|
|
|
+ dynamicsList: [],
|
|
|
+ queryForm: {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ },
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.fetchData()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ changeLength(index, length) {
|
|
|
+ this.$set(this.dynamicsList[index], 'showLength', length)
|
|
|
+ },
|
|
|
+ async fetchData() {
|
|
|
+ const [err, res] = await to(workApi.getListFull(this.queryForm))
|
|
|
+ if (err) return
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.dynamicsList = res.data.list
|
|
|
+ this.total = res.data.total
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleSizeChange(val) {
|
|
|
+ this.queryForm.pageSize = val
|
|
|
+ this.fetchData()
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.queryForm.pageNum = val
|
|
|
+ this.fetchData()
|
|
|
+ },
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .records {
|
|
|
+ margin: 0;
|
|
|
+ padding: 10px 20px;
|
|
|
+ list-style: none;
|
|
|
+ height: 100%;
|
|
|
+ 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;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .action {
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tit {
|
|
|
+ font-weight: bold !important;
|
|
|
+ color: #000;
|
|
|
+ padding: 10px 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|