yxt_develop
/
anrui
9
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

完善客户管理

master
yunuo970428 11 months ago
parent
968f09e457
commit
eabe8ed0cf
8 changed files with 2648 additions and 637 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 85
      yxt-as-ui/src/api/client/customermanagement.js
  2. 1300
      yxt-as-ui/src/router/index.js
  3. 449
      yxt-as-ui/src/views/client/customermanagement/customermanagement.vue
  4. 511
      yxt-as-ui/src/views/client/customermanagement/customermanagementAdd.vue
  5. 245
      yxt-as-ui/src/views/client/customermanagement/customermanagementInfo.vue
  6. 148
      yxt-as-ui/src/views/client/customermanagement/relation/vehicle.vue
  7. 302
      yxt-as-ui/src/views/client/customermanagement/relation/vehicleAdd.vue
  8. 245
      yxt-as-ui/src/views/client/customermanagement/relation/vehicleInfo.vue

85
yxt-as-ui/src/api/client/customermanagement.js
View File

@ -0,0 +1,85 @@
import request from '@/utils/request'
export default {
// 查询分页列表
listPage: function(params) {
return request({
url: '/crm/v1/crmcustomertemp/asListPage',
method: 'post',
data: params,
headers: { 'Content-Type': 'application/json' }
})
},
// 初始化
fetchDetailsBySid: function(data) {
return request({
url: '/crm/v1/crmcustomertemp/fetchSid/' + data,
method: 'get'
})
},
save: function(data) {
return request({
url: '/crm/v1/crmcustomertemp/save',
method: 'post',
data: data,
headers: { 'Content-Type': 'application/json' }
})
},
update: function(data) {
return request({
url: '/crm/v1/crmcustomertemp/update/' + data.sid,
method: 'post',
data: data,
headers: { 'Content-Type': 'application/json' }
})
},
// 根据当前登录用户的部分sid查询客户单位信息
selCustomerOrgList: function(data) {
return request({
url: '/crm/v1/crmcustomerorg/selCustomerOrgList',
method: 'get',
params: data
})
},
deleteBySids: function(data) {
return request({
url: '/crm/v1/crmcustomertemp/del/',
method: 'DELETE',
data: data,
headers: { 'Content-Type': 'application/json' }
})
},
// 车辆列表
vehList: function(params) {
return request({
url: '/as/v1/ascustomervehicle/vehList',
method: 'get',
params: params
})
},
// 新增、编辑车辆信息
details: function(data) {
return request({
url: '/as/v1/ascustomervehicle/fetchDetailsBySid/' + data,
method: 'get'
})
},
// 保存车辆信息
saveCustomerVeh: function(data) {
return request({
url: '/as/v1/ascustomervehicle/saveCustomerVeh',
method: 'post',
data: data,
headers: { 'Content-Type': 'application/json' }
})
},
// 删除车辆信息
delBySids: function(data) {
return request({
url: '/as/v1/ascustomervehicle/delBySids',
method: 'DELETE',
data: data,
headers: { 'Content-Type': 'application/json' }
})
},
}

1300
yxt-as-ui/src/router/index.js
View File

File diff suppressed because it is too large

449
yxt-as-ui/src/views/client/customermanagement/customermanagement.vue
View File

@ -0,0 +1,449 @@
<template>
<div class="app-container">
<!--列表页面-->
<div v-show="viewState == 1">
<button-bar view-title="客户管理" ref="btnbar" :btndisabled="btndisabled" @btnhandle="btnHandle"/>
<!--Start查询列表部分-->
<div class="main-content">
<div class="searchcon">
<el-button size="small" class="searchbtn" @click="clicksearchShow">{{ searchxianshitit }}</el-button>
<div v-show="isSearchShow" class="search">
<el-form ref="listQueryform" :inline="true" :model="listQuery" label-width="110px" class="tab-header">
<el-form-item label="客户名称">
<el-input v-model="listQuery.params.name" maxlength="20" placeholder="" class="addinputw" clearable/>
</el-form-item>
<el-form-item label="客户类型">
<el-select v-model="listQuery.params.customerTypeKey" class="addinputw" placeholder="请选择">
<el-option v-for="(item, index) in merType" :key="index.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
</el-form-item>
<el-form-item label="联系电话">
<el-input v-model="listQuery.params.mobile" maxlength="20" placeholder="" class="addinputw" clearable/>
</el-form-item>
<el-form-item label="客户级别">
<el-select v-model="listQuery.params.levelKey" class="addinputw" placeholder="">
<el-option v-for="(item, index) in induslevel" :key="index.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
</el-form-item>
<el-form-item label="提醒日期">
<el-date-picker value-format="yyyy-MM-dd" v-model="listQuery.params.remindStartDay" clearable style="width: 160px;" type="date" placeholder="开始日期"/>
<div class="line">至</div>
<el-date-picker value-format="yyyy-MM-dd" v-model="listQuery.params.remindEndDay" clearable style="width: 160px;" type="date" placeholder="结束日期"/>
</el-form-item>
</el-form>
<div class="btn" style="text-align: center;">
<el-button type="primary" icon="el-icon-search" size="small" @click="handleFilter">查询</el-button>
<el-button type="primary" icon="el-icon-refresh" size="small" @click="handleReset">重置</el-button>
</div>
</div>
</div>
<!--End查询列表部分-->
<div class="listtop">
<div class="tit">客户信息列表</div>
<pageye v-show="list.length > 0" :total="listQuery.total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList"/>
</div>
<!--Start 主页面主要部分 -->
<div class="">
<el-table :key="tableKey" v-loading="listLoading" :data="list" border style="width: 100%;" @selection-change="handleSelectionChange">
<el-table-column type="selection" align="center" width="50" />
<el-table-column label="序号" type="index" width="60" :index="indexMethod" align="center" />
<el-table-column label="客户编号" align="center" min-width="130">
<template slot-scope="scope">
<span class="bluezi" @click="toInfo(scope.row)">{{ scope.row.customerNo }}</span>
</template>
</el-table-column>
<el-table-column prop="name" label="客户名称" align="center" min-width="100" />
<el-table-column prop="customerType" label="客户类型" align="center" width="120" />
<el-table-column prop="mobile" label="联系电话" align="center" width="120" />
<el-table-column prop="weixin" label="微信号" align="center" width="120" />
<el-table-column prop="level" label="客户级别" align="center" width="120" />
<el-table-column prop="remind_day" label="提醒日期" align="center" width="120" />
<el-table-column label="车辆" align="center" width="100">
<template slot-scope="scope">
<span class="bluezi" @click="lookCar(scope.row)">{{ scope.row.vehCount }}</span>
</template>
</el-table-column>
</el-table>
</div>
<!--End 主页面主要部分-->
<div class="pages">
<div class="tit" />
<!-- 翻页 -->
<pagination v-show="list.length > 0" :total="listQuery.total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList" />
</div>
<!--End查询列表部分-->
</div>
</div>
<!--新增及修改 -->
<customermanagementAdd v-show="viewState == 2 || viewState == 3" ref="divAdd" @doback="resetState" @reloadlist="getList" />
<!-- 详情 -->
<customermanagementInfo v-show="viewState == 4" ref="divInfo" @doback="resetState" />
<!-- 查看车辆列表 -->
<vehicle v-show="viewState == 5" ref="divVehicle" @doback="resetState" />
<!-- 添加车辆 -->
<vehicleAdd v-show="viewState == 6" ref="divAddVehicle" @doback="resetState" @reloadlist="getList" />
<!-- 客户登记 -->
<el-dialog :visible.sync="dialogVisible" width="30%">
<el-form ref="form_obj" v-model="formobj" class="formaddcopy02">
<el-row style="border-top: 1px solid #E0E3EB">
<el-col :span="24">
<div class="span-sty">联络方式</div>
<el-form-item>
<el-select v-model="formobj.visitWayKey" class="addinputInfo" filterable placeholder="" @change="visitWayChange">
<el-option v-for="item in visitWay_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<div class="span-sty">客户类型</div>
<el-form-item>
<el-radio-group class="addinputInfo" v-model="formobj.customerType">
<el-radio v-for="item in customerType_list" :key="item.dictKey" :label="item.dictValue" @change="customerTypeChange">{{ item.dictValue }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleConfirm()">确 定</el-button>
<el-button @click="dialogVisible = false">关 闭</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import Pagination from '@/components/pagination'
import pageye from '@/components/pagination/pageye'
import ButtonBar from '@/components/ButtonBar'
import req from '@/api/client/customermanagement'
import customermanagementAdd from './customermanagementAdd'
import customermanagementInfo from './customermanagementInfo'
import vehicle from './relation/vehicle'
import vehicleAdd from './relation/vehicleAdd'
import { typeValues } from '@/api/Common/dictcommons'
export default {
name: 'CustomerManagement',
components: {
Pagination,
pageye,
ButtonBar,
customermanagementAdd,
customermanagementInfo,
vehicle,
vehicleAdd
},
data() {
return {
btndisabled: false,
btnList: [
{
type: 'primary',
size: 'small',
icon: 'plus',
btnKey: 'toAdd',
btnLabel: '新增'
},
{
type: 'primary',
size: 'small',
icon: 'edit',
btnKey: 'toEdit',
btnLabel: '编辑'
},
{
type: 'primary',
size: 'small',
icon: '',
btnKey: 'addVehicle',
btnLabel: '添加车辆'
},
{
type: 'danger',
size: 'small',
icon: 'del',
btnKey: 'doDel',
btnLabel: '删除'
},
{
type: 'success',
size: 'small',
icon: 'export',
btnKey: 'doExport',
btnLabel: '导出'
},
{
type: 'info',
size: 'small',
icon: 'cross',
btnKey: 'doClose',
btnLabel: '关闭'
}
],
isSearchShow: false,
searchxianshitit: '显示查询条件',
viewState: 1, // 1、列表 2、新增 3、编辑 4、查看
tableKey: 0,
list: [],
sids: [], // 用于导出的时候保存已选择的SIDs
merType: [],
induslevel: [],
visitWay_list: [],
customerType_list: [],
FormLoading: false,
listLoading: false,
// 翻页
listQuery: {
current: 1,
size: 5,
total: 0,
params: {
customerTypeKey: '',
levelKey: '',
mobile: '',
name: '',
remindStartDay: '',
remindEndtDay: '',
orgPath: '',
userSid: '',
menuUrl: ''
}
},
dialogVisible: false,
formobj: {
visitWay: '', // 联络方式
visitWayKey: '',
customerType: '', // 客户类型
customerTypeKey: '',
psid: ''
}
}
},
created() {
// 初始化变量
this.init()
this.getList()
},
mounted() {
this.$refs['btnbar'].setButtonList(this.btnList)
},
methods: {
init() {
typeValues({ type: 'visitWay' }).then((res) => {
if (res.success) {
this.visitWay_list = res.data
}
})
typeValues({ type: 'customerType' }).then((res) => {
if (res.success) {
this.customerType_list = res.data
}
})
typeValues({ type: 'customerType' }).then((res) => {
if (res.success) {
this.merType = res.data
}
})
typeValues({ type: 'customerLevel' }).then((res) => {
if (res.success) {
this.induslevel = res.data
}
})
},
// 搜索条件效果
clicksearchShow() {
this.isSearchShow = !this.isSearchShow
if (this.isSearchShow) {
this.searchxianshitit = '隐藏查询条件'
} else {
this.searchxianshitit = '显示查询条件'
}
},
btnHandle(btnKey) {
console.log('XXXXXXXXXXXXXXX ' + btnKey)
switch (btnKey) {
case 'toAdd':
this.toAdd()
break
case 'toEdit':
this.toEdit()
break
case 'addVehicle':
this.addVehicle()
break
case 'doDel':
this.doDel()
break
case 'doExport':
this.doExport()
break
case 'doClose':
this.doClose()
break
default:
break
}
},
// 信息条数 获取点击时当前的sid
handleSelectionChange(row) {
const aa = []
row.forEach(element => {
aa.push(element.sid)
})
this.sids = aa
},
// 表中序号
indexMethod(index) {
var pagestart = (this.listQuery.current - 1) * this.listQuery.size
var pageindex = index + 1 + pagestart
return pageindex
},
// 查询列表信息
getList() {
this.listLoading = true
this.listQuery.params.userSid = window.sessionStorage.getItem('userSid')
this.listQuery.params.menuUrl = this.$route.path
this.listQuery.params.orgPath = window.sessionStorage.getItem('defaultOrgPath')
req.listPage(this.listQuery).then(response => {
this.listLoading = false
if (response.success) {
this.list = response.data.records
this.listQuery.total = response.data.total
} else {
this.list = []
this.listQuery.total = 0
}
})
},
// 查询按钮
handleFilter() {
this.listQuery.current = 1
this.getList()
},
// 点击重置
handleReset() {
this.listQuery = {
current: 1,
size: 5,
total: 0,
params: {
customerTypeKey: '',
levelKey: '',
mobile: '',
name: '',
remindStartDay: '',
remindEndtDay: '',
orgPath: '',
userSid: '',
menuUrl: ''
}
}
this.getList()
},
toAdd() {
this.dialogVisible = true
this.formobj = {
visitWay: '', // 联络方式
visitWayKey: '',
customerType: '', // 客户类型
customerTypeKey: '',
psid: ''
}
},
visitWayChange(value) {
const choose = this.visitWay_list.filter((item) => item.dictKey === value)
if (choose.length > 0 && choose !== null) {
this.formobj.visitWay = choose[0].dictValue
}
},
customerTypeChange(value) {
const choose = this.customerType_list.filter((item) => item.dictValue === value)
if (choose.length > 0 && choose !== null) {
this.formobj.customerTypeKey = choose[0].dictKey
this.formobj.psid = choose[0].sid
}
},
handleConfirm() {
if (this.formobj.customerType !== '' && this.formobj.visitWay !== '') {
this.dialogVisible = false
this.viewState = 2
this.$refs['divAdd'].showAdd(this.formobj)
} else {
this.$message({ showClose: true, message: '请填写联络方式和客户类型', type: 'warning' })
}
},
toEdit() {
if (this.sids.length === 1) {
this.viewState = 3
this.$refs['divAdd'].showEdit(this.sids[0])
} else {
this.$message({ showClose: true, type: 'error', message: '请选择一条记录进行操作' })
}
},
toInfo(row) {
this.viewState = 4
this.$refs['divInfo'].showInfo(row)
},
addVehicle() {
if (this.sids.length === 1) {
this.viewState = 6
this.$refs['divAddVehicle'].showAdd(this.sids[0])
} else {
this.$message({ showClose: true, type: 'error', message: '请选择一条记录进行操作' })
}
},
lookCar(row) {
this.viewState = 5
this.$refs['divVehicle'].showInfo(row)
},
doExport() {},
// 删除
doDel() {
if (this.sids.length === 0) {
this.$message({ showClose: true, type: 'error', message: '请选择至少一条记录进行删除操作' })
return
}
const tip = '请确认是否删除所选 ' + this.sids.length + ' 条记录?'
this.$confirm(tip, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const loading = this.$loading({
lock: true,
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
})
req.deleteBySids(this.sids).then(resp => {
if (resp.success) {
this.$message({ type: 'success', message: resp.msg, showClose: true })
}
this.getList()
loading.close()
}).catch(e => {
loading.close()
})
}).catch(() => {
})
},
// 修改、编辑、详情返回列表页面
resetState() {
this.viewState = 1
},
doClose() {
this.$store.dispatch('tagsView/delView', this.$route)
this.$router.go(-1)
}
}
}
</script>
<style scoped>
.span-sty {
width: 100px !important;
}
.addinputInfo {
margin-left: 90px !important;
}
</style>

511
yxt-as-ui/src/views/client/customermanagement/customermanagementAdd.vue
View File

@ -0,0 +1,511 @@
<template>
<div class="app-container">
<div v-show="viewState == 1">
<div class="tab-header webtop">
<div>{{ viewTitle }}</div>
<div>
<el-button type="primary" size="small" :disabled="submitdisabled" @click="saveOrUpdate()">保存</el-button>
<el-button type="info" size="small" @click="handleReturn()">关闭</el-button>
</div>
</div>
<div class="listconadd">
<el-form ref="form_obj" :model="formobj" :rules="rules" class="formaddcopy02">
<el-row style="border-top: 1px solid #e0e3eb">
<el-col :span="12">
<div class="span-sty"><span>*</span>客户名称</div>
<el-form-item prop="name"><el-input class="addinputInfo" :disabled="formobj.sid !== ''" style="width: 30%" v-model="formobj.name" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">客户类型</div>
<el-form-item><span class="addinputInfo">{{ formobj.customerType }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty"><span>*</span>联系电话</div>
<el-form-item prop="mobile"><el-input class="addinputInfo" :disabled="formobj.sid !== ''" style="width: 30%" v-model="formobj.mobile" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">微信号</div>
<el-form-item><el-input class="addinputInfo" style="width: 30%" v-model="formobj.weixin" clearable placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row v-if="formobj.customerType == '个人'">
<el-col :span="24">
<div class="span-sty">公司名称</div>
<el-form-item>
<el-select class="addinputInfo" v-model="formobj.customerOrgSid" filterable clearable placeholder="" @change="customerOrgChange">
<el-option v-for="item in customerOrg_list" :key="item.sid" :label="item.orgName" :value="item.sid"/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty">客户地址</div>
<el-form-item>
<div class="addinputInfo" style="display: flex;flex-direction: row;justify-content: flex-start;align-items: center">
<el-select v-model="formobj.province" filterable clearable placeholder="请选择省" style="width:160px" @change="provinceChange">
<el-option v-for="item in province_list" :key="item.sid" :label="item.name" :value="item.name"/>
</el-select>
<el-select v-model="formobj.city" filterable placeholder="请选择市" style="width:160px" @change="cityChange">
<el-option v-for="item in city_list" :key="item.sid" :label="item.name" :value="item.name"/>
</el-select>
<el-select v-model="formobj.county" filterable placeholder="请选择县" style="width:160px" @change="countyChange">
<el-option v-for="item in county_list" :key="item.sid" :label="item.name" :value="item.name"/>
</el-select>
<el-input style="width: 30%" v-model="formobj.address" clearable placeholder=""/>
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">客户级别</div>
<el-form-item>
<el-select v-model="formobj.levelKey" class="addinputInfo" clearable filterable placeholder="" @change="levelChange">
<el-option v-for="item in level_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">是否开启提醒</div>
<el-form-item>
<el-radio-group class="addinputInfo" :disabled="formobj.sid !== ''" v-model="formobj.isOnRemind" @change="isOnRemindChange">
<el-radio label="是">是</el-radio>
<el-radio label="否">否</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row v-show="formobj.isOnRemind == '是'">
<el-col :span="12">
<div class="span-sty">提醒日期</div>
<el-form-item><el-date-picker class="addinputInfo" v-model="formobj.remind_day" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="选择日期" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">提醒备注</div>
<el-form-item><el-input class="addinputInfo addinputw" v-model="formobj.remind_remark" clearable placeholder="" /></el-form-item>
</el-col>
</el-row>
<div class="title">更多信息</div>
<el-row v-if="formobj.customerType == '个人'">
<el-col :span="12">
<div class="span-sty">客户生日</div>
<el-form-item><el-date-picker class="addinputInfo" v-model="formobj.birthday" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="选择日期" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">性别</div>
<el-form-item>
<el-radio-group class="addinputInfo" v-model="formobj.sex" @change="sexChange">
<el-radio v-for="item in sex_list" :key="item.dictKey" :label="item.dictValue">{{ item.dictValue }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">证件类型</div>
<el-form-item><span class="addinputInfo">{{ formobj.certificateType }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">证件号码</div>
<el-form-item><el-input class="addinputInfo addinputw" style="width: 30%" v-model="formobj.idnumber" clearable placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">证件有效期</div>
<el-form-item><el-date-picker class="addinputInfo" v-model="formobj.endDate" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="选择日期" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">电子邮箱</div>
<el-form-item><el-input class="addinputInfo addinputw" style="width: 30%" v-model="formobj.e_mail" clearable placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">紧急联系人</div>
<el-form-item><el-input class="addinputInfo addinputw" style="width: 30%" v-model="formobj.emergencyContact" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">紧急联系电话</div>
<el-form-item><el-input class="addinputInfo addinputw" style="width: 30%" v-model="formobj.emergencyMobile" clearable placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">客户来源</div>
<el-form-item>
<el-select v-model="formobj.sourceKey" class="addinputInfo" clearable filterable placeholder="" @change="sourceChange">
<el-option v-for="item in source_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">客户分类</div>
<el-form-item>
<el-select v-model="formobj.customerClassKey" class="addinputInfo" clearable filterable placeholder="" @change="customerClassChange">
<el-option v-for="item in customerClass_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty">备注</div>
<el-form-item><el-input class="addinputInfo addinputw" v-model="formobj.remarks" clearable placeholder="" /></el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
</div>
</template>
<script>
import req from '@/api/client/customermanagement'
import { getProvince, getCity, getCounty, typeValues } from '@/api/Common/dictcommons'
export default {
name: 'CustomerManagementAdd',
data() {
return {
viewTitle: '',
viewState: 1,
submitdisabled: false,
customerOrg_list: [],
province_list: [],
city_list: [],
county_list: [],
level_list: [],
sex_list: [],
source_list: [],
customerClass_list: [],
formobj: {
name: '',
customerType: '',
customerTypeKey: '',
visitWay: '',
visitWayKey: '',
mobile: '',
weixin: '',
province: '',
city: '',
county: '',
address: '',
level: '',
levelKey: '',
isOnRemind: '',
isOnRemindKey: '',
remind_day: '',
remind_remark: '',
birthday: '',
sex: '',
sexKey: '',
certificateType: '',
certificateTypeKey: '',
idnumber: '',
endDate: '',
e_mail: '',
emergencyContact: '',
emergencyMobile: '',
source: '',
sourceKey: '',
customerClass: '',
customerClassKey: '',
remarks: '',
userSid: '',
orgPath: '',
useOrgSid: '',
sid: '',
customerOrgName: '',
customerOrgSid: ''
},
rules: {
name: [{ required: true, message: '客户名称不能为空', trigger: 'blur' }],
mobile: [{ required: true, message: '联系电话不能为空', trigger: 'blur' }]
}
}
},
methods: {
init() {
getProvince().then((res) => {
if (res.success) {
this.province_list = res.data
}
})
typeValues({ type: 'customerLevel' }).then((res) => {
if (res.success) {
this.level_list = res.data
}
})
typeValues({ type: 'sex' }).then((res) => {
if (res.success) {
this.sex_list = res.data
}
})
typeValues({ type: 'customerSource' }).then((res) => {
if (res.success) {
this.source_list = res.data
}
})
req.selCustomerOrgList({ useOrgSid: window.sessionStorage.getItem('defaultOrgPath').substring(window.sessionStorage.getItem('defaultOrgPath').lastIndexOf('/') + 1) }).then((res) => {
if (res.success) {
this.customerOrg_list = res.data
}
})
},
customerOrgChange(value) {
const choose = this.customerOrg_list.filter((item) => item.sid === value)
if (choose.length > 0 && choose !== null) {
this.formobj.customerOrgName = choose[0].orgName
} else {
this.formobj.customerOrgName = ''
}
},
provinceChange(value) {
const choose = this.province_list.filter((item) => item.name === value)
if (choose !== null && choose.length > 0) {
this.formobj.provinceSid = choose[0].sid
this.getCity(this.formobj.provinceSid)
} else {
this.formobj.provinceSid = ''
this.formobj.citySid = ''
this.formobj.city = ''
this.city_list = []
this.formobj.county = ''
this.formobj.countySid = ''
this.county_list = []
}
},
getCity(val) {
getCity({ sid: val }).then((res) => {
if (res.success) {
this.city_list = res.data
}
})
},
cityChange(value) {
const choose = this.city_list.filter((item) => item.name === value)
if (choose !== null && choose.length > 0) {
this.formobj.citySid = choose[0].sid
this.getCounty(this.formobj.citySid)
}
},
getCounty(val) {
getCounty({ sid: val }).then((res) => {
if (res.success) {
this.county_list = res.data
}
})
},
countyChange(value) {
const choose = this.county_list.filter((item) => item.name === value)
if (choose !== null && choose.length > 0) {
this.formobj.countySid = choose[0].sid
}
},
showAdd(value) {
this.viewTitle = '【新增】客户信息'
this.$nextTick(() => {
this.$refs['form_obj'].clearValidate()
})
this.init()
this.formobj.isOnRemind = '否'
this.formobj.isOnRemindKey = '0'
this.formobj.customerType = value.customerType
this.formobj.customerTypeKey = value.customerTypeKey
this.formobj.visitWay = value.visitWay
this.formobj.visitWayKey = value.visitWayKey
this.formobj.userSid = window.sessionStorage.getItem('userSid')
this.formobj.orgPath = window.sessionStorage.getItem('defaultOrgPath')
this.formobj.useOrgSid = window.sessionStorage.getItem('defaultOrgPath').substring(window.sessionStorage.getItem('defaultOrgPath').lastIndexOf('/') + 1)
if (this.formobj.customerType === '个人') {
this.formobj.certificateType = '身份证'
this.formobj.certificateTypeKey = '01'
} else {
this.formobj.certificateType = '营业执照'
this.formobj.certificateTypeKey = '02'
}
typeValues({ psid: value.psid, type: 'customerClass' }).then((res) => {
if (res.success) {
this.customerClass_list = res.data
}
})
},
showEdit(sid) {
this.viewTitle = '【编辑】客户信息'
this.$nextTick(() => {
this.$refs['form_obj'].clearValidate()
})
this.init()
req.fetchDetailsBySid(sid).then((res) => {
if (res.success) {
this.formobj = res.data
typeValues({ type: 'customerType' }).then((resp) => {
if (resp.success) {
this.customerType_list = resp.data
this.customerType_list.forEach((e) => {
if (e.dictValue === this.formobj.customerType) {
typeValues({ psid: e.sid, type: 'customerClass' }).then((respsone) => {
if (respsone.success) {
this.customerClass_list = respsone.data
}
})
}
})
}
})
}
})
},
levelChange(value) {
const choose = this.level_list.filter((item) => item.dictKey === value)
if (choose.length > 0 && choose !== null) {
this.formobj.level = choose[0].dictValue
} else {
this.formobj.level = ''
}
},
isOnRemindChange(val) {
if (val === '是') {
this.formobj.isOnRemindKey = '1'
} else if (val === '否') {
this.formobj.isOnRemindKey = '0'
}
},
sexChange(value) {
const choose = this.sex_list.filter((item) => item.dictValue === value)
if (choose.length > 0 && choose !== null) {
this.formobj.sexKey = choose[0].dictKey
}
},
sourceChange(value) {
const choose = this.source_list.filter((item) => item.dictKey === value)
if (choose.length > 0 && choose !== null) {
this.formobj.source = choose[0].dictValue
} else {
this.formobj.source = ''
}
},
customerClassChange(value) {
const choose = this.customerClass_list.filter((item) => item.dictKey === value)
if (choose.length > 0 && choose !== null) {
this.formobj.customerClass = choose[0].dictValue
} else {
this.formobj.customerClass = ''
}
},
saveOrUpdate() {
this.$refs['form_obj'].validate((valid) => {
if (valid) {
if (this.formobj.customerType === '企业' && this.formobj.name.length < 5) {
this.$message({ showClose: true, type: 'error', message: '因客户类型为企业,客户名称的长度应不少于5个汉字' })
return
}
this.submitdisabled = true
if (this.formobj.sid === '') {
const tip = '客户名称、联系电话一经保存，无法修改，是否继续保存'
this.$confirm(tip, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
console.log(this.formobj)
req.save(this.formobj).then((res) => {
if (res.success) {
this.$message({ showClose: true, type: 'success', message: '保存成功' })
this.handleReturn('true')
} else {
this.submitdisabled = false
}
}).catch(() => {
this.submitdisabled = false
})
})
} else {
req.update(this.formobj).then((res) => {
if (res.success) {
this.$message({ showClose: true, type: 'success', message: '保存成功' })
this.handleReturn('true')
} else {
this.submitdisabled = false
}
}).catch(() => {
this.submitdisabled = false
})
}
}
})
},
handleReturn(isreload) {
if (isreload === 'true') this.$emit('reloadlist')
this.formobj = {
name: '',
customerType: '',
customerTypeKey: '',
visitWay: '',
visitWayKey: '',
mobile: '',
weixin: '',
province: '',
city: '',
county: '',
address: '',
level: '',
levelKey: '',
isOnRemind: '',
isOnRemindKey: '',
remind_day: '',
remind_remark: '',
birthday: '',
sex: '',
sexKey: '',
certificateType: '',
certificateTypeKey: '',
idnumber: '',
endDate: '',
e_mail: '',
emergencyContact: '',
emergencyMobile: '',
source: '',
sourceKey: '',
customerClass: '',
customerClassKey: '',
remarks: '',
userSid: '',
orgPath: '',
useOrgSid: '',
sid: '',
customerOrgName: '',
customerOrgSid: ''
}
this.submitdisabled = false
this.$emit('doback')
}
}
}
</script>
<style scoped>
.span-sty {
width: 130px !important;
}
.addinputInfo {
margin-left: 120px !important;
}
.formaddcopy02 .el-row .el-col /deep/ .el-form-item .addinputw {
margin-left: 120px !important;
width: calc(100% - 115px);
}
/deep/ .el-form-item__error {
margin-left: 120px !important;
}
.formaddcopy02 .el-row .el-col /deep/ .el-form-item .el-radio-group {
display: inline;
line-height: 1px;
vertical-align: middle;
}
</style>

245
yxt-as-ui/src/views/client/customermanagement/customermanagementInfo.vue
View File

@ -0,0 +1,245 @@
<template>
<div class="app-container">
<div v-show="viewState == 1">
<div class="tab-header webtop">
<div>{{ viewTitle }}</div>
<div>
<el-button type="info" size="small" @click="handleReturn()">关闭</el-button>
</div>
</div>
<div class="listconadd">
<el-form ref="form_obj" :model="formobj" :rules="rules" class="formaddcopy02">
<el-row style="border-top: 1px solid #e0e3eb">
<el-col :span="12">
<div class="span-sty">客户名称</div>
<el-form-item><span class="addinputInfo">{{ formobj.name }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">客户类型</div>
<el-form-item><span class="addinputInfo">{{ formobj.customerType }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">联系电话</div>
<el-form-item><span class="addinputInfo">{{ formobj.mobile }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">微信号</div>
<el-form-item><span class="addinputInfo">{{ formobj.weixin }}</span></el-form-item>
</el-col>
</el-row>
<el-row v-if="formobj.customerType == '个人'">
<el-col :span="24">
<div class="span-sty">公司名称</div>
<el-form-item><span class="addinputInfo">{{ formobj.customerOrgName }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty">客户地址</div>
<el-form-item><span class="addinputInfo">{{ formobj.province }}{{ formobj.city }}{{ formobj.county }}{{ formobj.address }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">客户级别</div>
<el-form-item><span class="addinputInfo">{{ formobj.level }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">是否开启提醒</div>
<el-form-item><span class="addinputInfo">{{ formobj.isOnRemind }}</span></el-form-item>
</el-col>
</el-row>
<el-row v-show="formobj.isOnRemind == '是'">
<el-col :span="12">
<div class="span-sty">提醒日期</div>
<el-form-item><span class="addinputInfo">{{ formobj.remind_day }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">提醒备注</div>
<el-form-item><span class="addinputInfo">{{ formobj.remind_remark }}</span></el-form-item>
</el-col>
</el-row>
<div class="title">更多信息</div>
<el-row v-if="formobj.customerType == '个人'">
<el-col :span="12">
<div class="span-sty">客户生日</div>
<el-form-item><span class="addinputInfo">{{ formobj.birthday }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">性别</div>
<el-form-item><span class="addinputInfo">{{ formobj.sex }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">证件类型</div>
<el-form-item><span class="addinputInfo">{{ formobj.certificateType }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">证件号码</div>
<el-form-item><span class="addinputInfo">{{ formobj.idnumber }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">证件有效期</div>
<el-form-item><span class="addinputInfo">{{ formobj.endDate }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">电子邮箱</div>
<el-form-item><span class="addinputInfo">{{ formobj.e_mail }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">紧急联系人</div>
<el-form-item><span class="addinputInfo">{{ formobj.emergencyContact }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">紧急联系电话</div>
<el-form-item><span class="addinputInfo">{{ formobj.emergencyMobile }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">客户来源</div>
<el-form-item><span class="addinputInfo">{{ formobj.source }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">客户分类</div>
<el-form-item><span class="addinputInfo">{{ formobj.customerClass }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty">备注</div>
<el-form-item><span class="addinputInfo">{{ formobj.remarks }}</span></el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
</div>
</template>
<script>
import req from '@/api/client/customermanagement'
export default {
name: 'CustomerManagementInfo',
data() {
return {
viewTitle: '',
viewState: 1,
formobj: {
name: '',
customerType: '',
customerTypeKey: '',
visitWay: '',
visitWayKey: '',
mobile: '',
weixin: '',
province: '',
city: '',
county: '',
address: '',
level: '',
levelKey: '',
isOnRemind: '',
isOnRemindKey: '',
remind_day: '',
remind_remark: '',
birthday: '',
sex: '',
sexKey: '',
certificateType: '',
certificateTypeKey: '',
idnumber: '',
endDate: '',
e_mail: '',
emergencyContact: '',
emergencyMobile: '',
source: '',
sourceKey: '',
customerClass: '',
customerClassKey: '',
remarks: '',
userSid: '',
orgPath: '',
useOrgSid: '',
sid: '',
customerOrgName: '',
customerOrgSid: ''
},
rules: {}
}
},
methods: {
showInfo(row) {
this.viewTitle = '客户信息详情'
this.$nextTick(() => {
this.$refs['form_obj'].clearValidate()
})
req.fetchDetailsBySid(row.sid).then((res) => {
if (res.success) {
this.formobj = res.data
}
})
},
handleReturn() {
this.formobj = {
name: '',
customerType: '',
customerTypeKey: '',
visitWay: '',
visitWayKey: '',
mobile: '',
weixin: '',
province: '',
city: '',
county: '',
address: '',
level: '',
levelKey: '',
isOnRemind: '',
isOnRemindKey: '',
remind_day: '',
remind_remark: '',
birthday: '',
sex: '',
sexKey: '',
certificateType: '',
certificateTypeKey: '',
idnumber: '',
endDate: '',
e_mail: '',
emergencyContact: '',
emergencyMobile: '',
source: '',
sourceKey: '',
customerClass: '',
customerClassKey: '',
remarks: '',
userSid: '',
orgPath: '',
useOrgSid: '',
sid: '',
customerOrgName: '',
customerOrgSid: ''
}
this.$emit('doback')
}
}
}
</script>
<style scoped>
.span-sty {
width: 130px !important;
}
.addinputInfo {
margin-left: 120px !important;
}
</style>

148
yxt-as-ui/src/views/client/customermanagement/relation/vehicle.vue
View File

@ -0,0 +1,148 @@
<template>
<div class="app-container">
<div v-show="viewState == 1">
<div class="tab-header webtop">
<div>{{ viewTitle }}</div>
<div>
<el-button type="primary" size="small" @click="handleEdit()">编辑</el-button>
<el-button type="danger" size="small" @click="handleDelete()">删除</el-button>
<el-button type="info" size="small" @click="handleReturn()">关闭</el-button>
</div>
</div>
<div class="listconadd">
<el-form ref="form_obj" :model="formobj" class="formaddcopy02">
<div class="title ">车辆列表</div>
<el-table :key="tableKey" :data="formobj.list" :index="index" border style="width: 100%" @selection-change="handleSelectionChange">
<el-table-column type="selection" align="center" width="50"/>
<el-table-column fixed width="60" label="序号" type="index" :index="index + 1" align="center"/>
<el-table-column fixed label="操作" align="center" width="100">
<template slot-scope="scope">
<el-button type="primary" size="small" @click="toInfo(scope.row)">查看</el-button>
</template>
</el-table-column>
<el-table-column prop="vehMark" label="车牌号" align="center" min-width="140" />
<el-table-column prop="vinNo" label="车架号" align="center" min-width="150" />
<el-table-column prop="buyDate" label="购车日期" align="center" width="120" />
<el-table-column prop="lastMileage" label="上次保养里程" align="center" width="140" />
<el-table-column prop="nextMaintainDate" label="下次保养日期" align="center" width="140" />
</el-table>
</el-form>
</div>
</div>
<!-- 编辑车辆信息 -->
<vehicleAdd v-show="viewState == 2" ref="divAdd" @doback="resetState" @reloadlist="reload" />
<!-- 查看车辆详情 -->
<vehicleInfo v-show="viewState == 3" ref="divInfo" @doback="resetState" />
</div>
</template>
<script>
import req from '@/api/client/customermanagement'
import vehicleAdd from './vehicleAdd'
import vehicleInfo from './vehicleInfo'
export default {
name: 'Vehicle',
components: {
vehicleAdd,
vehicleInfo
},
data() {
return {
viewTitle: '',
viewState: 1,
submitdisabled: false,
tableKey: 1,
index: 0,
sids: [],
formobj: {
sid: '',
list: []
}
}
},
methods: {
showInfo(row) {
this.viewTitle = '车辆信息'
this.$nextTick(() => {
this.$refs['form_obj'].clearValidate()
})
this.formobj.sid = row.sid
req.vehList({ sid: row.sid }).then((res) => {
if (res.success) {
this.formobj.list = res.data
}
})
},
// 信息条数 获取点击时当前的sid
handleSelectionChange(row) {
const aa = []
row.forEach(element => {
aa.push(element.customerVehSid)
})
this.sids = aa
},
handleEdit() {
if (this.sids.length === 1) {
this.viewState = 2
this.$refs['divAdd'].showEdit(this.sids[0])
} else {
this.$message({ showClose: true, type: 'error', message: '请选择一条记录进行操作' })
}
},
handleDelete() {
if (this.sids.length === 0) {
this.$message({ showClose: true, type: 'error', message: '请选择至少一条记录进行删除操作' })
return
}
const tip = '请确认是否删除所选 ' + this.sids.length + ' 条记录?'
this.$confirm(tip, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const loading = this.$loading({
lock: true,
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
})
req.delBySids(this.sids).then((resp) => {
if (resp.success) {
this.$message({ type: 'success', message: resp.msg, showClose: true })
}
this.reload()
loading.close()
}).catch(e => {
loading.close()
})
}).catch(() => {
})
},
toInfo(row) {
this.viewState = 3
this.$refs['divInfo'].showInfo(row.customerVehSid)
},
reload() {
req.vehList({ sid: this.formobj.sid }).then((res) => {
if (res.success) {
this.formobj.list = res.data
}
})
},
resetState() {
this.viewState = 1
},
handleReturn() {
this.formobj = {
sid: '',
list: []
}
this.submitdisabled = false
this.$emit('doback')
}
}
}
</script>
<style scoped></style>

302
yxt-as-ui/src/views/client/customermanagement/relation/vehicleAdd.vue
View File

@ -0,0 +1,302 @@
<template>
<div class="app-container">
<div v-show="viewState == 1">
<div class="tab-header webtop">
<div>{{ viewTitle }}</div>
<div>
<el-button type="primary" size="small" :disabled="submitdisabled" @click="saveOrUpdate()">保存</el-button>
<el-button type="info" size="small" @click="handleReturn()">关闭</el-button>
</div>
</div>
<div class="listconadd">
<el-form ref="form_obj" :model="formobj" :rules="rules" class="formaddcopy02">
<div class="title">车辆信息</div>
<el-row style="border-top: 1px solid #e0e3eb">
<el-col :span="12">
<div class="span-sty">车牌号</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" v-model="formobj.vehMark" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">车架号</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" v-model="formobj.vinNo" clearable placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">发动机号</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" v-model="formobj.engineNo" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">车型</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" v-model="formobj.vehModel" clearable placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">购车日期</div>
<el-form-item> <el-date-picker class="addinputInfo" value-format="yyyy-MM-dd" v-model="formobj.buyDate" clearable type="date" placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">行驶里程</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" @keyup.native="formobj.mileage = getNumber(formobj.mileage, 2)" v-model="formobj.mileage" clearable placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">上次保养里程</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" @keyup.native="formobj.lastMileage = getNumber(formobj.lastMileage, 2)" v-model="formobj.lastMileage" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">下次保养日期</div>
<el-form-item> <el-date-picker class="addinputInfo" value-format="yyyy-MM-dd" v-model="formobj.nextMaintainDate" clearable type="date" placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">商业险到期日期</div>
<el-form-item> <el-date-picker class="addinputInfo" value-format="yyyy-MM-dd" v-model="formobj.commercialInsuranceEndDate" clearable type="date" placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">交强险到期日期</div>
<el-form-item> <el-date-picker class="addinputInfo" value-format="yyyy-MM-dd" v-model="formobj.compulsoryInsuranceEndDate" clearable type="date" placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty">备注</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" v-model="formobj.remarks" clearable placeholder="" /></el-form-item>
</el-col>
</el-row>
<div class="title">保养到期明细</div>
<el-row>
<el-col :span="12">
<div class="span-sty">行驶里程</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" @keyup.native="formobj.currentMileage = getNumber(formobj.currentMileage, 2)" v-model="formobj.currentMileage" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">每月公里</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" @keyup.native="formobj.monthKm = getNumber(formobj.monthKm, 2)" v-model="formobj.monthKm" clearable placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">滤芯到期公里</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" @keyup.native="formobj.filter_km = getNumber(formobj.filter_km, 2)" v-model="formobj.filter_km" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">滤芯到期日期</div>
<el-form-item> <el-date-picker class="addinputInfo" value-format="yyyy-MM-dd" v-model="formobj.filter_date" clearable type="date" placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">机油到期公里</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" @keyup.native="formobj.engineoil_km = getNumber(formobj.engineoil_km, 2)" v-model="formobj.engineoil_km" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">机油到期日期</div>
<el-form-item> <el-date-picker class="addinputInfo" value-format="yyyy-MM-dd" v-model="formobj.engineoil_date" clearable type="date" placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">齿轮油到期公里</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" @keyup.native="formobj.gearoil_km = getNumber(formobj.gearoil_km, 2)" v-model="formobj.gearoil_km" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">齿轮油到期日期</div>
<el-form-item> <el-date-picker class="addinputInfo" value-format="yyyy-MM-dd" v-model="formobj.gearoil_date" clearable type="date" placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">宝轮到期公里</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" @keyup.native="formobj.treasurewheel_km = getNumber(formobj.treasurewheel_km, 2)" v-model="formobj.treasurewheel_km" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">宝轮到期日期</div>
<el-form-item> <el-date-picker class="addinputInfo" value-format="yyyy-MM-dd" v-model="formobj.treasurewheel_date" clearable type="date" placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">风扇皮带到期公里</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" @keyup.native="formobj.fanbelt_km = getNumber(formobj.fanbelt_km, 2)" v-model="formobj.fanbelt_km" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">风扇皮带到期日期</div>
<el-form-item> <el-date-picker class="addinputInfo" value-format="yyyy-MM-dd" v-model="formobj.fanbelt_date" clearable type="date" placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">刹车片带到期公里</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" @keyup.native="formobj.brakepads_km = getNumber(formobj.brakepads_km, 2)" v-model="formobj.brakepads_km" clearable placeholder="" /></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">刹车片带到期日期</div>
<el-form-item> <el-date-picker class="addinputInfo" value-format="yyyy-MM-dd" v-model="formobj.brakepads_date" clearable type="date" placeholder="" /></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty">备注</div>
<el-form-item><el-input class="addinputInfo" style="width: 40%" v-model="formobj.remarks" clearable placeholder="" /></el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
</div>
</template>
<script>
import req from '@/api/client/customermanagement'
export default {
name: 'VehicleAdd',
data() {
return {
viewTitle: '',
viewState: 1,
submitdisabled: false,
formobj: {
customerVehSid: '',
customerSid: '',
vehMark: '',
vinNo: '',
engineNo: '',
vehModelSid: '',
vehModel: '',
mileage: '',
lastMileage: '',
nextMaintainDate: '',
buyDate: '',
commercialInsuranceEndDate: '',
compulsoryInsuranceEndDate: '',
currentMileage: '',
monthKm: '',
filter_km: '',
filter_date: '',
engineoil_km: '',
engineoil_date: '',
gearoil_km: '',
gearoil_date: '',
treasurewheel_km: '',
treasurewheel_date: '',
fanbelt_km: '',
fanbelt_date: '',
brakepads_km: '',
brakepads_date: ''
},
rules: {}
}
},
methods: {
showAdd(sid) {
this.viewTitle = '【新增】车辆'
this.$nextTick(() => {
this.$refs['form_obj'].clearValidate()
})
this.formobj.customerSid = sid
},
showEdit(sid) {
this.viewTitle = '【编辑】车辆'
this.$nextTick(() => {
this.$refs['form_obj'].clearValidate()
})
req.details(sid).then((res) => {
if (res.success) {
this.formobj = res.data
}
})
},
getNumber(val, limit) {
val = val.replace(/[^0-9.]/g, '') // 保留数字
val = val.replace(/^00/, '0.') // 开头不能有两个0
val = val.replace(/^\./g, '0.') // 开头为小数点转换为0.
val = val.replace(/\.{2,}/g, '.') // 两个以上的小数点转换成一个
val = val.replace('.', '$#$').replace(/\./g, '').replace('$#$', '.'); // 只保留一个小数点
/^0\d+/.test(val) ? val = val.slice(1) : '' // 两位以上数字开头不能为0
const str = '^(\\d+)\\.(\\d{' + limit + '}).*$'
const reg = new RegExp(str)
if (limit === 0) {
// 不需要小数点
val = val.replace(reg, '$1')
} else {
// 通过正则保留小数点后指定的位数
val = val.replace(reg, '$1.$2')
}
return val
},
saveOrUpdate() {
this.$refs['form_obj'].validate((valid) => {
if (valid) {
this.submitdisabled = true
this.formobj.payableAmount = this.yfTotal
req.saveCustomerVeh(this.formobj).then((res) => {
if (res.success) {
this.$message({ showClose: true, type: 'success', message: '保存成功' })
this.handleReturn('true')
} else {
this.submitdisabled = false
}
}).catch(() => {
this.submitdisabled = false
})
}
})
},
handleReturn(isreload) {
if (isreload === 'true') this.$emit('reloadlist')
this.formobj = {
customerVehSid: '',
customerSid: '',
vehMark: '',
vinNo: '',
engineNo: '',
vehModelSid: '',
vehModel: '',
mileage: '',
lastMileage: '',
nextMaintainDate: '',
buyDate: '',
commercialInsuranceEndDate: '',
compulsoryInsuranceEndDate: '',
currentMileage: '',
monthKm: '',
filter_km: '',
filter_date: '',
engineoil_km: '',
engineoil_date: '',
gearoil_km: '',
gearoil_date: '',
treasurewheel_km: '',
treasurewheel_date: '',
fanbelt_km: '',
fanbelt_date: '',
brakepads_km: '',
brakepads_date: ''
}
this.submitdisabled = false
this.$emit('doback')
},
}
}
</script>
<style scoped>
.span-sty {
width: 130px !important;
}
.addinputInfo {
margin-left: 120px !important;
}
/deep/ .el-form-item__error {
margin-left: 120px !important;
}
.formaddcopy02 .el-row .el-col /deep/ .el-form-item .addinputw {
margin-left: 120px !important;
width: calc(100% - 115px);
}
</style>

245
yxt-as-ui/src/views/client/customermanagement/relation/vehicleInfo.vue
View File

@ -0,0 +1,245 @@
<template>
<div class="app-container">
<div v-show="viewState == 1">
<div class="tab-header webtop">
<div>{{ viewTitle }}</div>
<div>
<el-button type="info" size="small" @click="handleReturn()">关闭</el-button>
</div>
</div>
<div class="listconadd">
<el-form ref="form_obj" :model="formobj" :rules="rules" class="formaddcopy02">
<div class="title">车辆信息</div>
<el-row style="border-top: 1px solid #e0e3eb">
<el-col :span="12">
<div class="span-sty">车牌号</div>
<el-form-item><span class="addinputInfo">{{ formobj.vehMark }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">车架号</div>
<el-form-item><span class="addinputInfo">{{ formobj.vinNo }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">发动机号</div>
<el-form-item><span class="addinputInfo">{{ formobj.engineNo }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">车型</div>
<el-form-item><span class="addinputInfo">{{ formobj.vehModel }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">购车日期</div>
<el-form-item><span class="addinputInfo">{{ formobj.buyDate }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">行驶里程</div>
<el-form-item><span class="addinputInfo">{{ formobj.mileage }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">上次保养里程</div>
<el-form-item><span class="addinputInfo">{{ formobj.lastMileage }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">下次保养日期</div>
<el-form-item><span class="addinputInfo">{{ formobj.nextMaintainDate }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">商业险到期日期</div>
<el-form-item><span class="addinputInfo">{{ formobj.commercialInsuranceEndDate }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">交强险到期日期</div>
<el-form-item><span class="addinputInfo">{{ formobj.compulsoryInsuranceEndDate }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty">备注</div>
<el-form-item><span class="addinputInfo">{{ formobj.remarks }}</span></el-form-item>
</el-col>
</el-row>
<div class="title">保养到期明细</div>
<el-row>
<el-col :span="12">
<div class="span-sty">行驶里程</div>
<el-form-item><span class="addinputInfo">{{ formobj.currentMileage }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">每月公里</div>
<el-form-item><span class="addinputInfo">{{ formobj.monthKm }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">滤芯到期公里</div>
<el-form-item><span class="addinputInfo">{{ formobj.filter_km }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">滤芯到期日期</div>
<el-form-item><span class="addinputInfo">{{ formobj.filter_date }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">机油到期公里</div>
<el-form-item><span class="addinputInfo">{{ formobj.engineoil_km }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">机油到期日期</div>
<el-form-item><span class="addinputInfo">{{ formobj.engineoil_date }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">齿轮油到期公里</div>
<el-form-item><span class="addinputInfo">{{ formobj.gearoil_km }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">齿轮油到期日期</div>
<el-form-item><span class="addinputInfo">{{ formobj.gearoil_date }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">宝轮到期公里</div>
<el-form-item><span class="addinputInfo">{{ formobj.treasurewheel_km }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">宝轮到期日期</div>
<el-form-item><span class="addinputInfo">{{ formobj.treasurewheel_date }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">风扇皮带到期公里</div>
<el-form-item><span class="addinputInfo">{{ formobj.fanbelt_km }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">风扇皮带到期日期</div>
<el-form-item><span class="addinputInfo">{{ formobj.fanbelt_date }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty">刹车片带到期公里</div>
<el-form-item><span class="addinputInfo">{{ formobj.brakepads_km }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty">刹车片带到期日期</div>
<el-form-item><span class="addinputInfo">{{ formobj.brakepads_date }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty">备注</div>
<el-form-item><span class="addinputInfo">{{ formobj.remarks }}</span></el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
</div>
</template>
<script>
import req from '@/api/client/customermanagement'
export default {
name: 'VehicleInfo',
data() {
return {
viewTitle: '',
viewState: 1,
formobj: {
customerVehSid: '',
customerSid: '',
vehMark: '',
vinNo: '',
engineNo: '',
vehModelSid: '',
vehModel: '',
mileage: '',
lastMileage: '',
nextMaintainDate: '',
buyDate: '',
commercialInsuranceEndDate: '',
compulsoryInsuranceEndDate: '',
currentMileage: '',
monthKm: '',
filter_km: '',
filter_date: '',
engineoil_km: '',
engineoil_date: '',
gearoil_km: '',
gearoil_date: '',
treasurewheel_km: '',
treasurewheel_date: '',
fanbelt_km: '',
fanbelt_date: '',
brakepads_km: '',
brakepads_date: ''
},
rules: {}
}
},
methods: {
showInfo(sid) {
this.viewTitle = '车辆'
req.details(sid).then((res) => {
if (res.success) {
this.formobj = res.data
}
})
},
handleReturn() {
this.formobj = {
customerVehSid: '',
customerSid: '',
vehMark: '',
vinNo: '',
engineNo: '',
vehModelSid: '',
vehModel: '',
mileage: '',
lastMileage: '',
nextMaintainDate: '',
buyDate: '',
commercialInsuranceEndDate: '',
compulsoryInsuranceEndDate: '',
currentMileage: '',
monthKm: '',
filter_km: '',
filter_date: '',
engineoil_km: '',
engineoil_date: '',
gearoil_km: '',
gearoil_date: '',
treasurewheel_km: '',
treasurewheel_date: '',
fanbelt_km: '',
fanbelt_date: '',
brakepads_km: '',
brakepads_date: ''
}
this.$emit('doback')
}
}
}
</script>
<style scoped>
.span-sty {
width: 130px !important;
}
.addinputInfo {
margin-left: 120px !important;
}
</style>
Write Preview
Loading…
Cancel
Save