Commit b4ec03f7 authored by 黄奎's avatar 黄奎

页面修改

parent 3f2827b4
...@@ -108,6 +108,16 @@ ...@@ -108,6 +108,16 @@
:height="sceneList.length > 0 ? '600' : '660'" border row-class-name="font-size-12" :height="sceneList.length > 0 ? '600' : '660'" border row-class-name="font-size-12"
@selection-change="handleSelectionChange"> @selection-change="handleSelectionChange">
<el-table-column fixed type="selection" width="40"></el-table-column> <el-table-column fixed type="selection" width="40"></el-table-column>
<el-table-column prop="ClueState" label="线索状态" show-overflow-tooltip>
<template slot-scope="scope">
<template v-if="scope.row.ClueState==1">
正常
</template>
<template v-else-if="scope.row.ClueState==2">
无效
</template>
</template>
</el-table-column>
<el-table-column prop="ClueName" label="线索名称" v-if="queryType[0].show" show-overflow-tooltip> <el-table-column prop="ClueName" label="线索名称" v-if="queryType[0].show" show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<p @click="openDetails(scope)" class="font-color-link cp"> <p @click="openDetails(scope)" class="font-color-link cp">
...@@ -184,11 +194,11 @@ ...@@ -184,11 +194,11 @@
@size-change="handleSizeChange" :total="total"> @size-change="handleSizeChange" :total="total">
</el-pagination> </el-pagination>
</div> </div>
<el-drawer :with-header="false" size='70%' :visible.sync="drawer" direction="rtl" :before-close="handleClose"> <el-drawer :with-header="false" size='70%' :visible.sync="isShowCustomerInfo" direction="rtl" :before-close="handleClose">
<customerInfoBox :CustomerId="CustomerId" @transferS="transfer" @deleteClue="deleteClue" @watersS="waters" <customerInfoBox :CustomerId="CustomerId" @transferS="transfer" @deleteClue="deleteClue" @watersS="waters"
@editCustS="editCust" /> @editCustS="editCust" />
</el-drawer> </el-drawer>
<el-drawer :with-header="false" size='70%' :visible.sync="drawer2" direction="rtl" :before-close="handleClose"> <el-drawer :with-header="false" size='70%' :visible.sync="isShowGuestInfo" direction="rtl" :before-close="handleClose">
<guestInfoBox :CustomerId="CustomerId" @transferS="transfer" @deleteClue="deleteClue" @watersS="waters" <guestInfoBox :CustomerId="CustomerId" @transferS="transfer" @deleteClue="deleteClue" @watersS="waters"
@editCustS="editCust" /> @editCustS="editCust" />
</el-drawer> </el-drawer>
...@@ -246,7 +256,7 @@ ...@@ -246,7 +256,7 @@
return { return {
ruleList: [], ruleList: [],
guestDialogBoxShow: false, guestDialogBoxShow: false,
drawer2: false, isShowGuestInfo: false,//是否显示直客弹窗
activeMenu: 1, activeMenu: 1,
queryType2: [{ queryType2: [{
label: '线索名称', label: '线索名称',
...@@ -326,7 +336,7 @@ ...@@ -326,7 +336,7 @@
CustomerIdStr: '', CustomerIdStr: '',
transferVisible: false, transferVisible: false,
mySelectCtrl: false, mySelectCtrl: false,
drawer: false, isShowCustomerInfo: false,//是否显示客户弹窗
loading: true, loading: true,
dialogTableVisible: false, dialogTableVisible: false,
dialogTableVisibleName: '新建线索', dialogTableVisibleName: '新建线索',
...@@ -499,8 +509,8 @@ ...@@ -499,8 +509,8 @@
}, res => { }, res => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
if (type === 1) {} { if (type === 1) {} {
this.drawer = false this.isShowCustomerInfo = false
this.drawer2 = false this.isShowGuestInfo = false
} }
this.multipleSelection = [] this.multipleSelection = []
this.$message.success(res.data.message); this.$message.success(res.data.message);
...@@ -545,8 +555,8 @@ ...@@ -545,8 +555,8 @@
this.apipost('/api/Customer/UpdateCustomerClue', msg, res => { this.apipost('/api/Customer/UpdateCustomerClue', msg, res => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
if (type === 1) {} { if (type === 1) {} {
this.drawer = false this.isShowCustomerInfo = false
this.drawer2 = false this.isShowGuestInfo = false
} }
this.multipleSelection = [] this.multipleSelection = []
this.$message.success(res.data.message); this.$message.success(res.data.message);
...@@ -621,8 +631,8 @@ ...@@ -621,8 +631,8 @@
this.multipleSelection = [] this.multipleSelection = []
this.transferVisible = false this.transferVisible = false
if (type === 3) {} { if (type === 3) {} {
this.drawer = false this.isShowCustomerInfo = false
this.drawer2 = false this.isShowGuestInfo = false
} }
this.$message.success(res.data.message); this.$message.success(res.data.message);
this.getList() this.getList()
...@@ -653,9 +663,9 @@ ...@@ -653,9 +663,9 @@
this.CustomerId = scope.row.CustomerId this.CustomerId = scope.row.CustomerId
this.CustomerName = scope.row.CustomerName this.CustomerName = scope.row.CustomerName
if (this.msg.CustomerType === 0) { if (this.msg.CustomerType === 0) {
this.drawer = true this.isShowCustomerInfo = true
} else { } else {
this.drawer2 = true this.isShowGuestInfo = true
} }
}, },
// 获取是否开启规则 // 获取是否开启规则
......
<style> <style>
.drawer-box{ .drawer-box {
height: 100%; height: 100%;
} }
.drawer-header{
.drawer-header {
height: 83px; height: 83px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding: 0 30px; padding: 0 30px;
} }
.drawer-header .left{
.drawer-header .left {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.drawer-header .left img{
.drawer-header .left img {
display: inline-block; display: inline-block;
margin-right: 10px; margin-right: 10px;
} }
.drawer-body{
height: calc( 100% - 83px); .drawer-body {
} height: calc(100% - 83px);
.drawer-body .top-info{ }
.drawer-body .top-info {
height: 115px; height: 115px;
padding: 30px; padding: 30px;
box-sizing: border-box; box-sizing: border-box;
font-size: 12px; font-size: 12px;
background-color: #F6F4FC; background-color: #F6F4FC;
} }
.drawer-body .top-info .info-lable{
.drawer-body .top-info .info-lable {
display: inline-block; display: inline-block;
width: 80px; width: 80px;
color: #999999; color: #999999;
} }
.margin-bottom-25{
.margin-bottom-25 {
margin-bottom: 25px; margin-bottom: 25px;
} }
.drawer-box .el-tabs__nav-wrap::after{
.drawer-box .el-tabs__nav-wrap::after {
height: 0; height: 0;
} }
.drawer-body .el-tabs__header{
.drawer-body .el-tabs__header {
padding: 0 25px; padding: 0 25px;
margin-bottom: 0; margin-bottom: 0;
} }
.drawer-body>.content{
.drawer-body>.content {
height: calc(100% - 115px); height: calc(100% - 115px);
} }
.drawer-body .el-tabs{
.drawer-body .el-tabs {
height: 100%; height: 100%;
} }
.drawer-body .el-tabs__content{
.drawer-body .el-tabs__content {
background-color: #F6F4FC; background-color: #F6F4FC;
height: calc(100% - 40px); height: calc(100% - 40px);
box-sizing: border-box; box-sizing: border-box;
} }
.drawer-body .el-tabs__content .el-tab-pane{
.drawer-body .el-tabs__content .el-tab-pane {
height: 100%; height: 100%;
position: absolute; position: absolute;
width: calc(100%); width: calc(100%);
padding: 17px 20px; padding: 17px 20px;
box-sizing: border-box box-sizing: border-box
} }
</style> </style>
<template> <template>
<div class="drawer-box" v-if="loading"> <div class="drawer-box" v-if="loading">
...@@ -69,14 +82,15 @@ ...@@ -69,14 +82,15 @@
<p>{{detailsData.GusetName}}</p> <p>{{detailsData.GusetName}}</p>
</div> </div>
<div class="right"> <div class="right">
<el-button class="crm-btn query-btn" @click="editCust" >编辑</el-button> <el-button class="crm-btn query-btn" @click="editCust">编辑</el-button>
<el-dropdown @command="handleCommand" style="top: 1px;" > <el-dropdown @command="handleCommand" style="top: 1px;">
<el-button class="crm-btn crm-btn-more easy-btn margin-right0"> <el-button class="crm-btn crm-btn-more easy-btn margin-right0">
<i class="iconfont icongengduo"></i> <i class="iconfont icongengduo"></i>
</el-button> </el-button>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item command="z"><i class="iconfont iconplus-transfer"></i> 转移</el-dropdown-item> <el-dropdown-item command="z"><i class="iconfont iconplus-transfer"></i> 转移</el-dropdown-item>
<el-dropdown-item command="d"><i class="iconfont icondelete"></i> 删除</el-dropdown-item> <el-dropdown-item command="d"><i class="iconfont icondelete"></i> 删除</el-dropdown-item>
<el-dropdown-item command="w"><i class="iconfont icondelete"></i> 无效线索</el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
</div> </div>
...@@ -88,7 +102,8 @@ ...@@ -88,7 +102,8 @@
<span class="info-lable">客户级别:</span><span>{{detailsData.CustomerIdLevelStr}}</span> <span class="info-lable">客户级别:</span><span>{{detailsData.CustomerIdLevelStr}}</span>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<span class="info-lable">创建时间:</span><span>{{detailsData.CreateDate ? detailsData.CreateDate : ''}}</span> <span
class="info-lable">创建时间:</span><span>{{detailsData.CreateDate ? detailsData.CreateDate : ''}}</span>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
...@@ -96,42 +111,46 @@ ...@@ -96,42 +111,46 @@
<span class="info-lable">负责人:</span><span>{{detailsData.PersonChargeStr}}</span> <span class="info-lable">负责人:</span><span>{{detailsData.PersonChargeStr}}</span>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<span class="info-lable">更新时间:</span><span>{{detailsData.UpdateTime ? detailsData.UpdateTime : ''}}</span> <span
class="info-lable">更新时间:</span><span>{{detailsData.UpdateTime ? detailsData.UpdateTime : ''}}</span>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
<div class="content"> <div class="content">
<el-tabs v-model="activeName" @tab-click="handleClick"> <el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="活动" name="1"> <el-tab-pane label="活动" name="1">
<Activity v-if="activeName === '1'" :CustomerId="CustomerId" :showType="2"/> <Activity v-if="activeName === '1'" :CustomerId="CustomerId" :showType="2" :detailsData="detailsData" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="详细资料" name="2"> <el-tab-pane label="详细资料" name="2">
<Details v-if="activeName === '2'" :detailsData="detailsData"/> <Details v-if="activeName === '2'" :detailsData="detailsData" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="附件" name="8"> <el-tab-pane label="附件" name="8">
<Enclosure :ID='CustomerId' :type='1' :isGuest="true" v-if="activeName === '8'"/> <Enclosure :ID='CustomerId' :type='1' :isGuest="true" v-if="activeName === '8'" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="操作记录" name="9"> <el-tab-pane label="操作记录" name="9">
<Record v-if="activeName === '9'" :CustomerId="CustomerId"/> <Record v-if="activeName === '9'" :CustomerId="CustomerId" />
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</div> </div>
<invalidDialogBox v-if="isShowInvalidBox" :guestInfo="detailsData" />
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import Activity from "../guestManagement/Activity"; import Activity from "../guestManagement/Activity";
import Details from "../guestManagement/Details"; import Details from "../guestManagement/Details";
import Enclosure from "../clueManagement/Enclosure"; import Enclosure from "../clueManagement/Enclosure";
import Record from "../guestManagement/Record"; import Record from "../guestManagement/Record";
export default { import invalidDialogBox from "./invalidDialogBox";
export default {
components: { components: {
Activity, Activity,
Details, Details,
Enclosure, Enclosure,
Record Record,
invalidDialogBox
}, },
props:{ props: {
CustomerId: { CustomerId: {
type: Number, type: Number,
default: 0 default: 0
...@@ -142,14 +161,16 @@ export default { ...@@ -142,14 +161,16 @@ export default {
activeName: '1', activeName: '1',
detailsData: {}, detailsData: {},
loading: false, loading: false,
isShowInvalidBox: false, //是否显示无效线索弹窗
}; };
},watch:{ },
watch: {
CustomerId: { CustomerId: {
handler(val, oldVal){ handler(val, oldVal) {
this.init() this.init()
this.activeName = '1' this.activeName = '1'
}, },
deep:true deep: true
} }
}, },
mounted() { mounted() {
...@@ -161,35 +182,37 @@ export default { ...@@ -161,35 +182,37 @@ export default {
}) })
}, },
methods: { methods: {
init(){ init() {
this.apipost('/api/Customer/GetAllGuesstCustomerModel', {ID: this.CustomerId}, res=>{ this.apipost('/api/Customer/GetAllGuesstCustomerModel', {
ID: this.CustomerId
}, res => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
let data = res.data.data let data = res.data.data
if(!data.HousePhotos){ if (!data.HousePhotos) {
data.HousePhotos = [] data.HousePhotos = []
} }
if(!data.BusinessCardPhotos){ if (!data.BusinessCardPhotos) {
data.BusinessCardPhotos = [] data.BusinessCardPhotos = []
} }
if(!data.Images){ if (!data.Images) {
data.Images = [] data.Images = []
} }
if(!data.CustomerSourceType){ if (!data.CustomerSourceType) {
data.CustomerSourceType = '' data.CustomerSourceType = ''
} }
if(!data.CustomerSource){ if (!data.CustomerSource) {
data.CustomerSource = '' data.CustomerSource = ''
} }
if(!data.Province){ if (!data.Province) {
data.Province = '' data.Province = ''
} }
if(!data.Country){ if (!data.Country) {
data.Country = '' data.Country = ''
} }
if(!data.City){ if (!data.City) {
data.City = '' data.City = ''
} }
if(!data.District){ if (!data.District) {
data.District = '' data.District = ''
} }
this.detailsData = data this.detailsData = data
...@@ -197,20 +220,31 @@ export default { ...@@ -197,20 +220,31 @@ export default {
} }
}) })
}, },
handleCommand(command){ handleCommand(command) {
if (command === 'z') { if (command === 'z') {
this.$emit('transferS', 3); this.$emit('transferS', 3);
} else if (command === 'g') { } else if (command === 'g') {
} }
//无效线索弹窗
else if (command === 'w') {
this.isShowInvalidBox=true;
var pmsg = {};
console.log("this.detailsData", this.detailsData);
// this.apipost('/api/Customer/UpdateClueState', pmsg, res => {
// if (res.data.resultCode == 1) {
// this.SceneEmployeeList = res.data.data
// }
// })
}
}, },
handleClick(tab, event) {}, handleClick(tab, event) {},
editCust(){ editCust() {
this.$emit('editCustS', 2) this.$emit('editCustS', 2)
}, },
handleClose(done) { handleClose(done) {
done(); done();
} }
} }
} }
</script> </script>
\ No newline at end of file
<style>
.invalidDialogBox.add-box .add-tit {
display: flex;
justify-content: space-between;
align-items: center;
height: 20px;
}
.invalidDialogBox.add-box .add-tit p {
display: flex;
align-items: center;
font-weight: bold;
color: rgba(17, 17, 17, 1);
font-size: 14px;
}
.invalidDialogBox.add-box .add-tit p span {
display: inline-block;
width: 6px;
height: 6px;
background: #409efe;
border-radius: 50%;
margin-right: 10px;
}
.invalidDialogBox.add-box .el-dialog__header {
padding: 15px 20px;
background: rgba(255, 255, 255, 1);
}
.invalidDialogBox.add-box .dialog-footer {
text-align: center;
background-color: rgba(248, 250, 251, 1);
padding-bottom: 20px;
}
.invalidDialogBox.add-box .el-dialog__footer {
padding: 0;
}
.invalidDialogBox.add-box .el-dialog__body {
background-color: rgba(248, 250, 251, 1);
padding-top: 20px;
max-height: 400px;
overflow: auto;
}
.invalidDialogBox .add-box-btn.el-button {
border-radius: 0;
background-color: #409efecc;
border-color: #409efecc;
color: white;
padding: 12px 43px;
}
.invalidDialogBox .add-box-btn.el-button:hover {
background-color: #409efe;
border-color: #409efe;
color: white;
}
.invalidDialogBox .add-box-btn.el-button.add-box-cancel {
color: #409efecc;
background-color: white;
}
.invalidDialogBox .add-box-btn.el-button.add-box-cancel:hover {
color: #409efe;
background-color: white;
}
.invalidDialogBox .el-input .el-input-group__append {
background-color: #409efe;
border-color: #409efe;
color: #fff;
}
.invalidDialogBox .form-box .form-box-tit {
display: flex;
align-items: center;
margin-bottom: 20px;
}
.invalidDialogBox .form-box .radius {
display: flex;
width: 4px;
height: 4px;
background: rgba(255, 164, 117, 1);
border-radius: 50%;
margin-right: 10px;
}
.invalidDialogBox .up-img-box .uib-item {
margin-right: 30px;
width: 130px;
height: 130px;
background-color: white;
position: relative;
margin-bottom: 30px;
}
.invalidDialogBox .up-img-box .uib-item p {
position: absolute;
bottom: -30px;
font-size: 12px;
text-align: center;
width: 100%;
}
.invalidDialogBox .up-img-box .uib-item:hover .imgzhe-btn {
opacity: 1;
}
.invalidDialogBox .imgzhe {
width: 100%;
height: 100%;
position: absolute;
top: 0;
}
.invalidDialogBox .imgzhe .imgzhe-btn {
background: rgba(0, 0, 0, 0.6);
width: 100%;
height: 100%;
text-align: center;
line-height: 120px;
position: absolute;
top: 0;
opacity: 1;
transition: all linear 0.5s;
}
.invalidDialogBox .imgzhe .imgzhe-btn i {
font-size: 22px;
margin-right: 5px;
color: white;
cursor: pointer;
}
.invalidDialogBox .up-ctrl {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.invalidDialogBox .up-ctrl>div {
width: 100%;
height: 100%;
text-align: center;
line-height: 140px;
}
</style>
<template>
<el-dialog :visible.sync="dialogTableVisible" @closed="closedDialog"
class="add-box add-box1 invalidDialogBox" width="450px">
<div class="add-tit" slot="title">
<p><span></span>无效线索弹窗</p>
<span icon="el-icon-close"></span>
</div>
<div class="form-box">
<el-form ref="form" class="MyEditForm">
<el-row>
<el-col :span="24">
<div class="MyEditForm-item label-pad-left">
<el-form-item label="无效说明">
<el-input type="textarea" placeholder="无效说明" v-model="saveMsg.Remark"></el-input>
</el-form-item>
</div>
</el-col>
</el-row>
</el-form>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" class="add-box-btn" @click="SaveInvalid()">确 定</el-button>
<el-button class="add-box-btn add-box-cancel" @click="dialogTableVisible = false">关 闭
</el-button>
</div>
</el-dialog>
</template>
<script>
export default {
props: {
guestInfo: {
type: Object,
default: null,
},
},
data() {
return {
dialogTableVisible: false,
saveMsg: {
CustomerId: 0,
GueustId: 0,
Remark: ""
}
};
},
mounted() {
console.log("this.guestInfo", this.guestInfo);
let $this = this;
setTimeout(() => {
$this.dialogTableVisible = true;
}, 50);
},
methods: {
closedDialog() {
this.MsgBus.$emit("closeCustomerDialogBox");
},
//保存无效线索
SaveInvalid() {
},
},
};
</script>
\ No newline at end of file
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