10 changed files with 407 additions and 47 deletions
@ -0,0 +1,333 @@ |
|||
<!-- 客户信息 --> |
|||
<template> |
|||
<div> |
|||
<!-- <el-button @click="backStep" type="primary" icon="el-icon-back">返回</el-button> --> |
|||
<el-card shadow="never" |
|||
class="aui-card--fill"> |
|||
<el-row> |
|||
<el-tag type="info" |
|||
class="eltag" |
|||
size="medium" |
|||
style="width:100%;margin-top:10px">客户信息 |
|||
</el-tag><br /><br /> |
|||
<el-form :inline="false" |
|||
:model="dataForm.customerInfoDTO" |
|||
:rules="dataRule" |
|||
ref="dataForm" |
|||
:label-width="'120px'"> |
|||
<el-form-item label="客户名称" |
|||
prop="customerName"> |
|||
<el-input class="item_width_1" |
|||
v-model="dataForm.customerInfoDTO.customerName" |
|||
placeholder="客户名称"></el-input> |
|||
</el-form-item> |
|||
|
|||
<el-form-item prop="logo" |
|||
label="Logo"> |
|||
<el-upload class="item_width_1 avatar-uploader" |
|||
:action="uploadUlr" |
|||
:show-file-list="false" |
|||
:on-success="handleImgSuccess" |
|||
:before-upload="beforeImgUpload"> |
|||
<img v-if="dataForm.customerInfoDTO.logo" |
|||
:src="dataForm.customerInfoDTO.logo" |
|||
style="width:70px;height:70px" |
|||
class="function-icon"> |
|||
<i v-else |
|||
class="el-icon-plus avatar-uploader-icon"></i> |
|||
</el-upload> |
|||
</el-form-item> |
|||
<el-button size="mini" |
|||
class="btn_save" |
|||
type="primary" |
|||
@click="saveInfo()">保存客户信息</el-button> |
|||
|
|||
</el-form> |
|||
</el-row> |
|||
<el-row> |
|||
<el-tag type="info" |
|||
class="eltag" |
|||
size="medium" |
|||
style="width:100%;margin-top:10px">根级组织信息 |
|||
</el-tag><br /><br /> |
|||
|
|||
<el-form :inline="false" |
|||
:model="dataForm.rootAgencyDTO" |
|||
ref="dataForm" |
|||
:label-width="'120px'"> |
|||
<el-form-item class="item_width_1" |
|||
label="组织名称"> |
|||
<span class="item_width_1">{{dataForm.rootAgencyDTO.agencyName}}</span> |
|||
</el-form-item> |
|||
|
|||
<el-form-item class="item_width_1" |
|||
label="组织级别"> |
|||
<span class="item_width_1">{{dataForm.rootAgencyDTO.level|showInfo}}</span> |
|||
</el-form-item> |
|||
|
|||
<el-form-item class="item_width_1" |
|||
label="地区编码"> |
|||
<span class="item_width_1">{{dataForm.rootAgencyDTO.areaCode}}</span> |
|||
</el-form-item> |
|||
<el-form-item class="item_width_1" |
|||
label="所属地区"> |
|||
<span class="item_width_1">{{dataForm.rootAgencyDTO.province+dataForm.rootAgencyDTO.city+dataForm.rootAgencyDTO.district}}</span> |
|||
</el-form-item> |
|||
|
|||
</el-form> |
|||
</el-row> |
|||
<el-row> |
|||
<el-tag type="info" |
|||
class="eltag" |
|||
size="medium" |
|||
style="width:100%;margin-top:10px">跟管理员信息 |
|||
</el-tag><br /><br /> |
|||
<el-form :inline="false" |
|||
:model="dataForm.managers[0]" |
|||
ref="dataForm" |
|||
:label-width="'120px'"> |
|||
<el-form-item class="item_width_1" |
|||
label="姓名"> |
|||
<span>{{dataForm.managers[0].realName}}</span> |
|||
</el-form-item> |
|||
|
|||
<el-form-item class="item_width_1" |
|||
label="性别"> |
|||
<span>{{dataForm.managers[0].gender|showGender}}</span> |
|||
</el-form-item> |
|||
|
|||
<el-form-item class="item_width_1" |
|||
label="电话"> |
|||
<span>{{dataForm.managers[0].mobile}}</span> |
|||
</el-form-item> |
|||
|
|||
</el-form> |
|||
</el-row> |
|||
<!-- <el-row> |
|||
<el-tag type="info" |
|||
class="eltag" |
|||
size="medium" |
|||
style="width:100%;margin-top:10px">配置信息 |
|||
</el-tag><br /><br /> |
|||
|
|||
<el-row v-for="(val, index) in data.managers" |
|||
:key="index" |
|||
style="margin:10px;font-size:16px;height:30px;line-height:30px;border-bottom:1px solid grey;" |
|||
:gutter="20"> |
|||
<el-col :span="6">{{val.realName}}</el-col> |
|||
<el-col :span="4">{{val.gender|genderName}}</el-col> |
|||
<el-col :span="14">{{val.mobile}}</el-col> |
|||
</el-row> |
|||
</el-row> --> |
|||
</el-card> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
import { Loading } from 'element-ui' // 引入Loading服务 |
|||
|
|||
let loading // 加载动画 |
|||
export default { |
|||
props: { |
|||
}, |
|||
data () { |
|||
return { |
|||
customerId: '', |
|||
uploadUlr: window.SITE_CONFIG['apiURL'] + '/oss/file/function/upload', |
|||
dataForm: { |
|||
rootAgencyDTO: { |
|||
agencyName: '成都市', |
|||
level: 'city', |
|||
areaCode: '123456', |
|||
province: '四川省', |
|||
city: '成都市', |
|||
district: 'SN4FHbIZtK', |
|||
|
|||
}, |
|||
customerInfoDTO: { |
|||
customerName: '成都市', |
|||
organizationLevel: 'city', |
|||
logo: '' |
|||
}, |
|||
managers: [ |
|||
{ |
|||
realName: '王显章', |
|||
gender: '1', |
|||
mobile: '18560677960' |
|||
} |
|||
] |
|||
} |
|||
} |
|||
|
|||
}, |
|||
mounted () { |
|||
|
|||
this.$nextTick(() => { |
|||
console.log(this.$store.state.user.customerId) |
|||
this.customerId = this.$store.state.user.customerId |
|||
|
|||
this.loadData() |
|||
}) |
|||
|
|||
}, |
|||
methods: { |
|||
//获取客户基本信息 |
|||
loadData () { |
|||
this.startLoading() |
|||
|
|||
// 表单对象 |
|||
const url = '/oper/crm/customer/detail' |
|||
|
|||
let params = { |
|||
customerId: this.customerId, |
|||
} |
|||
|
|||
window.app.ajax.post(url, params, |
|||
(data, rspMsg) => { |
|||
this.endLoading() |
|||
this.dataForm = data |
|||
|
|||
}, |
|||
(rspMsg, data) => { |
|||
this.endLoading() |
|||
this.$message.error(rspMsg) |
|||
}) |
|||
}, |
|||
//获取配置信息 |
|||
async loadConfigData () { |
|||
// 表单对象 |
|||
const url = '/oper/crm/customer/getcustomerparameter' |
|||
|
|||
let params = { |
|||
customerId: this.customerId, |
|||
} |
|||
|
|||
window.app.ajax.post(url, params, |
|||
(data, rspMsg) => { |
|||
this.endLoading() |
|||
this.$message.success('修改成功') |
|||
this.diaCancel() |
|||
this.$emit('refresh') |
|||
}, |
|||
(rspMsg, data) => { |
|||
this.endLoading() |
|||
this.$message.error(rspMsg) |
|||
}) |
|||
}, |
|||
|
|||
saveInfo () { |
|||
// 表单对象 |
|||
// let url = 'https://nei.netease.com/api/apimock-v2/e3b1d0eb88e905f6c7ee559b2d6bb7ad/oper/crm/customer/updatecustomer' |
|||
let url = '/oper/crm/customer/updatecustomer' |
|||
// 表单对象 |
|||
let params = { |
|||
customerId: this.customerId, |
|||
customerName: this.dataForm.customerInfoDTO.customerName, |
|||
logo: this.dataForm.customerInfoDTO.logo |
|||
} |
|||
|
|||
window.app.ajax.post(url, params, |
|||
(data, rspMsg) => { |
|||
this.endLoading() |
|||
this.$message.success('修改成功') |
|||
this.loadData() |
|||
}, |
|||
(rspMsg, data) => { |
|||
this.endLoading() |
|||
this.$message.error(rspMsg) |
|||
}) |
|||
|
|||
}, |
|||
|
|||
// 上传大图标成功 |
|||
handleImgSuccess (res, file) { |
|||
if (res.code === 0 && res.msg === 'success') { |
|||
|
|||
this.dataForm.customerInfoDTO.logo = res.data.url |
|||
|
|||
} else { |
|||
this.$message.error(res.msg) |
|||
} |
|||
}, |
|||
|
|||
beforeImgUpload (file) { |
|||
// const isPNG = file.type === 'image/png' |
|||
const isLt1M = file.size / 1024 / 1024 < 1 |
|||
|
|||
// if (!isPNG) { |
|||
// this.$message.error('上传图片只能是 PNG 格式!') |
|||
// } |
|||
if (!isLt1M) { |
|||
this.$message.error('上传图片大小不能超过 1MB!') |
|||
} |
|||
// return isPNG && isLt1M |
|||
return isLt1M |
|||
}, |
|||
// 开启加载动画 |
|||
startLoading () { |
|||
loading = Loading.service({ |
|||
lock: true, // 是否锁定 |
|||
text: '正在加载……', // 加载中需要显示的文字 |
|||
background: 'rgba(0,0,0,.7)' // 背景颜色 |
|||
}) |
|||
}, |
|||
// 结束加载动画 |
|||
endLoading () { |
|||
// clearTimeout(timer); |
|||
if (loading) { |
|||
loading.close() |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
|
|||
dataRule () { |
|||
return { |
|||
logo: [ |
|||
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
|||
], |
|||
customerName: [ |
|||
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
|||
] |
|||
} |
|||
} |
|||
}, |
|||
filters: { |
|||
|
|||
showInfo (key) { |
|||
if (key === 'province') { |
|||
return '省级' |
|||
} else if (key === 'city') { |
|||
return '市级' |
|||
} else if (key === 'district') { |
|||
return '区县级' |
|||
} else if (key === 'street') { |
|||
return '乡(镇、街道)级' |
|||
} else if (key === 'community') { |
|||
return '社区级' |
|||
} else if (key === '') { |
|||
return '————' |
|||
} else { |
|||
return key |
|||
} |
|||
}, |
|||
showGender (key) { |
|||
if (key === '1') { |
|||
return '女' |
|||
} else if (key === '0') { |
|||
return '男' |
|||
} else { |
|||
return key |
|||
} |
|||
} |
|||
} |
|||
|
|||
} |
|||
</script> |
|||
<style scoped> |
|||
.item_width_1 { |
|||
width: 300px; |
|||
} |
|||
.btn_save { |
|||
margin: 0 50px; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue