Commit 241af2d5 authored by danfuman's avatar danfuman

修改

parent bff9a479
import request from '@/utils/request' import request from '@/utils/request'
// 客户概览-客户统计
export function statistics() {
return request({
url: '/customer/overview/statistics',
method: 'get',
})
}
// 客户概览-客户合作情况
export function cooperationTop() {
return request({
url: '/customer/overview/cooperation/top',
method: 'get',
})
}
// 客户概览-客户信资评级
export function creditLevel() {
return request({
url: '/customer/overview/credit/level',
method: 'get',
})
}
// 导入客户列表 // 导入客户列表
export function importData(param) { export function importData(param) {
return request({ return request({
......
import request from "@/utils/request"; import request from "@/utils/request";
// 企业中标排行榜
export function bidRank(data) {
return request({
url: '/index/bidRank',
method: 'post',
data: data
})
}
// 大项目最新中标 // 大项目最新中标
export function bigWinningBidsPage(data) { export function bigWinningBidsPage(data) {
return request({ return request({
......
...@@ -977,6 +977,11 @@ ...@@ -977,6 +977,11 @@
font-size: 12px; font-size: 12px;
} }
} }
.el-form {
.el-form-item--small.el-form-item {
margin-bottom: 0;
}
}
} }
.p10{ .p10{
padding: 0 10px; padding: 0 10px;
......
...@@ -127,7 +127,7 @@ export const constantRoutes = [ ...@@ -127,7 +127,7 @@ export const constantRoutes = [
path: '/enterprise/:id', path: '/enterprise/:id',
component: () => import('@/views/detail/party-a/index'), component: () => import('@/views/detail/party-a/index'),
name: 'PartyA', name: 'PartyA',
meta: { title: '企业详情', icon: 'enterprise', noCache: false }, meta: { title: '甲方详情', icon: 'enterprise', noCache: false },
} }
] ]
}, },
......
...@@ -61,7 +61,7 @@ export default { ...@@ -61,7 +61,7 @@ export default {
timeList: { timeList: {
type: Array, type: Array,
default: () => [], default: () => [],
} },
}, },
computed: { computed: {
isClear() { isClear() {
...@@ -319,6 +319,9 @@ export default { ...@@ -319,6 +319,9 @@ export default {
left: -400px; left: -400px;
} }
} }
.el-date-editor{
left: -400px;
}
} }
.picker-block { .picker-block {
......
...@@ -15,10 +15,44 @@ ...@@ -15,10 +15,44 @@
<div class="btn btn_primary btn_shallow h36 w88" @click="pldrs">批量导入</div> <div class="btn btn_primary btn_shallow h36 w88" @click="pldrs">批量导入</div>
</div> </div>
<div class="table_search"> <div class="table_search">
<div class="searchInput"> <div>
<el-input type="text" clearable v-model="searchParam.companyName" @change="clearname" placeholder="输入企业名称查询"></el-input> <el-form ref="queryForm" :model="searchParam" :inline="true" size="small">
<div class="btn" @click="handleCurrentChange(1)">搜索</div> <el-form-item prop="companyName">
<div class="searchInput">
<el-input type="text" clearable v-model="searchParam.companyName" @change="clearname" placeholder="输入企业名称查询"></el-input>
<div class="btn" @click="handleCurrentChange(1)">搜索</div>
</div>
</el-form-item>
<el-form-item>
<el-cascader
ref="address1"
:options="addressList"
:props="addressProps"
v-model="address"
@change="handleSearch"
placeholder="地区选择"
collapse-tags
style="width: 200px;"
clearable></el-cascader>
</el-form-item>
<el-form-item prop="companyNatures">
<el-select v-model="searchParam.companyNatures" style="width: 175px;" @change="handleSearch" filterable collapse-tags multiple class="form-content-width" placeholder="客户性质">
<el-option v-for="(item, index) in companyNaturelist" :key="index" :label="item.dictLabel" :value="item.dictValue" />
</el-select>
</el-form-item>
<el-form-item prop="isOn">
<el-select v-model="searchParam.isOn" filterable clearable style="width: 175px;" @change="handleSearch" class="form-content-width" placeholder="上市公司">
<el-option v-for="(item, index) in isMajorlist" :key="index" :label="item.dictLabel" :value="item.dictValue" />
</el-select>
</el-form-item>
<el-form-item prop="creditLevels">
<el-select v-model="searchParam.creditLevels" style="width: 175px;" @change="handleSearch" multiple filterable collapse-tags class="form-content-width" placeholder="资信评级">
<el-option v-for="(item, index) in creditLevellist" :key="index" :label="item.dictLabel" :value="item.dictValue" />
</el-select>
</el-form-item>
</el-form>
</div> </div>
<div class="dc"> <div class="dc">
<div class="total">{{tableData.total}}</div> <div class="total">{{tableData.total}}</div>
<div class="btn-export" @click="pldrs"><img src="@/assets/images/project/import.png">批量导入</div> <div class="btn-export" @click="pldrs"><img src="@/assets/images/project/import.png">批量导入</div>
...@@ -259,7 +293,6 @@ ...@@ -259,7 +293,6 @@
import batchimport from '../../project/projectList/component/batchImport' import batchimport from '../../project/projectList/component/batchImport'
import skeleton from '../../project/projectList/component/skeleton' import skeleton from '../../project/projectList/component/skeleton'
import { encodeStr } from '@/assets/js/common' import { encodeStr } from '@/assets/js/common'
export default { export default {
name: 'CustomList', name: 'CustomList',
components:{batchimport,skeleton}, components:{batchimport,skeleton},
...@@ -273,6 +306,7 @@ ...@@ -273,6 +306,7 @@
pageNum:1, pageNum:1,
pageSize:20 pageSize:20
}, },
address:'',
props:{ checkStrictly: true, expandTrigger: 'hover' }, props:{ checkStrictly: true, expandTrigger: 'hover' },
dialogVisible:false, dialogVisible:false,
textarea:"", textarea:"",
...@@ -281,7 +315,23 @@ ...@@ -281,7 +315,23 @@
tipsvalue:"",//标签填写内容 tipsvalue:"",//标签填写内容
tableData: [],//列表 tableData: [],//列表
companData:[],//联想企业列表 companData:[],//联想企业列表
addressProps: {
multiple: true,
expandTrigger: 'hover'
},
//上市公司
isMajorlist:[
{
dictValue: 0,
dictLabel:'否',
},
{
dictValue: 1,
dictLabel:'是',
}
],
companyNaturelist:[], //客户性质
creditLevellist:[], //资信评级
customerLevel:[],//客户等级 customerLevel:[],//客户等级
addressList:[],//地区 addressList:[],//地区
//添加客户 //添加客户
...@@ -316,12 +366,20 @@ ...@@ -316,12 +366,20 @@
} }
}, },
created() { created() {
this.$watch( if(this.$route.query.type === '1'){
() => this.$route.params, this.searchParam.companyNatures=['国有企业']
() => { }
if(this.$route.query.type === '2'){
this.searchParam.companyNatures=['央企']
}
if(this.$route.query.type ==='3'){
this.searchParam.companyNatures=['事业单位','机关单位']
}
this.$watch(() => this.$route.params,() => {
this.getCustomerList() this.getCustomerList()
this.getDictType() this.getDictType()
this.prvinceTree() this.prvinceTree()
this.handleQuery()
this.searchParam.companyName='' this.searchParam.companyName=''
}, },
// 组件创建完后获取数据, // 组件创建完后获取数据,
...@@ -330,6 +388,22 @@ ...@@ -330,6 +388,22 @@
) )
}, },
methods:{ methods:{
async handleQuery() {
let [type1,type2] = await Promise.all([
getDictType('company_nature_type'),
getDictType('credit_level_type'),
])
if(type1.code==200){
type1.data.forEach(item => {
this.companyNaturelist.push({dictLabel:item.dictLabel,dictValue:item.dictLabel})
})
}
if(type2.code==200){
type2.data.forEach(item => {
this.creditLevellist.push({dictLabel:item.dictLabel,dictValue:item.dictLabel})
})
}
},
sq1(item,sq){ sq1(item,sq){
this.$nextTick(()=>{ this.$nextTick(()=>{
item.sq1 = sq item.sq1 = sq
...@@ -367,7 +441,42 @@ ...@@ -367,7 +441,42 @@
}, },
//获取客户列表 //获取客户列表
getCustomerList(){ getCustomerList(){
getCustomerList(this.searchParam).then(result=>{ let params=this.searchParam
if(this.address.length > 0){
let arr = this.$refs.address1.getCheckedNodes();
let provinceCode = [],cityCode = [],countyCode = [];
for (var i in arr) {
if (arr[i].parent) {
if (!arr[i].parent.checked) {
arr[i].hasChildren && cityCode.push(arr[i].value);
!arr[i].hasChildren && countyCode.push(arr[i].value);
}
} else {
provinceCode.push(arr[i].value)
}
}
if(provinceCode.length > 0){
params.provinceIds=provinceCode
}
if(cityCode.length > 0){
params.cityIds=cityCode
}
if(countyCode.length > 0){
params.areaIds=countyCode
}
}else {
if(params.provinceIds){
delete params.provinceIds
}
if(params.cityIds){
delete params.cityIds
}
if(params.areaIds){
delete params.areaIds
}
}
getCustomerList(params).then(result=>{
this.isSkeleton = false this.isSkeleton = false
this.tableData = result this.tableData = result
this.tableData.rows.forEach(item=>{ this.tableData.rows.forEach(item=>{
...@@ -398,6 +507,12 @@ ...@@ -398,6 +507,12 @@
// } // }
this.$router.push({path:'/enterprise/'+encodeStr(companyId),query:{customerId:customerId,path:path}}) this.$router.push({path:'/enterprise/'+encodeStr(companyId),query:{customerId:customerId,path:path}})
}, },
handleSearch(){
this.$nextTick(() => {
this.searchParam.pageNum = 1
this.getCustomerList()
})
},
clearname(value){ clearname(value){
if(value == ""){ if(value == ""){
this.handleCurrentChange(1) this.handleCurrentChange(1)
...@@ -650,6 +765,27 @@ ...@@ -650,6 +765,27 @@
margin-top: 16px; margin-top: 16px;
} }
} }
.table_search{
::v-deep .el-cascader{
height: 32px;
line-height: 32px;
.el-input{
input{
height: 32px !important;
}
}
.el-cascader__tags{
flex-wrap: inherit;
margin-top: 1px;
.el-tag{
max-width: 120px;
}
}
.el-input__suffix{
top: 1px;
}
}
}
} }
.ps1{ .ps1{
display: flex; display: flex;
...@@ -696,8 +832,9 @@ ...@@ -696,8 +832,9 @@
height: auto; height: auto;
} }
.searchInput{ .searchInput{
width: 240px;
.el-input{ .el-input{
width: 260px; /*width: 260px;*/
} }
} }
</style> </style>
<template> <template>
<div> <div class="app-container overview">
<div class="miantitle"> <el-row>
<span>客户管理</span> <el-col :span="18">
<span> / 客户概览</span> <div class="topions">
</div> <div class="head_title">客户概览</div>
<div class="app-container"> <div class="item">
<div class="topions"> <div class="icons">
<div class="icons"> <router-link to="/custom/customList" tag="a">
<div class="name">客户总数</div> <div class="name">总客户数</div>
<div class="count">120</div> <div class="count">{{statistics.totalCount || '--'}}<span>{{statistics.totalCount ? '个':''}}</span></div>
<img class="icon_img" src="@/assets/images/project/icon_1.png"> <img class="icon_img" src="@/assets/images/project/icon_1.png">
</div> </router-link>
<div class="icons"> </div>
<div class="name">已合作客户</div> <div class="icons">
<div class="count">56</div> <router-link to="/custom/customList?type=1" tag="a">
<img class="icon_img" src="@/assets/images/project/icon_2.png"> <div class="name">国企客户</div>
</div> <div class="count">{{statistics.nationCount || '--'}}<span>{{statistics.nationCount ? '个':''}}</span></div>
<div class="icons"> <img class="icon_img" src="@/assets/images/project/icon_2.png">
<div class="name">局级大客户</div> </router-link>
<div class="count">50</div> </div>
<img class="icon_img" src="@/assets/images/project/icon_3.png"> <div class="icons">
</div> <router-link to="/custom/customList?type=2" tag="a">
<div class="icons"> <div class="name">央企客户</div>
<div class="name">今日跟进客户</div> <div class="count">{{statistics.centreCount || '--'}}<span>{{statistics.centreCount ? '个':''}}</span></div>
<div class="count">30</div> <img class="icon_img" src="@/assets/images/project/icon_3.png">
<img class="icon_img" src="@/assets/images/project/icon_4.png"> </router-link>
</div>
<div class="icons">
<router-link to="/custom/customList?type=3" tag="a">
<div class="name">事业单位</div>
<div class="count">{{statistics.undertakingCount || '--'}}<span>{{statistics.undertakingCount ? '个':''}}</span></div>
<img class="icon_img" src="@/assets/images/project/icon_4.png">
</router-link>
</div>
</div>
</div> </div>
<div class="icons"> </el-col>
<div class="name">储备项目数</div> <el-col :span="6">
<div class="count">33</div> <div class="search">
<img class="icon_img" src="@/assets/images/project/icon_5.png"> <div class="head_title">快速查找</div>
<el-input placeholder="输入企业名称查询">
<i slot="prefix" class="el-icon-search"></i>
<el-button slot="append">搜索</el-button>
</el-input>
<div class="search_btn"><i class="el-icon-plus"></i>新建项目</div>
</div> </div>
</div> </el-col>
<div class="flex"> </el-row>
<el-card class="box-card noborder left" style="position: relative;padding-bottom: 0"> <div class="content content_wap1">
<div class="cardtitles">客户级别</div> <div class="head_title">业主单位合作情况</div>
<div class="chartsum"> <el-row>
<div class="sum">23家</div> <el-col :span="14">
<div>11%</div> <div id="hzqk-echarts" style="height: 300px;"></div>
<div>有息债务/总负债</div> </el-col>
</div> <el-col :span="10">
<div class="flex"> <div class="box-right">
<div id="khjb" class="chart1"></div>
<div class="tables">
<el-table <el-table
:data="tableData" :data="hzqkList"
stripe border border
style="width: 100%" max-height="250"
:default-sort = "{prop: 'date', order: 'descending'}" fit
highlight-current-row
> >
<el-table-column <el-table-column prop="companyName" label="业主单位">
prop="name" <template slot-scope="scope">
label="名称"> <router-link :to="scope.row.uipId?`/enterprise/${encodeStr(scope.row.companyId)}`:`/company/${encodeStr(scope.row.companyId)}`" tag="a" v-if="scope.row.companyId&&scope.row.companyName" v-html="scope.row.companyName"></router-link>
</el-table-column> <div v-else v-html="scope.row.companyName || '--'"></div>
<el-table-column </template>
prop="sum"
label="数量(家)" align="right">
</el-table-column>
<el-table-column
prop="point"
label="占比" align="right">
</el-table-column> </el-table-column>
<el-table-column prop="businessCount" label="合作次数" width="100"/>
<el-table-column prop="totalAmount" label="合同总额(万元)" width="150"/>
</el-table> </el-table>
</div> </div>
</el-col>
</el-row>
</div>
<div class="content content_wap2">
<div class="head_title">客户资信评级</div>
<el-row>
<el-col :span="14">
<div id="zxpj-echarts" style="height: 250px;"></div>
</el-col>
<el-col :span="10">
<div class="box-right">
<el-table
:data="creditLevel"
border
max-height="250"
fit
highlight-current-row
>
<el-table-column prop="creditLevel" label="评级等级"/>
<el-table-column prop="customerCount" label="客户数量"/>
</el-table>
</div> </div>
</el-col>
</el-card> </el-row>
</div>
<el-card class="box-card noborder right" style="padding-bottom: 0"> <div class="content_wap3">
<div class="cardtitles">客户跟进动态 <div class="flex-box query-box">
<div class="labels"> <div class="flex-box query-params">
<div :class="{'on':datatype==1}" @click="getDT(1)">周</div> <span class="title">跟进动态</span>
<div :class="{'on':datatype==2}" @click="getDT(2)">月</div> </div>
<div :class="{'on':datatype==3}" @click="getDT(3)">年</div> <div class="flex-box time-label">
<div class="labels">
<div v-for="(item,index) in timeList" :class="{'on':datatype===index}" @click="handleClick(item,index)">
<template v-if="item === '自定义'">
<div style="position: relative">
自定义
<el-date-picker
ref="picker"
:default-value="defaultValue"
style="position: absolute;opacity: 0;left: -12px;width: 60px;"
v-model="pickerValue"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
@change="changePicker">
</el-date-picker>
</div>
</template>
<template v-else>{{item}}</template>
</div> </div>
</div> </div>
<div id="khgjdt" class="chart2"></div> <div class="picker-block" ref="picker-block"></div>
</el-card> </div>
</div>
<div class="flex">
<el-card class="box-card noborder left">
<div class="cardtitles">客户性质分析</div>
<div class="chart2" id="khxz"></div>
</el-card>
<el-card class="box-card noborder right">
<div class="cardtitles">客户资信评级</div>
<div class="chart2" id="khzxpj"></div>
</el-card>
</div> </div>
<div class="trendslist">
<el-card class="box-card noborder"> <div class="trends" v-for="item in recordlist">
<div class="cardtitles">客户动态</div> <div class="names">{{item.content}}</div>
<div class="trendslist"> <div class="list-content">
<div class="trends" v-for="item in datalist"> <p class="list-content-text">
<div class="names">{{item.name}}</div> <span>关联企业:</span>
<div class="trendtips"><div class="tips tip3">{{item.tip1}}</div><div class="tips tip2">{{item.tip2}}</div></div> <span>
<div class="trendcon">{{item.text}}</div> <router-link :to="{path:`/enterprise/${encodeStr(item.companyId)}`,query:{customerId:item.customerId,path:'business'}}" tag="a">{{item.companyName || '--'}}</router-link>
<div class="time">{{item.time}}</div> </span>
</p>
<p class="list-content-text">
<span>跟进人:</span>
<span>{{item.nickName || '--'}}</span>
</p>
<p class="list-content-text">
<span>拜访对象:</span>
<span>{{item.name || '--'}}</span>
</p>
<p class="list-content-text">
<span>本次拜访时间:</span>
<span>{{item.visitTime || '--'}}</span>
</p>
<p class="list-content-text">
<span>下次拜访时间:</span>
<span>{{item.nextVisitTime || '--'}}</span>
</p>
</div> </div>
<div class="tables" style="width: 100%" v-if="datalist.length>10"> </div>
<div class="bottems"> <div class="tables" style="width: 100%" v-if="recordlist.length>10">
<el-pagination <div class="bottems">
background <el-pagination
:page-size="10" background
:current-page="1" :page-size="10"
@current-change="handleCurrentChange" :current-page="1"
layout="prev, pager, next" @current-change="handleCurrentChange"
:total="datalist.length"> layout="prev, pager, next"
</el-pagination> :total="recordlist.length">
</div> </el-pagination>
</div> </div>
</div> </div>
</el-card> <div class="empty" v-if="recordlist.length === 0">
<img class="img" src="@/assets/images/project/empty.png">
<div class="p1">抱歉,没找到相关数据</div>
<div class="p2">建议调整筛选条件,重新搜索</div>
</div>
</div>
</div> </div>
</div> </div>
</template> </template>
...@@ -120,57 +181,47 @@ ...@@ -120,57 +181,47 @@
<script> <script>
import '@/assets/styles/project.scss' import '@/assets/styles/project.scss'
import * as echarts from 'echarts' import * as echarts from 'echarts'
import {encodeStr} from "@/assets/js/common"
import { statistics, cooperationTop, creditLevel,getFollowList } from '@/api/custom/custom'
export default { export default {
name: 'Overview', name: 'Overview',
data() { data() {
return { return {
//客户级别 encodeStr,
activeName:'first',
statistics:{},
hzqkList:[],
creditLevel:[],
chartDom: '', chartDom: '',
myChart: '', myChart: '',
option: '', option: '',
//客户跟进
chartDom1: '', chartDom1: '',
myChart1: '', myChart1: '',
option1: '', option1: '',
//客户性质 pageNum:1,
chartDom2: '', pageSize:10,
myChart2: '', recordlist:[],
option2: '', timeList:['今日','近三天','近七天','自定义'],
// 客户资信 datatype:'',
chartDom3: '', defaultValue:new Date(),
myChart3: '', pickerValue: [],
option3: '', params:{
//表格数据 startTime:'',
tableData:[ endTime:''
{name:'集团总部',sum:'23',point:'11%'}, }
{name:'一级单位',sum:'61',point:'29%'},
{name:'二级单位',sum:'60',point:'29%'},
{name:'三级单位',sum:'21',point:'10%'},
{name:'其他单位',sum:'44',point:'21%'},
],
datatype:'1',//切换类型
datalist:[
{name:'重庆市江北区国有资本投资运营管理集团有限公司',time:'2023-05-30',text:'新增招标公告:【江北房地产综合开发公司名下不动产鲤鱼池片区资产评估项目】 公开选取【资产评估】机构的公告',tip1:'正向',tip2:'招标公告'},
{name:'上海城投(集团)有限公司',time:'2023-05-29',text:'新增招标公告:北横通道新建工程——机电、装饰工程Ⅱ标段',tip1:'正向',tip2:'招标公告'},
{name:'上海申迪(集团)有限公司',time:'2023-5-27',text:'新增招标公告:上海国际旅游度假区核心区3.1平方公里绿地公园配套停车场项目',tip1:'正向',tip2:'招标公告'},
{name:'上海浦东建设股份有限公司',time:'2023-5-25',text:'新增招标公告:张村地块基础设施建设及上汽地块配套道路桥梁项目道路照明工程二标段',tip1:'正向',tip2:'招标公告'},
{name:'上海浦东建设股份有限公司',time:'2023-5-24',text:'新增供应商:江苏安神交通工程有限公司',tip1:'提示',tip2:'新增供应商'},
],
} }
}, },
created() { created() {
this.getData()
this.getFollowList()
}, },
mounted(){ mounted(){
this.$nextTick(()=>{ this.$nextTick(()=>{
this.chartDom = document.getElementById("khjb") this.chartDom = document.getElementById("hzqk-echarts")
this.myChart = echarts.init(this.chartDom) this.myChart = echarts.init(this.chartDom)
this.chartDom2 = document.getElementById("khxz") this.chartDom1 = document.getElementById("zxpj-echarts")
this.myChart2 = echarts.init(this.chartDom2) this.myChart1 = echarts.init(this.chartDom1)
this.chartDom3 = document.getElementById("khzxpj")
this.myChart3 = echarts.init(this.chartDom3)
this.initChart()
this.getDT(1)
}) })
window.addEventListener("resize", this.resizeEcharts); window.addEventListener("resize", this.resizeEcharts);
}, },
...@@ -181,48 +232,140 @@ ...@@ -181,48 +232,140 @@
this.resizeEcharts() this.resizeEcharts()
}, },
methods: { methods: {
getData(){
statistics().then(res=>{
console.log(res.data)
this.statistics=res.data;
})
cooperationTop().then(res=>{
// console.log(res.data)
this.hzqkList=res.data;
let list=[];
for(let i=0; i<res.data.length; i++){
if(res.data[i].totalAmount){
list.push(res.data[i])
}
}
this.initChart(list)
})
creditLevel().then(res=>{
for(let i=0; i<res.data.length; i++){
if(res.data[i].creditLevel){
this.creditLevel.push(res.data[i])
}
}
this.initChart1(this.creditLevel)
})
},
getFollowList(){
let param = {
pageNum:this.pageNum,//页码
pageSize:this.pageSize,
}
if(this.params.startTime){
param.startTime=this.params.startTime
}
if(this.params.endTime){
param.endTime=this.params.endTime
}
getFollowList(param).then(result=>{
// this.isSkeleton = false
this.recordlist = result.rows
this.recordlist.forEach(item=>{
item.createTime = this.gettime(item.createTime)
item.visitTime = this.gettime(item.visitTime)
item.nextVisitTime = this.gettime(item.nextVisitTime)
})
})
},
resizeEcharts (){ resizeEcharts (){
const self = this const self = this
setTimeout(function(){ //图表跟随页面大小变化宽度 setTimeout(function(){ //图表跟随页面大小变化宽度
self.myChart.resize() self.myChart.resize()
self.myChart1.resize() self.myChart1.resize()
self.myChart2.resize()
self.myChart3.resize()
}, 10) }, 10)
}, },
initChart(){ initChart(data){
//客户级别 //业主单位合作情况
this.option = { this.option = {
tooltip: { legend: {
trigger: 'item', show: false,
extraCssText: 'border:0', x:'center',
y:'bottom',
padding:[10,0,10,0],
itemWidth: 24,
itemHeight: 10,
textStyle:{
borderRadius:30,
}
}, },
color:['#8A82F3','#5B9CF7','#8DCF96','#FFDC6B','#FE9C77'],//修改配色 yAxis: {
series: [ type: 'category',
{ inverse: true, // 反向坐标
name: '', data: data.map(item => item.companyName),
type: 'pie', axisLine: {
radius: ['50%','70%'], show: false,
data: [ },
{ value: 23, name: '集团总部:11%',borderWidth:0 }, axisTick: {
{ value: 61, name: '一级单位:29%',borderWidth:0 }, show: false,
{ value: 60, name: '二级单位:29%',borderWidth:0 }, },
{ value: 21, name: '三级单位:10%',borderWidth:0 }, axisPointer: {
{ value: 44, name: '其他单位: 21%',borderWidth:0 } label: {
], show: true,
emphasis: { margin: 30
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0)'
}
} }
} },
] axisLabel: {
margin: 200,
textStyle: {
align: 'left',
},
},
},
xAxis: {
type: 'value',
axisLabel: { //坐标轴刻度标签的相关设置
color:"#666666"
},
name: '单位/万元',
// nameLocation: 'start',
nameLocation: 'end',
nameTextStyle: {
padding: [0, 0, 0, 0], // 四个数字分别为上右下左与原位置距离
color: '#666666',
},
},
grid: {
left: '22%',
top: 60,
right: 80,
bottom: 60,
},
tooltip: {
show: true,
backgroundColor: 'rgba(0,0,0,.7)',
borderWidth: 0,
textStyle: {
color: '#fff',
},
},
series: {
name:'合同总额',
data: data.map(item => item.totalAmount),
barGap: 0,
type: 'bar',
itemStyle:{
color: '#92C9FF',
barBorderRadius:[0, 20, 20, 0]
},
barWidth: 8,
},
} }
this.option && this.myChart.setOption(this.option) this.option && this.myChart.setOption(this.option)
//客户性质分析 },
this.option2 = { initChart1(data){
//客户资信评级
this.option1 = {
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
...@@ -231,6 +374,7 @@ ...@@ -231,6 +374,7 @@
}, },
grid: { grid: {
left: '3%', left: '3%',
top:30,
right: '4%', right: '4%',
bottom: '3%', bottom: '3%',
containLabel: true containLabel: true
...@@ -238,7 +382,7 @@ ...@@ -238,7 +382,7 @@
xAxis: [ xAxis: [
{ {
type: 'category', type: 'category',
data: ['地方单位', '事业单位', '政府机关', '中央企业', '上市公司', '军队', '民营企业','其他'], data: data.map(item => item.creditLevel),
axisTick: { axisTick: {
alignWithLabel: true, alignWithLabel: true,
show: false show: false
...@@ -260,7 +404,12 @@ ...@@ -260,7 +404,12 @@
name: '', name: '',
type: 'bar', type: 'bar',
barWidth: '18px', barWidth: '18px',
data: [100, 152, 200, 334, 390, 330, 220,256,178], data: data.map(item => item.customerCount),
tooltip: {
valueFormatter: function (value) {
return '客户数量 '+value
}
},
itemStyle:{ itemStyle:{
normal: { normal: {
barBorderRadius: [9, 9, 0, 0], barBorderRadius: [9, 9, 0, 0],
...@@ -277,313 +426,397 @@ ...@@ -277,313 +426,397 @@
}, },
} }
} }
this.option2 && this.myChart2.setOption(this.option2) this.option1 && this.myChart1.setOption(this.option1)
//客户资质分析 },
this.option3 = { handleCurrentChange(val) {
tooltip: { this.pageNum=1;
trigger: 'axis', this.getFollowList()
axisPointer: { },
type: 'shadow' // 时间格式化
} formatDate(timeStr) {
}, let date = new Date(Number(timeStr))
grid: { let year = date.getFullYear()
left: '3%', let month = String(date.getMonth() + 1).padStart(2, 0)
right: '4%', let day = String(date.getDate()).padStart(2, 0)
bottom: '3%', return `${year}-${month}-${day}`
containLabel: true },
}, handleClick(value,key){
xAxis: [ if(key === this.datatype && value != '自定义'){
{ this.datatype='';
type: 'category', this.pageNum=1
data: ['AA', 'AA+', 'AA-', 'A', 'A+', 'A', 'A-','其他'], this.params.startTime=''
axisTick: { this.params.endTime=''
alignWithLabel: true, this.getFollowList()
show: false return
}
this.datatype=key;
if(value == '自定义') {
this.$refs.picker && this.$refs.picker.length && this.$refs.picker[0].focus()
this.$nextTick(() => {
// this.$refs['picker-block'].appendChild(this.$refs.picker[0].popperElm)
})
}else {
this.pickerValue = []
let timeStr = []
let startTime = ''
let endTime = new Date()
switch (value) {
case '今日':
startTime = new Date(endTime.getTime() - 3600 * 1000 * 24 * 3)
timeStr = [this.formatDate(startTime), this.formatDate(endTime)]
break;
case '近三天':
startTime = new Date(endTime.getTime() - 3600 * 1000 * 24 * 3)
timeStr = [this.formatDate(startTime), this.formatDate(endTime)]
break;
case '近七天':
startTime = new Date(endTime.getTime() - 3600 * 1000 * 24 * 3)
timeStr = [this.formatDate(startTime), this.formatDate(endTime)]
break;
default:
if(this.pickerValue && this.pickerValue.length) {
timeStr = this.pickerValue
}else {
timeStr = []
} }
break;
}
this.params.startTime=timeStr[0]
this.params.endTime=timeStr[1]
this.pageNum=1
this.getFollowList()
}
},
gettime(time){
if(time == null || time == "")
return null
let times = new Date(time)
let year = times.getFullYear()
let month = times.getMonth()+1
month = month<10?"0"+month:month
let day = times.getDate()
day = day<10?"0"+day:day
return year+'-'+month+'-'+day
},
// 时间选择改变后的回调
changePicker(value) {
if(value && value.length) {
this.pageNum=1
this.params.startTime=this.pickerValue[0]
this.params.endTime=this.pickerValue[1]
this.getFollowList()
}
},
}
}
</script>
<style lang="scss" scoped>
.overview{
::v-deep .el-row{
.el-col:nth-child(1){
padding-left: 0 !important;
padding-right: 0 !important;
}
.el-col:nth-child(2){
padding-left: 16px !important;
padding-right: 0 !important;
}
}
.head_title{
font-weight: 700;
color: #232323;
font-size: 16px;
line-height: 24px;
margin-bottom: 12px;
}
.topions{
padding: 16px;
background: #ffffff;
height: 152px;
margin-bottom: 22px;
.item{
display: flex;
.icons{
width: calc(24%);
margin-right: 16px;
height: 84px;
background-size: 100% 100%;
position: relative;
padding: 16px;
border-radius: 4px;
cursor: pointer;
&:last-child{
margin-right: 0;
background: linear-gradient(135deg, #F6F7FF 0%, #EDEDFF 100%);
} }
], &:nth-child(1){
yAxis: [ background: linear-gradient(135deg, #F2F9FE 0%, #E7F4FE 100%);
{ }
type: 'value', &:nth-child(2){
splitLine : { //网格线 background: linear-gradient(135deg, #F2FEF1 0%, #E7FEEE 100%);
lineStyle: { }
type: 'dashed' //设置网格线类型 dotted:虚线 solid:实线 &:nth-child(3){
}, background: linear-gradient(135deg, #FEFAF2 0%, #FEF8E7 100%);
}
&:hover{
.count{
color: #0081FF;
span{
color: #0081FF;
}
} }
} }
], .name{
series: [ font-size: 14px;
{ color: rgba(35,35,35,0.8);
name: '', line-height: 20px;
type: 'bar', }
barWidth: '18px', .count{
data: [110, 112, 190, 234, 310, 350, 220,276,198], font-size: 22px;
itemStyle:{ font-weight: 700;
normal:{ color: #3D3D3D;
barBorderRadius:[9,9,0,0], line-height: 32px;
color:'#14C9C9' span{
}, font-weight: 400;
color: rgba(35,35,35,0.4);
font-size: 12px;
margin-left: 2px;
} }
} }
], .icon_img{
width: 32px;
height: 32px;
position: absolute;
right: 18px;
bottom: 26px;
}
}
}
}
.search{
padding: 16px;
background: #ffffff;
height: 152px;
emphasis: { ::v-deep .el-input{
itemStyle: { .el-input__inner{
// 高亮时点的颜色。 border-right: 0;
color: 'rgb(134,231,231)' }
}, .el-icon-search{
font-size: 16px;
line-height: 36px;
color:#0081FF;
margin-left: 6px;
margin-right: 4px;
}
.el-input-group__append{
background: #F5F5F5;
color: #0081FF;
} }
} }
this.option3 && this.myChart3.setOption(this.option3)
}, .search_btn{
initDT(datas,labels){ width: 100%;
this.chartDom1 = document.getElementById("khgjdt") height: 36px;
this.myChart1 = echarts.init(this.chartDom1) background: #0081FF;
//客户跟进动态 border-radius: 4px;
this.option1 = { line-height: 34px;
xAxis: { text-align: center;
type: 'category', color:#FFFFFF;
data: labels, font-size: 14px;
axisTick: { margin-top: 12px;
show: false i{
}, margin-right: 12px;
boundaryGap: false, }
nameLocation:'end', }
nameTextStyle: { }
fontSize:12, .content{
padding: [0, 0, 0, -30] background: #ffffff;
}, padding: 22px 16px;
}, margin-bottom: 12px;
yAxis: { }
type: 'value', .box-right{
splitLine : { //网格线 width: 90%;
lineStyle: { float: right;
type: 'dashed' //设置网格线类型 dotted:虚线 solid:实线 ::v-deep .el-table{
}, .sort-caret.ascending{
border-bottom-color: rgba(0,129,255,0.5);
}
.ascending .sort-caret.ascending{
border-bottom-color: #0081FF;
}
.sort-caret.descending{
border-top-color: rgba(0,129,255,0.5);
}
.descending .sort-caret.descending{
border-top-color: #0081FF;
}
.el-table__header-wrapper{
background: #F0F3FA;
th{
background: #F0F3FA;
/*text-align: left;*/
} }
}, }
grid:{ .el-table__footer-wrapper{
left:'8%', background: #F0F3FA;
top:'8%', }
right:'5%', th {
bottom:'42px', font-size: 13px !important;
}, font-weight: 400 !important;
tooltip:{ }
axisPointer:{ //悬浮于圆点展示标签 .cell {
type:'axis' padding-right: 12px !important;
}, padding-left: 12px !important;
extraCssText: 'border:0', line-height: 18px;
// trigger: 'axis' }
}, .el-table__fixed-header-wrapper{
series: [ th{
{ background: #F0F3FA;
name: '总跟进',
data: datas,
type: 'line',
smooth: true,
itemStyle: {
normal:{
color:'#0081FF'
}
},
label:{
normal:{
show:false
}
},
areaStyle: {
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0, color: 'rgba(0, 129, 255, 0.5)'
}, {
offset: 1, color: 'rgba(0, 129, 255, 0)'
} ],
global: false
}
},
symbolSize:8,
} }
] }
} td.el-table__cell{
this.option1 && this.myChart1.setOption(this.option1) border-bottom: 0;
}, }
getDT(type){ tr{
this.datatype = type &.current-row>td{
let time = new Date() background-color: initial;
let week = ['周一','周二','周三','周四','周五','周六','周日'] }
let weekdata = [200,150,300,240,400,380,460] &:nth-child(2n) {
let monthdata = [400,200,350,170,190,280,260,308,406,387,458,695,125,360,512,546,298,365,458,536,345,200,150,300,240,400,380,460,472,365,547] background: #F8FBFF;
let yeardata = [1908,1500,2300,1456,2354,2564,1254,1236,4561,4521,1236,4561,3521]
let datas = []
let labels = []
switch (type) {
case 1:
time = time.getDay()== 0?7:time.getDay()
// week.length = time
weekdata.length = time
for(var i=0;i<7;i++){
if(i > time){
weekdata.push('')
}
} }
labels = week }
datas = weekdata .el-table__cell{
break; height: 40px;
case 2: padding: 0;
let days = new Date(time.getFullYear(),time.getMonth()+1,0).getDate()//获取到本月天数 line-height: 40px;
time = time.getDate() }
monthdata.length = time .el-table__body tr:hover > td.el-table__cell{
for(var i=1;i<days;i++){ background: #DCEBFF;
labels.push(i+'日') }
if(i > time){ ::-webkit-scrollbar-track-piece {
monthdata.push("") //滚动条凹槽的颜色,还可以设置边框属性
background-color: #F3F4F5;
height: 16px;
padding: 0 4px;
}
//滚动条的宽度
::-webkit-scrollbar {
width: 8px;
height: 8px;
background-color: #F3F4F5;
border-radius: 6px;
}
//滚动条的滑块
::-webkit-scrollbar-thumb {
border-radius: 8px;
height: 8px;
margin: 0 4px;
background: rgba(98,110,126,0.2);
border: 4px solid rgba(98,110,126,0.2);;
&:hover{
background: #566380;
}
}
.has-gutter{
tr{
th:nth-last-child(2){
border-right:0;
}
td:nth-last-child(2){
border-right:0;
} }
} }
datas = monthdata }
break; .el-table__cell.gutter{
case 3: background: #F0F3FA;
time = time.getMonth()+1 }
yeardata.length = time .el-table__row{
for(var i=1;i<12;i++){ td:last-child{
labels.push(i+'月') .cell{
if(i>time){ padding-right: 12px !important;
yeardata.push('')
} }
} }
datas = yeardata }
break;
default:
break;
} }
this.initDT(datas,labels)
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
},
}
}
</script>
<style lang="scss" scoped>
.box-card{
margin: 12px 0 0;
padding-bottom: 24px;
&.left{
width: calc(62% - 16px);
margin-right: 14px;
}
&.right{
width: 40%;
} }
}
.topions{ .content_wap3{
width: 100%; background: #ffffff;
display: flex; .query-box{
.icons{ padding:16px;
width: calc(20%);
margin-right: 16px;
height: 96px;
background: url("../../../assets/images/project/beijing.png") top center no-repeat;
background-size: 100% 100%;
position: relative;
padding: 24px;
&:last-child{
margin-right: 0;
}
.name{
font-size: 14px;
color: #3D3D3D;
line-height: 14px;
} }
.count{ .title{
font-size: 26px;
font-weight: 700; font-weight: 700;
color: #0081FF; color: #232323;
padding-top: 14px; font-size: 16px;
line-height: 26px; line-height: 24px;
} }
.icon_img{ .time-label{
width: 70px; .labels{
position: absolute; width: 240px;
right: 0; height: 30px;
bottom: 0; line-height: 30px;
border-radius: 4px;
>div{
height: 100%;
padding: 0 12px;
text-align: center;
float: left;
opacity: 1;
border: 1px solid #EFEFEF;
margin-left: -1px;
font-weight: 400;
font-size: 12px;
color: rgba(35, 35, 35, 0.80);
cursor: pointer;
&.on{
background: #0081FF;
color: #FFFFFF;
border-color: #0081FF;
}
&:first-child{
border-radius: 4px 0px 0px 4px;
}
&:last-child{
border-radius: 0px 4px 4px 0px;
}
}
}
}
::v-deep .picker-block {
position: relative;
&::after {
content:"";
display:block;
visibility:hidden;
clear:both;
}
.el-picker-panel.el-date-range-picker.el-popper {
left: -650px !important;
}
.popper__arrow {
left: 30px !important;
}
} }
} }
} }
.chart1{
width: 428px;
height: 240px;
}
.tables{ .tables{
width: calc(100% - 428px); width: calc(100% - 428px);
} }
.chartsum{
position: absolute;
color: #3D3D3D;
text-align: center;
top: 155px;
left: 168px;
>div{
font-size: 10px;
line-height: 18px;
padding: 0 2px;
&.sum{
font-size: 18px;
padding-bottom: 4px;
}
}
}
.chart2{
width: 100%;
height: 265px;
}
.cardtitles{
position: relative;
.labels{
width: 120px;
height: 22px;
position: absolute;
border-radius: 2px;
right: 24px;
top: 24px;
>div{
width: 40px;
height: 100%;
text-align: center;
line-height: 22px;
float: left;
opacity: 1;
border: 1px solid #EFEFEF;
margin-left: -1px;
font-weight: 400;
font-size: 12px;
color: rgba(35, 35, 35, 0.80);
cursor: pointer;
&.on{
background: #0081FF;
color: #FFFFFF;
border-color: #0081FF;
}
&:first-child{
border-radius: 2px 0px 0px 2px;
}
&:last-child{
border-radius: 0px 2px 2px 0px;
}
}
}
}
.trendslist{ .trendslist{
border-top: 1px solid #EFEFEF; border-top: 1px solid #EFEFEF;
.trends{ .trends{
position: relative; position: relative;
padding: 16px 16px 0; padding: 16px;
border-bottom: 1px solid #EFEFEF;
&:hover{ &:hover{
background: #F6F9FC; background: #F6F9FC;
} }
...@@ -598,31 +831,58 @@ ...@@ -598,31 +831,58 @@
font-weight: 700; font-weight: 700;
color: #3D3D3D; color: #3D3D3D;
line-height: 23px; line-height: 23px;
margin-bottom: 12px;
} }
.trendtips{ .list-content {
padding: 8px 0 12px; display: flex;
} justify-content: start;
.trendcon{ align-items: center;
border-bottom: 1px solid #EFEFEF; .list-content-text {
font-size: 14px; display: flex;
font-family: MicrosoftYaHei-Regular, MicrosoftYaHei; justify-content: start;
font-weight: 400; align-items: center;
color: rgba(35,35,35,0.8); margin-right: 32px;
line-height: 18px; font-size: 14px;
padding-bottom: 16px;
} span:first-child {
font-weight: 400;
color: rgba(35, 35, 35, 0.4);
line-height: 15px
}
span:last-child {
font-weight: 400;
color: rgba(35, 35, 35, 0.8);
line-height: 15px
}
.blue {
color: #0081FF !important;
cursor: pointer;
}
&:last-child{
.trendcon{
border: none;
} }
} }
.time{ }
position: absolute; .empty{
right: 16px; margin: 0 auto;
top: 26px; height: 400px;
text-align: center;
border-top: 1px solid #EFEFEF;
padding-bottom: 50px;
.img{
width: 108px;
height: 108px;
margin-bottom: 24px;
margin-top: 50px;
}
.p1{
color: #333333;
font-size: 16px;
}
.p2{
color: #999999;
font-size: 14px; font-size: 14px;
opacity: 0.4; margin-top: 8px;
} }
} }
} }
......
...@@ -6,28 +6,40 @@ ...@@ -6,28 +6,40 @@
<el-col :span="16"> <el-col :span="16">
<div class="task-wrap"> <div class="task-wrap">
<div class="item"> <div class="item">
<img class="icon-img" src="@/assets/images/index/icon1.png"/> <router-link to="/project/overview" tag="a">
<p class="text">项目管理</p> <img class="icon-img" src="@/assets/images/index/icon1.png"/>
<p class="text">项目管理</p>
</router-link>
</div> </div>
<div class="item"> <div class="item">
<img class="icon-img" src="@/assets/images/index/icon2.png"/> <router-link to="/custom/overview" tag="a">
<p class="text">客户管理</p> <img class="icon-img" src="@/assets/images/index/icon2.png"/>
<p class="text">客户管理</p>
</router-link>
</div> </div>
<div class="item"> <div class="item">
<img class="icon-img" src="@/assets/images/index/icon3.png"/> <router-link to="/macro/nationalEconomies" tag="a">
<p class="text">宏观经济</p> <img class="icon-img" src="@/assets/images/index/icon3.png"/>
<p class="text">宏观经济</p>
</router-link>
</div> </div>
<div class="item"> <div class="item">
<img class="icon-img" src="@/assets/images/index/icon4.png"/> <router-link to="/enterpriseData?type=2" tag="a">
<p class="text">集团户</p> <img class="icon-img" src="@/assets/images/index/icon4.png"/>
<p class="text">集团户</p>
</router-link>
</div> </div>
<div class="item"> <div class="item">
<img class="icon-img" src="@/assets/images/index/icon5.png"/> <router-link to="/enterpriseData" tag="a">
<p class="text">查城投平台</p> <img class="icon-img" src="@/assets/images/index/icon5.png"/>
<p class="text">查城投平台</p>
</router-link>
</div> </div>
<div class="item"> <div class="item">
<img class="icon-img" src="@/assets/images/index/icon6.png"/> <router-link to="/radar" tag="a">
<p class="text">商机雷达</p> <img class="icon-img" src="@/assets/images/index/icon6.png"/>
<p class="text">商机雷达</p>
</router-link>
</div> </div>
</div> </div>
</el-col> </el-col>
...@@ -59,12 +71,13 @@ ...@@ -59,12 +71,13 @@
</el-form-item> </el-form-item>
<el-form-item prop="type"> <el-form-item prop="type">
<el-select v-model="queryParams.type" multiple collapse-tags clearable placeholder="项目类型" :class="queryParams.type.length > 1 ? 'selectTag' : ''" style="width: 170px;"> <el-select v-model="queryParams.type" multiple collapse-tags clearable placeholder="项目类型" :class="queryParams.type.length > 1 ? 'selectTag' : ''" style="width: 170px;">
<el-option v-for="(item,index) in typeList" :key="index" :label="item" :value="item"></el-option> <el-option v-for="(item,index) in projectType" :key="index" :label="item" :value="item"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item prop="time"> <el-form-item prop="time">
<custom-time-select <custom-time-select
:timeList="timeList" :timeList="timeList"
v-model="queryParams.time"
placeholder="中标日期" placeholder="中标日期"
@handle-search="changeSelect"/> @handle-search="changeSelect"/>
</el-form-item> </el-form-item>
...@@ -98,28 +111,28 @@ ...@@ -98,28 +111,28 @@
</el-col> </el-col>
<el-col :span="10"> <el-col :span="10">
<div class="search"> <div class="search">
<el-form ref="queryForm" :model="queryParams" :inline="true" size="small"> <el-form ref="queryForm" :model="queryParams1" :inline="true" size="small">
<el-form-item prop="money"> <el-form-item prop="money">
<custom-money-select <custom-money-select
:moneyList="moneyList" :moneyList="moneyList"
v-model="queryParams.money" v-model="queryParams1.money"
placeholder="中标金额" placeholder="中标金额"
@handle-search="changeSelect" /> @handle-search="changeSelect" />
</el-form-item> </el-form-item>
<el-form-item prop="address"> <el-form-item prop="address">
<el-select v-model="queryParams.address" placeholder="项目地区" style="width: 150px;"> <el-select v-model="queryParams1.address" placeholder="项目地区" style="width: 150px;">
<el-option v-for="(item,index) in addressList" :key="index" :label="item.label" :value="item.value"></el-option> <el-option v-for="(item,index) in addressList" :key="index" :label="item.label" :value="item.value"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item prop="type"> <el-form-item prop="type">
<el-select v-model="queryParams.type" multiple collapse-tags clearable placeholder="项目类型" :class="queryParams.type.length > 1 ? 'selectTag' : ''" style="width: 170px;"> <el-select v-model="queryParams1.type" multiple collapse-tags clearable placeholder="项目类型" :class="queryParams1.type.length > 1 ? 'selectTag' : ''" style="width: 170px;">
<el-option v-for="(item,index) in typeList" :key="index" :label="item" :value="item"></el-option> <el-option v-for="(item,index) in projectType" :key="index" :label="item" :value="item"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item prop="time"> <el-form-item prop="time">
<custom-time-select <custom-time-select
:timeList="timeList" :timeList="timeList"
v-model="queryParams.time" v-model="queryParams1.time"
placeholder="中标日期" placeholder="中标日期"
@handle-search="changeSelect"/> @handle-search="changeSelect"/>
</el-form-item> </el-form-item>
...@@ -208,13 +221,13 @@ ...@@ -208,13 +221,13 @@
@handle-search="changeSelect3" /> @handle-search="changeSelect3" />
</el-form-item> </el-form-item>
<el-form-item prop="provinceId"> <el-form-item prop="provinceId">
<el-select v-model="queryParams2.provinceId" placeholder="项目地区" style="width: 150px;"> <el-select v-model="queryParams2.provinceId" @change="changeSelect3" placeholder="项目地区" style="width: 150px;">
<el-option v-for="(item,index) in addressList" :key="index" :label="item.label" :value="item.value"></el-option> <el-option v-for="(item,index) in addressList" :key="index" :label="item.label" :value="item.id"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item prop="projects"> <el-form-item prop="projects">
<el-select v-model="queryParams2.projects" multiple collapse-tags clearable placeholder="项目类型" :class="queryParams2.projects.length > 1 ? 'selectTag' : ''" style="width: 170px;"> <el-select v-model="queryParams2.projects" @change="changeSelect3" multiple collapse-tags clearable placeholder="项目类型" :class="queryParams2.projects.length > 1 ? 'selectTag' : ''" style="width: 170px;">
<el-option v-for="(item,index) in typeList" :key="index" :label="item" :value="item"></el-option> <el-option v-for="(item,index) in projectType" :key="index" :label="item" :value="item"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item prop="time"> <el-form-item prop="time">
...@@ -222,7 +235,7 @@ ...@@ -222,7 +235,7 @@
:timeList="timeList" :timeList="timeList"
v-model="queryParams2.time" v-model="queryParams2.time"
placeholder="中标日期" placeholder="中标日期"
@handle-search="changeSelect"/> @handle-search="changeSelect3"/>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
...@@ -431,7 +444,8 @@ ...@@ -431,7 +444,8 @@
import CustomTimeSelect from './component/CustomTimeSelect' import CustomTimeSelect from './component/CustomTimeSelect'
import CustomMoneySelect from './component/CustomMoneySelect' import CustomMoneySelect from './component/CustomMoneySelect'
import skeleton from './component/skeleton' import skeleton from './component/skeleton'
import { bigWinningBidsPage,bigBidPage } from '@/api/index' import { bidRank,bigWinningBidsPage,bigBidPage } from '@/api/index'
import api from '@/api/radar/radar.js';
export default { export default {
name: "Index", name: "Index",
components: { components: {
...@@ -659,18 +673,19 @@ export default { ...@@ -659,18 +673,19 @@ export default {
}, },
], ],
addressList:[], addressList:[],
typeList:['施工类项目','施工类项目1','施工类项目2','施工类项目3','施工类项目4'], projectType:[], //项目类型
queryParams:{ queryParams:{
address:'', address:'',
type:[], type:[],
money:'',
time:'', time:'',
money:'',
}, },
queryParams1:{ queryParams1:{
address:'', address:'',
type:[], type:[],
money:'', money:'',
time:'', time:'',
sort:1
}, },
queryParams2:{ queryParams2:{
provinceId:'', provinceId:'',
...@@ -692,7 +707,9 @@ export default { ...@@ -692,7 +707,9 @@ export default {
}; };
}, },
created() { created() {
this.searchDic()
this.dataRegion() this.dataRegion()
this.getWinningBidsRanking()
this.getBigWinningBidsPage() this.getBigWinningBidsPage()
if(this.user === 1){ if(this.user === 1){
this.$nextTick(()=>{ this.$nextTick(()=>{
...@@ -702,14 +719,47 @@ export default { ...@@ -702,14 +719,47 @@ export default {
} }
}, },
methods: { methods: {
//项目类型
searchDic(){
api.searchDic().then(res=>{
this.projectType = res.projectType;
}).catch(error=>{});
},
getWinningBidsRanking(){
let params=this.queryParams;
if(params.time){
params.startDate=params.time[0]
params.endDate=params.time[1]
}
delete params.time
delete params.amount
console.log(params)
bidRank(params).then(res=>{
console.log(res.rows)
// this.zxzbIsSkeleton=false;
// if(res.code == 200){
// this.projectList=res.rows;
// this.totalCount=res.total;
// }
})
},
getBigWinningBidsPage(){ getBigWinningBidsPage(){
let params=this.queryParams2; let params=this.queryParams2;
if(params.amount){ if(params.amount){
if(params.amount.length > 1){
params.amountEnd=params.amount[1]
}else {
params.amountStart=params.amount[0]
}
} }
if(params.time){
params.timeStart=params.time[0]
params.timeEnd=params.time[1]
}
delete params.time
delete params.amount
this.zxzbIsSkeleton=true this.zxzbIsSkeleton=true
bigWinningBidsPage(this.queryParams2).then(res=>{ bigWinningBidsPage(params).then(res=>{
this.zxzbIsSkeleton=false; this.zxzbIsSkeleton=false;
if(res.code == 200){ if(res.code == 200){
this.projectList=res.rows; this.projectList=res.rows;
...@@ -718,9 +768,22 @@ export default { ...@@ -718,9 +768,22 @@ export default {
}) })
}, },
getBigBidPage(){ getBigBidPage(){
let params={}; let params=this.queryParams2;
if(params.amount){
if(params.amount.length > 1){
params.amountEnd=params.amount[1]
}else {
params.amountStart=params.amount[0]
}
}
if(params.time){
params.timeStart=params.time[0]
params.timeEnd=params.time[1]
}
delete params.time
delete params.amount
this.zhaobiaoIsSkeleton=true this.zhaobiaoIsSkeleton=true
bigBidPage(this.queryParams2).then(res=>{ bigBidPage(params).then(res=>{
this.zhaobiaoIsSkeleton=false this.zhaobiaoIsSkeleton=false
if(res.code == 200){ if(res.code == 200){
this.zbList=res.rows; this.zbList=res.rows;
...@@ -1059,12 +1122,11 @@ export default { ...@@ -1059,12 +1122,11 @@ export default {
} }
}, },
changeSelect(){ changeSelect(){
console.log("11111") console.log(this.queryParams)
this.getWinningBidsRanking()
// this.$emit('handle-search') // this.$emit('handle-search')
}, },
changeSelect3(){ changeSelect3(){
console.log(this.amount)
return
this.queryParams2.pageNum = 1 this.queryParams2.pageNum = 1
if(this.activeName === 'first'){ if(this.activeName === 'first'){
this.getBigWinningBidsPage() this.getBigWinningBidsPage()
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment