Skip to content

S
SuperMan
Commit c71dbf8a authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent 8e0cf39c
Hide whitespace changes
Inline Side-by-side
Showing with 621 additions and 447 deletions
src/components/SalesModule/demandInquiry.vue
View file @ c71dbf8a
<style> <style>
.page_demandInquiry ._mc_addbox{padding: 30px 0} .page_demandInquiry ._mc_addbox {
.page_demandInquiry ._mc_edit{overflow: auto;display: none;position:absolute;bottom:0;left: 0;border-top:1px solid #d1d1d1;background-color:#f9f9f9;padding: 15px 33px;width: 100%;min-width: 1146px;padding-right: 10px} padding: 30px 0
.page_demandInquiry .edHeight{display: block;height: 200px;} }
.page_demandInquiry ._mc_list{overflow-x: auto;}
.page_demandInquiry ._mc_list>ul>li{padding: 20px 20px 0 20px;width: 280px;height: 302px;float: left;border: 1px solid #F1F2F5;margin-right:10px;margin-bottom: 20px} .page_demandInquiry ._mc_edit {
.page_demandInquiry ._mc_list>ul>li:hover{box-shadow:0px 0px 20px rgba(191,191,191,1);transition: all linear 0.5s;} overflow: auto;
.page_demandInquiry ._bt span{color: #FF9000} display: none;
.page_demandInquiry ._edHeight{height:500px;} position: absolute;
.page_demandInquiry ._scrollbar::-webkit-scrollbar{width: 4px;height: 8px;} bottom: 0;
.page_demandInquiry ._scrollbar::-webkit-scrollbar-thumb{border-radius: 4px;-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);background: #c9c9c9;} left: 0;
.page_demandInquiry ._scrollbar::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);border-radius: 4px;background: #EDEDED;} border-top: 1px solid #d1d1d1;
.page_demandInquiry ._mc_list ._tit,._mc_edit ._tit{padding-left: 10px;border-left: 3px solid #E95252; margin-bottom: 25px; height: 14px; line-height: 14px; font-size: 14px;color: #000000;position: relative;} background-color: #f9f9f9;
.page_demandInquiry ._mc_edit ._info_box ul._form li{float: left;} padding: 15px 33px;
.page_demandInquiry ._check_list{padding-left: 120px;margin-bottom: 20px;} width: 100%;
.page_demandInquiry ._check_box .el-form-item{margin-bottom: 0} min-width: 1146px;
.page_demandInquiry ._remark textarea{resize: none;width: 646px;height: 100px} padding-right: 10px
.page_demandInquiry ._vr_left{width: 700px;margin-right: 20px; } }
.page_demandInquiry ._vr_left ul{margin-top: 20px; max-height: 630px; overflow-y: auto;}
.page_demandInquiry ._vr_left ul li{padding: 25px;color: #FFFFFF;font-size: 14px;text-align: center;float: left;border-top: 1px solid #F1F2F5;border-bottom: 1px solid #F1F2F5;background-color: #FFFFFF;margin-bottom: 20px;cursor: pointer;} .page_demandInquiry .edHeight {
.page_demandInquiry ._vr_left ul li:first-child{border-left: 1px solid #F1F2F5;} display: block;
.page_demandInquiry ._vr_left ul li:last-child{border-right: 1px solid #F1F2F5;} height: 200px;
.page_demandInquiry ._vr_left ul li:nth-child(4n+0){border-right: 1px solid #F1F2F5;} }
.page_demandInquiry ._vr_left ul li:nth-child(5),.page_demandInquiry ._vr_left ul li:nth-child(9){border-left: 1px solid #F1F2F5;}
.page_demandInquiry ._vr_left ul li>div{width:120px;height:120px;background:rgba(42,174,242,1);border-radius:46px;border: 6px solid rgba(85,190,245,1);} .page_demandInquiry ._mc_list {
.page_demandInquiry ._vr_left ul li>div p:nth-child(1){font-weight: bold;font-size: 18px;margin-top: 30px} overflow-x: auto;
.page_demandInquiry ._vr_left ul li>p{color: #333333;margin-top: 10px} }
.height-auto .el-input{height: auto !important}
.page_demandInquiry ._mc_list>ul>li {
padding: 20px 20px 0 20px;
width: 280px;
height: 302px;
float: left;
border: 1px solid #F1F2F5;
margin-right: 10px;
margin-bottom: 20px
}
.page_demandInquiry ._mc_list>ul>li:hover {
box-shadow: 0px 0px 20px rgba(191, 191, 191, 1);
transition: all linear 0.5s;
}
.page_demandInquiry ._bt span {
color: #FF9000
}
.page_demandInquiry ._edHeight {
height: 500px;
}
.page_demandInquiry ._scrollbar::-webkit-scrollbar {
width: 4px;
height: 8px;
}
.page_demandInquiry ._scrollbar::-webkit-scrollbar-thumb {
border-radius: 4px;
-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
background: #c9c9c9;
}
.page_demandInquiry ._scrollbar::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
border-radius: 4px;
background: #EDEDED;
}
.page_demandInquiry ._mc_list ._tit,
._mc_edit ._tit {
padding-left: 10px;
border-left: 3px solid #E95252;
margin-bottom: 25px;
height: 14px;
line-height: 14px;
font-size: 14px;
color: #000000;
position: relative;
}
.page_demandInquiry ._mc_edit ._info_box ul._form li {
float: left;
}
.page_demandInquiry ._check_list {
padding-left: 120px;
margin-bottom: 20px;
}
.page_demandInquiry ._check_box .el-form-item {
margin-bottom: 0
}
.page_demandInquiry ._remark textarea {
resize: none;
width: 646px;
height: 100px
}
.page_demandInquiry ._vr_left {
width: 700px;
margin-right: 20px;
}
.page_demandInquiry ._vr_left ul {
margin-top: 20px;
max-height: 630px;
overflow-y: auto;
}
.page_demandInquiry ._vr_left ul li {
padding: 25px;
color: #FFFFFF;
font-size: 14px;
text-align: center;
float: left;
border-top: 1px solid #F1F2F5;
border-bottom: 1px solid #F1F2F5;
background-color: #FFFFFF;
margin-bottom: 20px;
cursor: pointer;
}
.page_demandInquiry ._vr_left ul li:first-child {
border-left: 1px solid #F1F2F5;
}
.page_demandInquiry ._vr_left ul li:last-child {
border-right: 1px solid #F1F2F5;
}
.page_demandInquiry ._vr_left ul li:nth-child(4n+0) {
border-right: 1px solid #F1F2F5;
}
.page_demandInquiry ._vr_left ul li:nth-child(5),
.page_demandInquiry ._vr_left ul li:nth-child(9) {
border-left: 1px solid #F1F2F5;
}
.page_demandInquiry ._vr_left ul li>div {
width: 120px;
height: 120px;
background: rgba(42, 174, 242, 1);
border-radius: 46px;
border: 6px solid rgba(85, 190, 245, 1);
}
.page_demandInquiry ._vr_left ul li>div p:nth-child(1) {
font-weight: bold;
font-size: 18px;
margin-top: 30px
}
.page_demandInquiry ._vr_left ul li>p {
color: #333333;
margin-top: 10px
}
.height-auto .el-input {
height: auto !important
}
</style> </style>
<template> <template>
<div class="page_demandInquiry"> <div class="page_demandInquiry">
<div class="_mc_addbox"> <div class="_mc_addbox">
<button class="hollowFixedBtn" @click="addShow=true">{{$t('pub.addBtn')}}</button> <button class="hollowFixedBtn" @click="addShow=true">{{$t('pub.addBtn')}}</button>
</div> </div>
<div class="_mc_list _scrollbar" :class="addShow==true?'_edHeight':''"> <div class="_mc_list _scrollbar" :class="addShow==true?'_edHeight':''">
<div class="_vr_left fl"> <div class="_vr_left fl">
<p class="_tit">{{$t('salesModule.InquiryAndDemand')}}</p> <p class="_tit">{{$t('salesModule.InquiryAndDemand')}}</p>
<ul> <ul>
<li v-for="(item,index) in inquireLineStatistical" @click="goUrl('demandStatistics',item.lineId,item.lineName)"> <li v-for="(item,index) in inquireLineStatistical"
<div> @click="goUrl('demandStatistics',item.lineId,item.lineName)">
<p class="PingFangSC">{{item.inquireCount}}{{$t('pub.Ci')}}</p> <div>
<p>{{item.inqiurePercent}}%</p> <p class="PingFangSC">{{item.inquireCount}}{{$t('pub.Ci')}}</p>
</div> <p>{{item.inqiurePercent}}%</p>
<p>{{item.lineName}}</p>
</li>
</ul>
<div class="noData" v-show="inquireLineStatistical.length==0">
{{$t('system.content_noData')}}
</div>
</div>
<div class="_vr_right fl">
<p class="_tit">{{$t('salesModule.ZixunHotLine')}}</p>
<div class="charts" style="margin-top: 20px;">
<el-col :span='24'>
<div id="chartsMap" style="height:630px;width:850px;"></div>
</el-col>
</div>
</div> </div>
<p>{{item.lineName}}</p>
</li>
</ul>
<div class="noData" v-show="inquireLineStatistical.length==0">
{{$t('system.content_noData')}}
</div> </div>
<div class="_mc_edit _scrollbar" :class="addShow==true?'edHeight':''"> </div>
<p class="_tit">{{$t('salesModule.addCustomer')}} <div class="_vr_right fl">
<span class="fr"> <p class="_tit">{{$t('salesModule.ZixunHotLine')}}</p>
<button class="hollowFixedBtn" type="button" @click="cancelEdit(),resetForm('addMsg')">{{$t('pub.cancelBtn')}}</button> <div class="charts" style="margin-top: 20px;">
<button type="button" class="normalBtn" @click="submitForm('addMsg')">{{$t('pub.saveBtn')}}</button> <el-col :span='24'>
</span> <div id="chartsMap" style="height:630px;width:850px;"></div>
</p> </el-col>
<el-form class="_info_box clearfix" :model="addMsg" :rules="rules" ref="addMsg" label-width="120px">
<ul class="_form clearfix">
<li>
<el-form-item :label="$t('fnc.khleixing')" prop="linshig">
<div class="w210">
<el-radio v-model="addMsg.linshig" @change="addMsg.CustomerName = '', addMsg.CustomerInfoId = 0, AppCoustomer = []" label="1">{{$t('salesModule.InformalClient')}}</el-radio>
<el-radio v-model="addMsg.linshig" @change="addMsg.CustomerName = '', addMsg.CustomerInfoId = 0, AppCoustomer = []" label="2">{{$t('salesModule.LinshiCustomer')}}</el-radio>
</div>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('pub.Customer')" prop="CustomerInfoId" >
<el-select
:multiple="false"
filterable
remote
reserve-keyword
:placeholder="$t('pub.PleaseKeyWords')"
:remote-method="getAppCoustomer"
@change="getAppCoustomerName"
:loading="loading" v-model="addMsg.CustomerInfoId" v-if="addMsg.linshig == '1'" class="w210 height-auto">
<el-option
:placeholder="$t('pub.pleaseSel')"
v-for="item in AppCoustomer"
:key="item.customerId"
:label="`${item.customerName}(${item.contact})`"
:value="item.customerId">
</el-option>
</el-select>
<el-input v-else v-model="addMsg.CustomerName" :placeholder="$t('pub.pleaseImport')" class="w210"></el-input>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('salesModule.XunwenLine')" prop="LineId">
<el-select v-model="addMsg.LineId" class="w210" :placeholder="$t('pub.pleaseSel')" @change="getLineTeamList(addMsg.LineId)">
<el-option
:placeholder="$t('pub.pleaseSel')"
v-for="item in InquireLineList"
:key="item.LineID"
:label="item.LineName"
:value="item.LineID">
</el-option>
</el-select>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('advmanager.v_xilie')">
<el-select v-model="addMsg.LineteamId" class="w210" :placeholder="$t('pub.pleaseSel')">
<el-option :label="$t('system.ph_buxian')" value=''></el-option>
<el-option
:placeholder="$t('pub.pleaseSel')"
v-for="item in LineteamList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('Airticket.Air_StartTime')" prop="DepartTime">
<el-date-picker clearable class="w210"
v-model="addMsg.DepartTime"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
:placeholder="$t('admin.admin_choDate')">
</el-date-picker>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('salesModule.PriceExpect')" prop="BudgetPrice">
<el-input v-model="addMsg.BudgetPrice" :placeholder="$t('pub.pleaseImport')" class="w210"></el-input>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('salesModule.PeopleCount')" prop="PeopleNumber">
<el-input v-model="addMsg.PeopleNumber" :placeholder="$t('pub.pleaseImport')" class="w210"></el-input>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('pub.pubRemark')" >
<el-input v-model='addMsg.Remark' class="w210" type='textarea' maxlength='500'></el-input>
</el-form-item>
</li>
</ul>
</el-form>
</div> </div>
</div>
</div>
<div class="_mc_edit _scrollbar" :class="addShow==true?'edHeight':''">
<p class="_tit">{{$t('salesModule.addCustomer')}}
<span class="fr">
<button class="hollowFixedBtn" type="button"
@click="cancelEdit(),resetForm('addMsg')">{{$t('pub.cancelBtn')}}</button>
<button type="button" class="normalBtn" @click="submitForm('addMsg')">{{$t('pub.saveBtn')}}</button>
</span>
</p>
<el-form class="_info_box clearfix" :model="addMsg" :rules="rules" ref="addMsg" label-width="120px">
<ul class="_form clearfix">
<li>
<el-form-item :label="$t('fnc.khleixing')" prop="linshig">
<div class="w210">
<el-radio v-model="addMsg.linshig"
@change="addMsg.CustomerName = '', addMsg.CustomerInfoId = 0, AppCoustomer = []" label="1">
{{$t('salesModule.InformalClient')}}</el-radio>
<el-radio v-model="addMsg.linshig"
@change="addMsg.CustomerName = '', addMsg.CustomerInfoId = 0, AppCoustomer = []" label="2">
{{$t('salesModule.LinshiCustomer')}}</el-radio>
</div>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('pub.Customer')" prop="CustomerInfoId">
<el-select :multiple="false" filterable remote reserve-keyword :placeholder="$t('pub.PleaseKeyWords')"
:remote-method="getAppCoustomer" @change="getAppCoustomerName" :loading="loading"
v-model="addMsg.CustomerInfoId" v-if="addMsg.linshig == '1'" class="w210 height-auto">
<el-option :placeholder="$t('pub.pleaseSel')" v-for="item in AppCoustomer" :key="item.customerId"
:label="`${item.customerName}(${item.contact})`" :value="item.customerId">
</el-option>
</el-select>
<el-input v-else v-model="addMsg.CustomerName" :placeholder="$t('pub.pleaseImport')" class="w210">
</el-input>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('salesModule.XunwenLine')" prop="LineId">
<el-select v-model="addMsg.LineId" class="w210" :placeholder="$t('pub.pleaseSel')"
@change="getLineTeamList(addMsg.LineId)">
<el-option :placeholder="$t('pub.pleaseSel')" v-for="item in InquireLineList" :key="item.LineID"
:label="item.LineName" :value="item.LineID">
</el-option>
</el-select>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('advmanager.v_xilie')">
<el-select v-model="addMsg.LineteamId" class="w210" :placeholder="$t('pub.pleaseSel')">
<el-option :label="$t('system.ph_buxian')" value=''></el-option>
<el-option :placeholder="$t('pub.pleaseSel')" v-for="item in LineteamList" :key="item.id"
:label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('Airticket.Air_StartTime')" prop="DepartTime">
<el-date-picker clearable class="w210" v-model="addMsg.DepartTime" type="datetime"
value-format="yyyy-MM-dd HH:mm:ss" :placeholder="$t('admin.admin_choDate')">
</el-date-picker>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('salesModule.PriceExpect')" prop="BudgetPrice">
<el-input v-model="addMsg.BudgetPrice" :placeholder="$t('pub.pleaseImport')" class="w210"></el-input>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('salesModule.PeopleCount')" prop="PeopleNumber">
<el-input v-model="addMsg.PeopleNumber" :placeholder="$t('pub.pleaseImport')" class="w210"></el-input>
</el-form-item>
</li>
<li>
<el-form-item :label="$t('pub.pubRemark')">
<el-input v-model='addMsg.Remark' class="w210" type='textarea' maxlength='500'></el-input>
</el-form-item>
</li>
</ul>
</el-form>
</div> </div>
</div>
</template> </template>
<script> <script>
export default { export default {
data(){ data() {
return{ return {
addMsg:{ addMsg: {
CustomerInfoId:'', CustomerInfoId: '',
LineId:'', LineId: '',
DepartTime:'', DepartTime: '',
BudgetPrice:'', BudgetPrice: '',
PeopleNumber:'', PeopleNumber: '',
LineteamId:'', LineteamId: '',
Remark:'', Remark: '',
linshig: '1', linshig: '1',
CustomerName: '' CustomerName: ''
},
loading: false,
rules: {
CustomerInfoId: [{
required: true,
message: "请输选择客户",
trigger: "change"
}],
LineId: [{
required: true,
message: "请输选择线路",
trigger: "change"
}],
DepartTime: [{
required: true,
message: "请选择时间",
trigger: "blur"
}],
contactNumber: [{
required: true,
message: "请输入联系电话",
trigger: "blur"
}],
BudgetPrice: [{
required: true,
message: "请输入预计价格",
trigger: "blur"
}, },
loading: false, {
rules:{ pattern: this.$commonUtils.Regex.el_Isdecimal,
CustomerInfoId:[{required: true, message: "请输选择客户", trigger: "change"}], message: "请输入正确的价格"
LineId:[{required: true, message: "请输选择线路", trigger: "change"}], }
DepartTime:[{required: true, message: "请选择时间", trigger: "blur"}], ],
contactNumber:[ PeopleNumber: [{
{required: true, message: "请输入联系电话", trigger: "blur"} required: true,
], message: "请输入人数",
BudgetPrice:[{required: true, message: "请输入预计价格", trigger: "blur"}, trigger: "blur"
{ pattern: this.$commonUtils.Regex.el_Isdecimal, message: "请输入正确的价格" }],
PeopleNumber:[{required: true, message: "请输入人数", trigger: "blur"},
{ pattern: this.$commonUtils.Regex.el_isInteger, message: "请输入正确的人数" }],
}, },
addShow:false, {
noData:false, pattern: this.$commonUtils.Regex.el_isInteger,
dayS:0, message: "请输入正确的人数"
dayArr:[], }
inquireHotLine:[], ],
b2bClickHotLine:[],
inquireLineStatistical:[],
inquireHotLineStatistical:[],
b2bClickHotLineStatistical:[],
AppCoustomer:[],
InquireLineList:[],
LineteamList:[],
}
},methods:{
getAppCoustomerName(t){
this.AppCoustomer.forEach(x=>{
if (t == x.customerId){
this.addMsg.CustomerName = x.customerName
}
})
},
getInquireLineList(){ // 获取线路下拉
this.apipost('line_post_GetAllList',{},res=>{
if(res.data.resultCode==1){
this.InquireLineList = res.data.data;
}else{
this.$message.error(res.data.message)
}
},err=>{})
}, },
//获取系列列表 addShow: false,
getLineTeamList(lineId) { noData: false,
this.LineteamList = [] dayS: 0,
this.apipost("b2b_get_GetLineTeam", { dayArr: [],
lineId: lineId inquireHotLine: [],
}, res => { b2bClickHotLine: [],
if(res.data.resultCode == 1) { inquireLineStatistical: [],
this.addMsg.LineteamId = '' inquireHotLineStatistical: [],
this.LineteamList = res.data.data; b2bClickHotLineStatistical: [],
} AppCoustomer: [],
}); InquireLineList: [],
}, LineteamList: [],
getAppCoustomer(query){ // 获取客户列表 }
},
methods: {
getAppCoustomerName(t) {
this.AppCoustomer.forEach(x => {
if (t == x.customerId) {
this.addMsg.CustomerName = x.customerName
}
})
},
getInquireLineList() { // 获取线路下拉
this.apipost('line_post_GetAllList', {}, res => {
if (res.data.resultCode == 1) {
this.InquireLineList = res.data.data;
} else {
this.$message.error(res.data.message)
}
}, err => {})
},
//获取系列列表
getLineTeamList(lineId) {
this.LineteamList = []
this.apipost("b2b_get_GetLineTeam", {
lineId: lineId
}, res => {
if (res.data.resultCode == 1) {
this.addMsg.LineteamId = ''
this.LineteamList = res.data.data;
}
});
},
getAppCoustomer(query) { // 获取客户列表
if (query !== '') { if (query !== '') {
this.apipost('app_post_GetCustomerBrandByKeyWord',{customerInfo: query},res=>{ this.apipost('app_post_GetCustomerBrandByKeyWord', {
if(res.data.resultCode==1){ customerInfo: query
this.AppCoustomer = res.data.data; }, res => {
}else{ if (res.data.resultCode == 1) {
this.$message.error(res.data.message) this.AppCoustomer = res.data.data;
} } else {
},err=>{}) this.$message.error(res.data.message)
}else { }
}, err => {})
} else {
this.AppCoustomer = []; this.AppCoustomer = [];
} }
}, },
getInquireLineNeed(){ //获取线条条数据 getInquireLineNeed() { //获取线条条数据
this.apipost('app_my_inquire_line_need',{},res=>{ this.apipost('app_my_inquire_line_need', {}, res => {
if(res.data.resultCode==1){ if (res.data.resultCode == 1) {
this.inquireLineStatistical = res.data.data.inquireLineStatistical this.inquireLineStatistical = res.data.data.inquireLineStatistical
this.inquireHotLineStatistical = res.data.data.inquireHotLineStatistical this.inquireHotLineStatistical = res.data.data.inquireHotLineStatistical
this.b2bClickHotLineStatistical = res.data.data.b2bClickHotLineStatistical this.b2bClickHotLineStatistical = res.data.data.b2bClickHotLineStatistical
if(this.inquireHotLineStatistical.length>0){ if (this.inquireHotLineStatistical.length > 0) {
this.inquireHotLine=[] this.inquireHotLine = []
this.dayArr=[] this.dayArr = []
this.inquireHotLineStatistical.forEach(x => { this.inquireHotLineStatistical.forEach(x => {
this.dayArr.push(x.date.substring(5,x.date.length)) this.dayArr.push(x.date.substring(5, x.date.length))
this.inquireHotLine.push(x.inquireCount) this.inquireHotLine.push(x.inquireCount)
}); });
} }
if(this.b2bClickHotLineStatistical.length>0){ if (this.b2bClickHotLineStatistical.length > 0) {
this.b2bClickHotLine=[] this.b2bClickHotLine = []
this.b2bClickHotLineStatistical.forEach(x => { this.b2bClickHotLineStatistical.forEach(x => {
this.b2bClickHotLine.push(x.clickCount) this.b2bClickHotLine.push(x.clickCount)
}); });
} }
this.chartsMap(this.inquireHotLine,this.b2bClickHotLine); this.chartsMap(this.inquireHotLine, this.b2bClickHotLine);
}else{ } else {
this.$message.error(res.data.message) this.$message.error(res.data.message)
}
}, err => {})
},
chartsMap(see, clc) { // 画饼
var then = this;
if (then.inquireLineStatistical && then.inquireLineStatistical.length > 0) {
let myChart = this.$echarts.init(document.getElementById('chartsMap'));
myChart.setOption({
title: {
text: then.inquireLineStatistical[0].lineName,
left: 'left',
textStyle: {
fontWeight: 'bold',
fontSize: 14,
color: '#333333',
height: '30px'
},
padding: [
20, // 上
20, // 右
20, // 下
20, // 左
]
},
backgroundColor: '#fff',
legend: {
icon: 'rect',
selectedMode: false,
orient: 'vertical',
x: 'right',
data: ['b2b点击', '询价']
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'line',
animation: false,
label: {
backgroundColor: '#ccc',
borderColor: '#aaa',
borderWidth: 1,
shadowBlur: 0,
shadowOffsetX: 0,
shadowOffsetY: 0,
textStyle: {
color: '#222'
}
} }
},err=>{}) }
}, },
chartsMap(see,clc){ // 画饼 xAxis: {
var then = this; type: 'category',
let myChart = this.$echarts.init(document.getElementById('chartsMap')); axisLine: {
myChart.setOption({ show: false,
title: { lineStyle: {
text: then.inquireLineStatistical[0].lineName, width: 30
left: 'left', }
textStyle:{ },
fontWeight:'bold', axisLabel: {
fontSize:14, interval: 5
color:'#333333', },
height:'30px' axisTick: false,
}, data: then.dayArr,
padding: [ },
20, // 上 grid: {
20, // 右 x: 25,
20, // 下 y: 60,
20, // 左 x2: 5,
] y2: 20,
}, containLabel: true
backgroundColor: '#fff', },
legend: { yAxis: {
icon: 'rect', type: 'category',
selectedMode:false, data: ['10', '20', '30', '40', '50', '60', '70', '80', '90', '100'],
orient: 'vertical', axisLine: {
x: 'right', show: false
data:['b2b点击','询价'] },
}, axisTick: false,
tooltip: { splitLine: {
trigger: 'axis', show: false
axisPointer: { },
type: 'line', scale: true,
animation: false, minInterval: 1,
label: { type: 'value',
backgroundColor: '#ccc', axisLabel: {
borderColor: '#aaa', formatter: '{value} 个'
borderWidth: 1, }
shadowBlur: 0, },
shadowOffsetX: 0, series: [{
shadowOffsetY: 0, name: 'b2b点击',
textStyle: { type: 'line',
color: '#222' smooth: false,
} data: clc,
} lineStyle: {
} width: 3,
color: '#50C291',
}, },
xAxis: { itemStyle: {
type: 'category', borderWidth: 2,
axisLine: { color: '#50C291'
show: false,
lineStyle:{
width:30
}
},
axisLabel:{interval: 5},
axisTick:false,
data: then.dayArr,
}, },
grid: { symbol: 'none',
x:25, areaStyle: {
y:60, color: {
x2:5, type: 'linear',
y2:20, x: 0,
containLabel: true y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0,
color: 'rgba(230,230,230,0)' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(230,230,230,0)' // 100% 处的颜色
}],
globalCoord: false // 缺省为 false
}
}
},
{
name: '询价',
type: 'line',
smooth: false,
data: see,
lineStyle: {
width: 3,
color: '#FF793E',
}, },
yAxis: { itemStyle: {
type: 'category', borderWidth: 2,
data:['10','20','30','40','50','60','70','80','90','100'], color: '#FF793E'
axisLine: {show: false},
axisTick:false,
splitLine:{
show:false
},
scale: true,
minInterval:1,
type: 'value',
axisLabel:{formatter:'{value} 个'}
}, },
series: [ symbol: 'none',
{ areaStyle: {
name: 'b2b点击', color: {
type: 'line', type: 'linear',
smooth:false, x: 0,
data: clc, y: 0,
lineStyle:{ x2: 0,
width:3, y2: 1,
color:'#50C291', colorStops: [{
}, offset: 0,
itemStyle:{ color: 'rgba(230,230,230,0)' // 0% 处的颜色
borderWidth:2, }, {
color:'#50C291' offset: 1,
}, color: 'rgba(230,230,230,0)' // 100% 处的颜色
symbol:'none', }],
areaStyle:{ globalCoord: false // 缺省为 false
color: { }
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0, color:'rgba(230,230,230,0)' // 0% 处的颜色
}, {
offset: 1, color:'rgba(230,230,230,0)' // 100% 处的颜色
}],
globalCoord: false // 缺省为 false
}
}
},
{
name: '询价',
type: 'line',
smooth:false,
data: see,
lineStyle:{
width:3,
color:'#FF793E',
},
itemStyle:{
borderWidth:2,
color:'#FF793E'
},
symbol:'none',
areaStyle:{
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0, color:'rgba(230,230,230,0)' // 0% 处的颜色
}, {
offset: 1, color:'rgba(230,230,230,0)' // 100% 处的颜色
}],
globalCoord: false // 缺省为 false
}
}
}
]
},true)
},
submitForm(addMsg) {//提交创建、修改表单
this.$refs[addMsg].validate((valid) => {
if (valid) {
this.saveVisa()
} else {
return false;
} }
}); }
}, ]
saveVisa(){ // 保存 }, true)
this.apipost('app_add_inquire',this.addMsg,res=>{ }
if(res.data.resultCode==1){ },
this.$message.success(res.data.message) submitForm(addMsg) { //提交创建、修改表单
this.addShow=false this.$refs[addMsg].validate((valid) => {
this.initMsg() if (valid) {
this.getInquireLineNeed() this.saveVisa()
}else{ } else {
this.$message.error(res.data.message) return false;
} }
},err=>{}) });
}, },
cancelEdit(){ // 取消新增 saveVisa() { // 保存
this.addShow=false this.apipost('app_add_inquire', this.addMsg, res => {
if (res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.addShow = false
this.initMsg() this.initMsg()
}, this.getInquireLineNeed()
initMsg(){ } else {
this.LineteamList = [] this.$message.error(res.data.message)
this.addMsg={ }
CustomerInfoId:'', }, err => {})
LineId:'', },
DepartTime:'', cancelEdit() { // 取消新增
BudgetPrice:'', this.addShow = false
PeopleNumber:'', this.initMsg()
LineteamId:'-1', },
Remark:'' initMsg() {
} this.LineteamList = []
}, this.addMsg = {
CustomerInfoId: '',
resetForm(formName) { // 重置表单 LineId: '',
this.$refs[formName].resetFields(); DepartTime: '',
}, BudgetPrice: '',
getCountDays(){ PeopleNumber: '',
var curDate = new Date(); LineteamId: '-1',
// 获取当前月份 Remark: ''
var curMonth = curDate.getMonth();
// 实际月份比curMonth大1，下面将月份设置为下一个月
curDate.setMonth(curMonth+1);
// 将日期设置为0，表示自动计算为上个月（这里指的是当前月份）的最后一天
curDate.setDate(0);
// 返回当前月份的天数
return curDate.getDate();
},
goUrl(path,id,name) {
this.$router.push({ name: path,query:{"id":id,"name":name} })
} }
},mounted(){ },
// this.dayS = this.getCountDays()
// for(let i=1;i<=this.dayS;i++){
// this.dayArr.push(i+'日')
// }
this.getInquireLineNeed() resetForm(formName) { // 重置表单
this.getInquireLineList() this.$refs[formName].resetFields();
},
getCountDays() {
var curDate = new Date();
// 获取当前月份
var curMonth = curDate.getMonth();
// 实际月份比curMonth大1，下面将月份设置为下一个月
curDate.setMonth(curMonth + 1);
// 将日期设置为0，表示自动计算为上个月（这里指的是当前月份）的最后一天
curDate.setDate(0);
// 返回当前月份的天数
return curDate.getDate();
},
goUrl(path, id, name) {
this.$router.push({
name: path,
query: {
"id": id,
"name": name
}
})
}
},
mounted() {
// this.dayS = this.getCountDays()
// for(let i=1;i<=this.dayS;i++){
// this.dayArr.push(i+'日')
// }
this.getInquireLineNeed()
this.getInquireLineList()
} }
} }
</script> </script>
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