You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
337 lines
9.3 KiB
337 lines
9.3 KiB
<!-- 客户信息 -->
|
|
<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"
|
|
:data="{customerId:customerId}"
|
|
: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/uploadqrcodeV2',
|
|
dataForm: {
|
|
rootAgencyDTO: {
|
|
agencyName: '',
|
|
level: '',
|
|
areaCode: '',
|
|
province: '',
|
|
city: '',
|
|
district: '',
|
|
|
|
},
|
|
customerInfoDTO: {
|
|
customerName: '',
|
|
organizationLevel: '',
|
|
logo: ''
|
|
},
|
|
managers: [
|
|
{
|
|
realName: '',
|
|
gender: '',
|
|
mobile: ''
|
|
}
|
|
]
|
|
}
|
|
}
|
|
|
|
},
|
|
mounted () {
|
|
|
|
this.$nextTick(() => {
|
|
|
|
this.customerId = localStorage.getItem('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()
|
|
localStorage.setItem('customerName', this.dataForm.customerInfoDTO.customerName)
|
|
this.$emit('changeCustomerName', this.dataForm.customerInfoDTO.customerName)
|
|
|
|
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 === '2') {
|
|
return '女'
|
|
} else {
|
|
return '未知'
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
</script>
|
|
<style scoped>
|
|
.item_width_1 {
|
|
width: 300px;
|
|
}
|
|
.btn_save {
|
|
margin: 0 50px;
|
|
}
|
|
</style>
|
|
|