|
|
@@ -0,0 +1,827 @@
|
|
|
+<template>
|
|
|
+ <el-drawer append-to-body :visible.sync="dialogFormVisible" size="97%">
|
|
|
+ <div class="Mcontainer">
|
|
|
+ <div style="background:#ffffff;padding:10px" v-if="Object.keys(baseInfo).length">
|
|
|
+ <div class="Mcontainer-header">
|
|
|
+ <div class="Mcontainer-header__left">
|
|
|
+ <div style="width:60px;height: 60px;background:#F3F9FC;border-radius:10px;padding:10px">
|
|
|
+ <img src="@/assets/saler.svg" style="width:100%;height:100%" alt="">
|
|
|
+ </div>
|
|
|
+ <div class="account">
|
|
|
+ <p class="normal-title" style="font-size:18px">
|
|
|
+ <el-tooltip class="item" effect="dark" :content="baseInfo.projectname" placement="top">
|
|
|
+ <p>{{ baseInfo.name }}</p>
|
|
|
+ </el-tooltip>
|
|
|
+ </p>
|
|
|
+ <div class="Mtag">
|
|
|
+ <el-tag size="small" v-for="(item,index) in baseInfo.sys_tag" :key="index" style="margin-right:10px">{{ item }}</el-tag>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="Mcontainer-header__right">
|
|
|
+ <el-descriptions class="margin-top">
|
|
|
+ <el-descriptions-item label="编号">{{ baseInfo.hrcode }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="部门">{{ baseInfo.depname }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="手机号">{{ baseInfo.phonenumber }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="营销区域"> {{ baseInfo.areaname }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="登录账号">{{ baseInfo.accountno }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="职位">{{ baseInfo.position }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="邮箱"> {{ baseInfo.email }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="最低授权折扣"><span style="color:#E85B5B;font-size:16px;font-weight:bold">{{ baseInfo.discountrate * 100 + '%' }}</span></el-descriptions-item>
|
|
|
+ <el-descriptions-item label="状态"> {{ +baseInfo.status ? '离职' : '在职' }}</el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="data" style="padding: 0 10px;">
|
|
|
+ <!--业绩-->
|
|
|
+ <div class="Mproject" style="margin-top:10px">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div slot="header">
|
|
|
+ <span class="myTitle">业绩</span>
|
|
|
+ <myRadio :value1="param1.content" key1="type" @clickBtn="getPerformance" :btnOptions="[{label:'本年',value:3},{label:'本季',value:2},{label:'本月',value:1}]">
|
|
|
+ </myRadio>
|
|
|
+ </div>
|
|
|
+ <myCard
|
|
|
+ :list="
|
|
|
+ [
|
|
|
+ {custom:'dingdan',data:performance,title:'订单目标',value2descript:'差额',value:performance.orderCR,value2:unitCompile(performance.amount - performance.target_l),bg:'#F3F9FC',color:'#3874F6'},
|
|
|
+ {custom:'chuhuo',data:performance,title:'出货目标',value2descript:'差额',value:performance.outOrderCR,value2:unitCompile(performance.outamount - performance.target_l),bg:'#E8F7EC',color:'#00B32B'},
|
|
|
+ {custom:'kaipiao',data:performance,title:'开票目标',value2descript:'差额',value:performance.invCR,value2:unitCompile(performance.invoiceamount - performance.target_l),bg:'#F9F2E5',color:'#FF7603'},
|
|
|
+ {title:'回款金额',value:unitCompile(performance.writeoffamount || 0),bg:'#FDF3F3',color:'#E85B5B'},
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ <template v-slot:dingdan="scope">
|
|
|
+ <div>
|
|
|
+ <p style="font-size:14px">实际/目标</p>
|
|
|
+ <p :style="[{'font-size':'18px'},{color:scope.data.color},{'font-weight':'bold'}]">{{ unitCompile(scope.data.data.amount || 0) }}/{{ unitCompile(scope.data.data.target_l || 0) }}</p>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-slot:chuhuo="scope">
|
|
|
+ <div>
|
|
|
+ <p style="font-size:14px">实际/目标</p>
|
|
|
+ <p :style="[{'font-size':'18px'},{color:scope.data.color},{'font-weight':'bold'}]">{{ unitCompile(scope.data.data.outamount || 0) }}/{{ unitCompile(scope.data.data.target_l || 0) }}</p>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-slot:kaipiao="scope">
|
|
|
+ <div>
|
|
|
+ <p style="font-size:14px">实际/目标</p>
|
|
|
+ <p :style="[{'font-size':'18px'},{color:scope.data.color},{'font-weight':'bold'}]">{{ unitCompile(scope.data.data.invoiceamount || 0) }}/{{ unitCompile(scope.data.data.target_l || 0) }}</p>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </myCard>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!--订单-->
|
|
|
+ <div class="Mproject" style="margin-top:10px">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div slot="header">
|
|
|
+ <span class="myTitle">订单</span>
|
|
|
+ <myRadio :value1="param2.content" key1="isAll" @clickBtn="refreshTable('param2','dingdan')" :btnOptions="[{label:'全部',value:1},{label:'本年',value:0}]">
|
|
|
+ </myRadio>
|
|
|
+ <el-select style="margin-left:24px" v-model="param2.content.where.type" clearable size="mini" placeholder="请选择订单类型" @change="typeChange('param2','dingdan')">
|
|
|
+ <el-option label="全部" value=""></el-option>
|
|
|
+ <el-option :label="item.value" :value="item.value" v-for="(item,index) in orderTypeList" :key="index"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <myCard
|
|
|
+ :list="
|
|
|
+ [
|
|
|
+ {title:'订单数量',value:$refs.dingdan && $refs.dingdan.list && $refs.dingdan.list[0] && $refs.dingdan.list[0].allOrderQty,bg:'#F3F9FC',color:'#3874F6'},
|
|
|
+ {title:'订单总金额',value:unitCompile($refs.dingdan && $refs.dingdan.list && $refs.dingdan.list[0] && $refs.dingdan.list[0].allAmount || 0),bg:'#E8F7EC',color:'#78B32B'},
|
|
|
+ {title:'订单回款金额',value:unitCompile($refs.dingdan && $refs.dingdan.list && $refs.dingdan.list[0] && $refs.dingdan.list[0].cashbillAmount || 0),bg:'#F9F2E5',color:'#FF7603'},
|
|
|
+ {title:'订单未出货金额',value:unitCompile($refs.dingdan && $refs.dingdan.list && $refs.dingdan.list[0] && $refs.dingdan.list[0].allunAmount || 0),bg:'#FDF3F3',color:'#E85B5B'},
|
|
|
+ {title:'已出货未开票金额',value:unitCompile($refs.dingdan && $refs.dingdan.list && $refs.dingdan.list[0] && $refs.dingdan.list[0].alluninvoicamount || '0'),bg:'#F9F2E5',color:'#FF7603'},
|
|
|
+ {title:'已开票未回款金额',value:unitCompile($refs.dingdan && $refs.dingdan.list && $refs.dingdan.list[0] && $refs.dingdan.list[0].allunwriteoffamount || '0'),bg:'#FDF3F3',color:'#E85B5B'},
|
|
|
+ ]"
|
|
|
+ ></myCard>
|
|
|
+ <showIsNone title="订单明细">
|
|
|
+ <div style="float: right;margin-bottom: 10px;margin-top: -40px">
|
|
|
+ <el-button-group>
|
|
|
+ <el-button :type="param2.content.sort[0].sortid == '174'?'primary':''" size="mini" @click="sortChange('订单')">订单</el-button>
|
|
|
+ <el-button :type="param2.content.sort[0].sortid == '175'?'primary':''" size="mini" @click="sortChange('出货')">出货</el-button>
|
|
|
+ <el-button :type="param2.content.sort[0].sortid == '176'?'primary':''" size="mini" @click="sortChange('开票')">开票</el-button>
|
|
|
+ <el-button :type="param2.content.sort[0].sortid == '177'?'primary':''" size="mini" @click="sortChange('回款')">回款</el-button>
|
|
|
+ </el-button-group>
|
|
|
+ <img v-if="param2.content.sort[0].reversed == 0" @click="upSort('down')" width="28" height="28" src="../../../assets/icons/upSort.svg" alt="" style="vertical-align: middle;margin-left: 10px;">
|
|
|
+ <img v-if="param2.content.sort[0].reversed == 1" @click="upSort('up')" width="28" height="28" src="../../../assets/icons/downSort.svg" alt="" style="vertical-align: middle;margin-left: 10px;">
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <pageTable
|
|
|
+ ref="dingdan"
|
|
|
+ :tablecols="tool.tabelCol($route.name).orderTable.tablecols"
|
|
|
+ :param="param2"
|
|
|
+ :custom="true"
|
|
|
+ >
|
|
|
+ <template v-slot:custom="scope">
|
|
|
+ <div v-if="scope.data.columnname == 'sumamount'">
|
|
|
+ {{scope.data.data.sumamount && tool.formatAmount(scope.data.data.sumamount || 0,2,'￥') }}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.data.columnname == 'writeoffamount'">
|
|
|
+ <span :style="{color:param2.content.sort[0].sortid == '177'?'#3874F6':''}">{{scope.data.data.writeoffamount && tool.formatAmount(scope.data.data.writeoffamount || 0,2,'￥') }}</span>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.data.columnname == 'unoutOrderamount'">
|
|
|
+ <span :style="{color:param2.content.sort[0].sortid == '174'?'#3874F6':''}">{{scope.data.data.unoutOrderamount && tool.formatAmount(scope.data.data.unoutOrderamount || 0,2,'￥') }}</span>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.data.columnname == 'uninvoicamount'">
|
|
|
+ <span :style="{color:param2.content.sort[0].sortid == '175'?'#3874F6':''}">{{scope.data.data.uninvoicamount && tool.formatAmount(scope.data.data.uninvoicamount || 0,2,'￥') }}</span>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.data.columnname == 'unwriteoffamount'">
|
|
|
+ <span :style="{color:param2.content.sort[0].sortid == '176'?'#3874F6':''}">{{scope.data.data.unwriteoffamount && tool.formatAmount(scope.data.data.unwriteoffamount || 0,2,'￥') }}</span>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ {{ scope.data.data[scope.data.columnname] }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </pageTable>
|
|
|
+ </showIsNone>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!--销售线索-->
|
|
|
+ <div class="Mfollow">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div slot="header">
|
|
|
+ <span class="myTitle">销售线索</span>
|
|
|
+ <myRadio :value1="param3.content" key1="type" @clickBtn="refreshTable('param3','xiansuo');param8.content.type=param3.content.type;refreshTable('param8','fllow')" :btnOptions="[{label:'本年',value:3},{label:'本季',value:2},{label:'本月',value:1}]">
|
|
|
+ </myRadio>
|
|
|
+ </div>
|
|
|
+ <myCard
|
|
|
+ :list="
|
|
|
+ [
|
|
|
+ {title:'线索数',value:$refs.xiansuo && $refs.xiansuo.list[0] && $refs.xiansuo.list[0].orderclueSize,bg:'#F3F9FC',color:'#3874F6'},
|
|
|
+ {title:'新增线索数',value:$refs.xiansuo && $refs.xiansuo.list[0] && $refs.xiansuo.list[0].insertOrderclue,bg:'#E8F7EC',color:'#78B32B'},
|
|
|
+ {title:'线索转化率',value:$refs.xiansuo && $refs.xiansuo.list[0] && $refs.xiansuo.list[0].ordercluezhl,bg:'#F9F2E5',color:'#FF7603'},
|
|
|
+ {title:'跟进次数',value:$refs.fllow && $refs.fllow.list[0] && $refs.fllow.list[0].followSize,bg:'#F3F9FC',color:'#3874F6'},
|
|
|
+ // {title:'跟进频率',value:$refs.fllow && $refs.fllow.list[0] && $refs.fllow.list[0].followfrequency,descript:'平均跟进天数，跟进频率=（总跟进天数-节假日）÷总跟进次数',bg:'#FDF3F3',color:'#E85B5B'},
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ </myCard>
|
|
|
+ <showIsNone title="销售线索明细">
|
|
|
+ <pageTable
|
|
|
+ ref="xiansuo"
|
|
|
+ :tablecols="tool.tabelCol($route.name).orderclueList.tablecols"
|
|
|
+ :param="param3"
|
|
|
+ :custom="true"
|
|
|
+ >
|
|
|
+ <template v-slot:custom="scope">
|
|
|
+ <div v-if="scope.data.columnname == 'costofconstruction'">
|
|
|
+ {{scope.data.data.costofconstruction && tool.formatAmount(scope.data.data.costofconstruction || 0,2,'￥') }}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.data.columnname == 'totalinvestment'">
|
|
|
+ {{scope.data.data.totalinvestment && tool.formatAmount(scope.data.data.totalinvestment || 0,2,'￥') }}
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ {{ scope.data.data[scope.data.columnname] }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </pageTable>
|
|
|
+ </showIsNone>
|
|
|
+
|
|
|
+ <showIsNone title="线索跟进记录明细">
|
|
|
+ <pageTable
|
|
|
+ ref="fllow"
|
|
|
+ :tablecols="tool.tabelCol($route.name).clueFollow.tablecols"
|
|
|
+ :param="param8"
|
|
|
+ :custom="true"
|
|
|
+ >
|
|
|
+ <template v-slot:custom="scope">
|
|
|
+ <div style="text-wrap:wrap">
|
|
|
+ {{ scope.data.data[scope.data.columnname] }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </pageTable>
|
|
|
+ </showIsNone>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!--关联客户-->
|
|
|
+ <div class="Mfollow">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div slot="header">
|
|
|
+ <span class="myTitle">客户</span>
|
|
|
+ <myRadio :value1="param4.content" key1="type" @clickBtn="refreshTable('param4','kehu');param9.content.type=param4.content.type;refreshTable('param9','fllowkehu')" :btnOptions="[{label:'本年',value:3},{label:'本季',value:2},{label:'本月',value:1}]">
|
|
|
+ </myRadio>
|
|
|
+ </div>
|
|
|
+ <myCard
|
|
|
+ :list="
|
|
|
+ [
|
|
|
+ {title:'客户数',value:$refs.kehu && $refs.kehu.list.length,bg:'#F3F9FC',color:'#3874F6'},
|
|
|
+ {title:'新增客户数',value:$refs.kehu && $refs.kehu.list[0] && $refs.kehu.list[0].customersSize,bg:'#E8F7EC',color:'#78B32B'},
|
|
|
+ {title:'跟进次数',value:$refs.fllowkehu && $refs.fllowkehu.list && $refs.fllowkehu.list[0] && $refs.fllowkehu.list[0].followSize,bg:'#F9F2E5',color:'#FF7603'},
|
|
|
+ // {title:'跟进频率',value:$refs.fllowkehu && $refs.fllowkehu.list && $refs.fllowkehu.list[0] && $refs.fllowkehu.list[0].followfrequency,descript:'平均跟进天数，跟进频率=（总跟进天数-节假日）÷总跟进次数',bg:'#FDF3F3',color:'#E85B5B'},
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ </myCard>
|
|
|
+ <showIsNone title="客户明细">
|
|
|
+ <pageTable
|
|
|
+ ref="kehu"
|
|
|
+ :tablecols="tool.tabelCol($route.name).publicCustomerTable.tablecols"
|
|
|
+ :param="param4"
|
|
|
+ :custom="true"
|
|
|
+ >
|
|
|
+ <template v-slot:custom="scope">
|
|
|
+ <div v-if="scope.data.columnname == 'sys_tag'">
|
|
|
+ <el-tag size="mini" v-for="(item,index) in scope.data.data.sys_tag" :key="index">{{ item }}</el-tag>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.data.columnname == 'industry'">
|
|
|
+ <el-tag size="mini" v-for="(item,index) in scope.data.data.industry" :key="index">{{ item }}</el-tag>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ {{ scope.data.data[scope.data.columnname] }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </pageTable>
|
|
|
+ </showIsNone>
|
|
|
+
|
|
|
+ <showIsNone title="客户跟进记录明细">
|
|
|
+ <pageTable
|
|
|
+ ref="fllowkehu"
|
|
|
+ :tablecols="tool.tabelCol($route.name).customerFollow.tablecols"
|
|
|
+ :param="param9"
|
|
|
+ :custom="true"
|
|
|
+ >
|
|
|
+ <template v-slot:custom="scope">
|
|
|
+ <p v-if="scope.data.columnname === 'followname'">
|
|
|
+ <span v-if="scope.data.data.followname.length > 0">
|
|
|
+ <span v-for="(item,index) in scope.data.data.followname">
|
|
|
+ <span v-if="index === scope.data.data.followname.length -1">
|
|
|
+ {{item}}
|
|
|
+ </span>
|
|
|
+ <span v-else>
|
|
|
+ {{item + ','}}
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ <span v-else>--</span>
|
|
|
+ </p>
|
|
|
+ <div v-else style="text-wrap:wrap">
|
|
|
+ {{ scope.data.data[scope.data.columnname] || '--' }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </pageTable>
|
|
|
+ </showIsNone>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!--项目-->
|
|
|
+ <div class="Mproject" style="margin-top:10px">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div slot="header">
|
|
|
+ <span class="myTitle">项目</span>
|
|
|
+ <myRadio :value1="param5.content" key1="type" @clickBtn="refreshTable('param5','project');param10.content.type=param5.content.type;refreshTable('param10','projectfllow')" :btnOptions="[{label:'本年',value:3},{label:'本季',value:2},{label:'本月',value:1}]">
|
|
|
+ </myRadio>
|
|
|
+ </div>
|
|
|
+ <myCard
|
|
|
+ :list="
|
|
|
+ [
|
|
|
+ {title:'项目数',value:$refs.project && $refs.project.list && $refs.project.list[0] && $refs.project.list[0].projectSize,bg:'#F3F9FC',color:'#3874F6'},
|
|
|
+ {title:'新增项目数',value:$refs.project && $refs.project.list && $refs.project.list[0] && $refs.project.list[0].insertProject,bg:'#E8F7EC',color:'#78B32B'},
|
|
|
+ {title:'项目成交率',value:$refs.project && $refs.project.list && $refs.project.list[0] && $refs.project.list[0].projectcjl,bg:'#F9F2E5',color:'#FF7603'},
|
|
|
+ {title:'跟进次数',value:$refs.projectfllow && $refs.projectfllow.list && $refs.projectfllow.list[0] && $refs.projectfllow.list[0].followSize,bg:'#F3F9FC',color:'#3874F6'},
|
|
|
+ // {title:'跟进频率',value:$refs.projectfllow && $refs.projectfllow.list[0] && $refs.projectfllow.list[0].followfrequency,descript:'平均跟进天数，跟进频率=（总跟进天数-节假日）÷总跟进次数',bg:'#FDF3F3',color:'#E85B5B'},
|
|
|
+ ]"
|
|
|
+ ></myCard>
|
|
|
+
|
|
|
+ <showIsNone title="项目明细">
|
|
|
+ <pageTable
|
|
|
+ ref="project"
|
|
|
+ :tablecols="tool.tabelCol($route.name).competeProjectsTable.tablecols"
|
|
|
+ :param="param5"
|
|
|
+ :custom="true"
|
|
|
+ >
|
|
|
+ <template v-slot:custom="scope">
|
|
|
+ <div v-if="scope.data.columnname == 'stagecount'">
|
|
|
+ <el-tag size="small" v-for="(item,index) in scope.data.data.stagecount" :key="index">{{ item.stagename }}</el-tag>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.data.columnname == 'signamount_due'">
|
|
|
+ {{scope.data.data.signamount_due && tool.formatAmount(scope.data.data.signamount_due || 0,2,'￥') }}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.data.columnname == 'scale'">
|
|
|
+ {{scope.data.data.scalc ? scope.data.data.scale + scope.data.data.unitname : '' }}
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ {{ scope.data.data[scope.data.columnname] }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </pageTable>
|
|
|
+ </showIsNone>
|
|
|
+
|
|
|
+ <showIsNone title="项目跟进记录明细">
|
|
|
+ <pageTable
|
|
|
+ ref="projectfllow"
|
|
|
+ :tablecols="tool.tabelCol($route.name).projectFollow.tablecols"
|
|
|
+ :param="param10"
|
|
|
+ :custom="true"
|
|
|
+ >
|
|
|
+ <template v-slot:custom="scope">
|
|
|
+ <p v-if="scope.data.columnname === 'followname'">
|
|
|
+ <span v-if="scope.data.data.followname.length > 0">
|
|
|
+ <span v-for="(item,index) in scope.data.data.followname">
|
|
|
+ <span v-if="index === scope.data.data.followname.length -1">
|
|
|
+ {{item}}
|
|
|
+ </span>
|
|
|
+ <span v-else>
|
|
|
+ {{item + ','}}
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ <span v-else>--</span>
|
|
|
+ </p>
|
|
|
+ <div v-else style="text-wrap:wrap">
|
|
|
+ {{ scope.data.data[scope.data.columnname] || '--' }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </pageTable>
|
|
|
+ </showIsNone>
|
|
|
+
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!--报价单-->
|
|
|
+ <div class="Mproject" style="margin-top:10px">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div slot="header">
|
|
|
+ <span class="myTitle">报价单</span>
|
|
|
+ <myRadio :value1="param6.content" key1="isAll" @clickBtn="refreshTable('param6','baojiadan')" :btnOptions="[{label:'全部',value:1},{label:'本年',value:0}]">
|
|
|
+ </myRadio>
|
|
|
+ </div>
|
|
|
+ <myCard
|
|
|
+ :list="
|
|
|
+ [
|
|
|
+ {title:'报价次数',value:$refs.baojiadan && $refs.baojiadan.total,bg:'#F3F9FC',color:'#3874F6'},
|
|
|
+ {title:'最近报价金额',value:unitCompile($refs.baojiadan && $refs.baojiadan.list && $refs.baojiadan.list[0] && $refs.baojiadan.list[0].sumamount || '0'),bg:'#E8F7EC',color:'#78B32B'},
|
|
|
+ {title:'最近报价时间',value:$refs.baojiadan && $refs.baojiadan.list && $refs.baojiadan.list[0] && $refs.baojiadan.list[0].submitdate || '--',bg:'#F9F2E5',color:'#FF7603'},
|
|
|
+ ]"
|
|
|
+ ></myCard>
|
|
|
+ <showIsNone title="报价单明细">
|
|
|
+ <pageTable
|
|
|
+ ref="baojiadan"
|
|
|
+ :tablecols="tool.tabelCol($route.name).quotedPriceTable.tablecols"
|
|
|
+ :param="param6"
|
|
|
+ :custom="true"
|
|
|
+ >
|
|
|
+ <template v-slot:custom="scope">
|
|
|
+ <div v-if="scope.data.columnname == 'specialoffer'">
|
|
|
+ {{ scope.data.data.specialoffer ? '是' : '否' }}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.data.columnname == 'sumamount'">
|
|
|
+ {{scope.data.data.sumamount && tool.formatAmount(scope.data.data.sumamount || 0,2,'￥') }}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.data.columnname == 'begdate'">
|
|
|
+ {{scope.data.data.begdate }}-{{scope.data.data.enddate }}
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ {{ scope.data.data[scope.data.columnname] }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </pageTable>
|
|
|
+ </showIsNone>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <!--合同-->
|
|
|
+ <div class="Mproject" style="margin-top:10px">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div slot="header">
|
|
|
+ <span class="myTitle">合同</span>
|
|
|
+ <myRadio :value1="param7.content" key1="isAll" @clickBtn="refreshTable('param7','hetong')" :btnOptions="[{label:'全部',value:1},{label:'本年',value:0}]">
|
|
|
+ </myRadio>
|
|
|
+ <el-select style="margin-left:24px" v-model="param7.content.where.type" clearable size="mini" placeholder="请选择合同类型" @change="typeChange('param7','hetong')">
|
|
|
+ <el-option label="全部" value=""></el-option>
|
|
|
+ <el-option :label="item.remarks" :value="item.value" v-for="(item,index) in contractTypeList" :key="index"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <myCard
|
|
|
+ :list="
|
|
|
+ [
|
|
|
+ {title:'合同总数',value:$refs.hetong && $refs.hetong.list && $refs.hetong.list[0] && $refs.hetong.list[0].allQty,bg:'#F3F9FC',color:'#3874F6'},
|
|
|
+ {title:'合同金额',value:unitCompile($refs.hetong && $refs.hetong.list && $refs.hetong.list[0] && $refs.hetong.list[0].sumSignAmount || 0),bg:'#E8F7EC',color:'#78B32B'},
|
|
|
+ {title:'进行中合同数',value:$refs.hetong && $refs.hetong.list && $refs.hetong.list[0] && $refs.hetong.list[0].inProgressQty,bg:'#FDF3F3',color:'#E85B5B'},
|
|
|
+ {title:'进行中合同金额',value:unitCompile($refs.hetong && $refs.hetong.list && $refs.hetong.list[0] && $refs.hetong.list[0].inProgressAmount || 0),bg:'#F9F2E5',color:'#FF7603'},
|
|
|
+ {title:'到期合同数',value:$refs.hetong && $refs.hetong.list && $refs.hetong.list[0] && $refs.hetong.list[0].expireQty,bg:'#F3F9FC',color:'#3874F6'},
|
|
|
+ {title:'到期合同金额',value:unitCompile($refs.hetong && $refs.hetong.list && $refs.hetong.list[0] && $refs.hetong.list[0].expireAmount || 0),bg:'#F9F2E5',color:'#FF7603'},
|
|
|
+ {title:'转订单合同数',value:$refs.hetong && $refs.hetong.list && $refs.hetong.list[0] && $refs.hetong.list[0].convertOrderContractQty,bg:'#F3F9FC',color:'#3874F6'},
|
|
|
+ {title:'转订单金额',value:unitCompile($refs.hetong && $refs.hetong.list && $refs.hetong.list[0] && $refs.hetong.list[0].convertOrderContractAmount || 0),bg:'#E8F7EC',color:'#78B32B'},
|
|
|
+ ]"
|
|
|
+ ></myCard>
|
|
|
+ <showIsNone title="合同明细">
|
|
|
+ <pageTable
|
|
|
+ ref="hetong"
|
|
|
+ :tablecols="tool.tabelCol($route.name).contractTable.tablecols"
|
|
|
+ :param="param7"
|
|
|
+ :custom="true"
|
|
|
+ >
|
|
|
+ <template v-slot:custom="scope">
|
|
|
+ <div v-if="scope.data.columnname == 'signAmount'">
|
|
|
+ {{scope.data.data.signAmount && tool.formatAmount(scope.data.data.signAmount || 0,2,'￥') }}
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ {{ scope.data.data[scope.data.columnname] }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </pageTable>
|
|
|
+ </showIsNone>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </el-drawer>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import pageTable from '@/HDrpManagement/customerPortrait/modules/pageTable'
|
|
|
+import showIsNone from '@/HDrpManagement/customerPortrait/modules/showIsNone'
|
|
|
+import myCard from '@/HDrpManagement/customerPortrait/modules/myCrad'
|
|
|
+import myTag from '@/HDrpManagement/customerPortrait/modules/myTag'
|
|
|
+import myRadio from '@/HDrpManagement/customerPortrait/modules/myRadio'
|
|
|
+export default {
|
|
|
+ name: "index",
|
|
|
+ components:{showIsNone,pageTable,myCard,myTag,myRadio},
|
|
|
+ props:['data'],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ dialogFormVisible:false,
|
|
|
+ baseInfo:{},//基本信息
|
|
|
+ //业绩
|
|
|
+ param1: {
|
|
|
+ "id": 20230717100404,
|
|
|
+ "content": {
|
|
|
+ "type":3,
|
|
|
+ "hrid":this.$route.query.id
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //订单
|
|
|
+ param2: {
|
|
|
+ "id": 20230717100504,
|
|
|
+ "content": {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "isAll":1,
|
|
|
+ "hrid":this.$route.query.id,
|
|
|
+ "where": {
|
|
|
+ "type":''
|
|
|
+ },
|
|
|
+ "sort":[{
|
|
|
+ "reversed": 1,//1降序，0升序
|
|
|
+ "sorted": 1,
|
|
|
+ "sortid": 174,//订单：174,出货：175,开票：176,回款：177
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //销售线索
|
|
|
+ param3: {
|
|
|
+ "id": 20230717100604,
|
|
|
+ "content": {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "type":3,
|
|
|
+ "hrid":this.$route.query.id,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //线索跟进
|
|
|
+ param8: {
|
|
|
+ "id": 20230717100704,
|
|
|
+ "content": {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "type":3,
|
|
|
+ "hrid":this.$route.query.id,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //客户
|
|
|
+ param4: {
|
|
|
+ "id": 20230717100804,
|
|
|
+ "content": {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "type":3,
|
|
|
+ "hrid":this.$route.query.id,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //客户跟进
|
|
|
+ param9: {
|
|
|
+ "id": 20230717100904,
|
|
|
+ "content": {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "type":3,
|
|
|
+ "hrid":this.$route.query.id,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //项目
|
|
|
+ param5: {
|
|
|
+ "id": 20230717101004,
|
|
|
+ "content": {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "type":3,
|
|
|
+ "hrid":this.$route.query.id
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //项目跟进
|
|
|
+ param10: {
|
|
|
+ "id": 20230717101104,
|
|
|
+ "content": {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "type":3,
|
|
|
+ "hrid":this.$route.query.id
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //报价单
|
|
|
+ param6: {
|
|
|
+ "id": 20230717101204,
|
|
|
+ "content": {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "isAll":1,
|
|
|
+ "hrid":this.$route.query.id,
|
|
|
+ "where":{
|
|
|
+ "type":""
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //合同
|
|
|
+ param7: {
|
|
|
+ "id": 20230717101304,
|
|
|
+ "content": {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "isAll":1,
|
|
|
+ "hrid":this.$route.query.id,
|
|
|
+ "where":{
|
|
|
+ "type":""
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ performance:{},
|
|
|
+ contractTypeList:[],
|
|
|
+ orderTypeList:[],
|
|
|
+ stageList:[],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ async getbaseInfo () {
|
|
|
+ let res = await this.$api.requested({
|
|
|
+ "id": 20230717100304,
|
|
|
+ "content": {
|
|
|
+ "hrid":this.$route.query.id
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.baseInfo = res.data[0]
|
|
|
+ console.log(this.baseInfo,'基本信息');
|
|
|
+ },
|
|
|
+ async getPerformance () {
|
|
|
+ let res = await this.$api.requested(this.param1)
|
|
|
+ this.performance = res.data[0]
|
|
|
+ console.log(this.performance,'业绩');
|
|
|
+ },
|
|
|
+ async getSelectList () {
|
|
|
+ const res = await this.$store.dispatch('optiontypeselect','contracttype')
|
|
|
+ this.contractTypeList = res.data
|
|
|
+ console.log(this.contractTypeList,'合同类型');
|
|
|
+
|
|
|
+ const res2 = await this.$store.dispatch('optiontypeselect','ordertype')
|
|
|
+ this.orderTypeList = res2.data
|
|
|
+ console.log(this.orderTypeList,'订单类型');
|
|
|
+
|
|
|
+ /*获取阶段*/
|
|
|
+ const res3 = await this.$api.requested({
|
|
|
+ "id": 20221128143604,
|
|
|
+ "content": {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 9999,
|
|
|
+ "where": {
|
|
|
+ "condition": "",
|
|
|
+ "allprojecttype":"",
|
|
|
+ "projecttype":""
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.stageList = res3.data
|
|
|
+ },
|
|
|
+ refreshTable (param,el) {
|
|
|
+ this[param].content.pageNumber = 1
|
|
|
+ this.$refs[el] && this.$refs[el].listData()
|
|
|
+ },
|
|
|
+ typeChange(param,el) {
|
|
|
+ this[param].content.pageNumber = 1
|
|
|
+ this.$refs[el] && this.$refs[el].listData()
|
|
|
+ },
|
|
|
+ unitCompile (num) {
|
|
|
+ if (num == 0) {
|
|
|
+ return this.tool.formatAmount(num,0,'￥')
|
|
|
+ } else {
|
|
|
+ return this.tool.formatAmount(num / 10000,2,'￥') + '万'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /*订单明细排序*/
|
|
|
+ sortChange(val){
|
|
|
+ if (val === '订单'){
|
|
|
+ this.param2.content.sort[0].sortid = 174
|
|
|
+ }else if (val === '出货'){
|
|
|
+ this.param2.content.sort[0].sortid = 175
|
|
|
+ }else if (val === '开票'){
|
|
|
+ this.param2.content.sort[0].sortid = 176
|
|
|
+ }else if (val === '回款'){
|
|
|
+ this.param2.content.sort[0].sortid = 177
|
|
|
+ }
|
|
|
+ this.$refs.dingdan.listData()
|
|
|
+ },
|
|
|
+ upSort(val){
|
|
|
+ if (val === 'down'){
|
|
|
+ this.param2.content.sort[0].reversed = 1
|
|
|
+ }else {
|
|
|
+ this.param2.content.sort[0].reversed = 0
|
|
|
+ }
|
|
|
+ this.$refs.dingdan.listData()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getbaseInfo()
|
|
|
+ this.getPerformance()
|
|
|
+ this.getSelectList()
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+*{
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+.my-label {
|
|
|
+ background: rgba(235, 245, 253, 1);
|
|
|
+}
|
|
|
+.nowrap {
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ flex: 100;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/.el-drawer {
|
|
|
+ background:#F5F5F5 !important;
|
|
|
+}
|
|
|
+/deep/.el-drawer__header{
|
|
|
+ display: none !important;
|
|
|
+}
|
|
|
+
|
|
|
+/deep/.el-descriptions-item__cell {
|
|
|
+ padding: 8px 8px 0px 8px !important;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/deep/.el-card__header,/deep/.el-card__body {
|
|
|
+ padding: 10px !important;
|
|
|
+}
|
|
|
+.Mcontainer .Mcontainer-header {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.Mcontainer .Mcontainer-header .Mcontainer-header__left {
|
|
|
+ display: flex;
|
|
|
+ max-width: 350px;
|
|
|
+ min-width: 350px;
|
|
|
+ align-items: center;
|
|
|
+ padding-right: 20px;
|
|
|
+}
|
|
|
+.Mcontainer .Mcontainer-header .Mcontainer-header__right {
|
|
|
+ flex: 100;
|
|
|
+ border-left: 1px solid #cccccc;
|
|
|
+ padding-left: 20px;
|
|
|
+}
|
|
|
+.Mcontainer .Mcontainer-header .Mcontainer-header__left .account{
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-left: 10px;
|
|
|
+ overflow: hidden;
|
|
|
+ flex:100;
|
|
|
+}
|
|
|
+.Mcontainer .Mcontainer-header .Mcontainer-header__left .account .Mtag{
|
|
|
+ margin-top: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.Mcontainer .Mfollow{
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.Mcontainer .peopleInfo {
|
|
|
+ margin-top: 10px;
|
|
|
+ padding-bottom: 10px;
|
|
|
+}
|
|
|
+.peopleInfo-content {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ height: 300px;
|
|
|
+ overflow-y: scroll;
|
|
|
+}
|
|
|
+.peopleInfo-content::-webkit-scrollbar {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+.peopleInfo-content .leader {
|
|
|
+ margin-bottom: 10px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+.peopleInfo-content .leader .title {
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+.peopleInfo-content .leader .content {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+}
|
|
|
+.peopleInfo-content .leader .content .item {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin: 0 20px 10px 0;
|
|
|
+}
|
|
|
+.peopleInfo-content .leader .content .avatar {
|
|
|
+ width: 50px;
|
|
|
+ height: 50px;
|
|
|
+ border-radius: 50%;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 50px;
|
|
|
+ background: #3874F6;
|
|
|
+ margin-right:10px;
|
|
|
+ color: #ffffff;
|
|
|
+}
|
|
|
+.peopleInfo-content .leader .content .Info {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+.peopleInfo-content .leader .content .Info div {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #cccccc;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+.peopleInfo-content .people {
|
|
|
+ margin-bottom: 10px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+.peopleInfo-content .people .title {
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+.peopleInfo-content .people .content {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap:wrap;
|
|
|
+}
|
|
|
+.peopleInfo-content .people .content .item {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin: 0 20px 10px 0;
|
|
|
+}
|
|
|
+.peopleInfo-content .people .content .avatar {
|
|
|
+ width: 50px;
|
|
|
+ height: 50px;
|
|
|
+ border-radius: 50%;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 50px;
|
|
|
+ background: #3874F6;
|
|
|
+ margin-right: 10px;
|
|
|
+ color: #ffffff;
|
|
|
+}
|
|
|
+.peopleInfo-content .people .content .Info {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+.peopleInfo-content .people .content .Info div {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #cccccc;
|
|
|
+}
|
|
|
+
|
|
|
+.peopleInfo-content .people {}
|
|
|
+
|
|
|
+.descript {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #cccccc;
|
|
|
+ margin-right: 20px;
|
|
|
+ white-space:nowrap;
|
|
|
+}
|
|
|
+.title {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #000000;
|
|
|
+ margin-right: 10px;
|
|
|
+ white-space:nowrap;
|
|
|
+}
|
|
|
+.myTitle {
|
|
|
+ margin-right:24px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+</style>
|
qymljy