jiangyy
5 years ago
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