|
|
@@ -5,13 +5,14 @@
|
|
|
<div class="filter-container">
|
|
|
<el-input clearable class="filter-item" style="width: 200px;" placeholder="公司名称" v-model="listQuery.companyName">
|
|
|
</el-input>
|
|
|
- <el-select class="filter-item" style="width: 200px" v-model="listQuery.companyLevel" filterable placeholder="分销商等级">
|
|
|
+ <el-select class="filter-item" style="width: 200px" v-model="listQuery.companyLevel" filterable
|
|
|
+ placeholder="分销商等级">
|
|
|
<el-option :key="item.dictLabel" v-for="item in company_level" :label="item.dictLabel" :value="item.dictLabel">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
<el-select v-model="listQuery.status" clearable placeholder="状态" class="filter-item" style="width: 200px;">
|
|
|
- <el-option :key="item.type" v-for="item in statusList" :label="item.name" :value="item.type">
|
|
|
- </el-option>
|
|
|
+ <el-option :key="item.type" v-for="item in statusList" :label="item.name" :value="item.type">
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
<el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleQuery">查找</el-button>
|
|
|
<el-button class="filter-item" icon="el-icon-refresh" @click="resetQuery">重置</el-button>
|
|
|
@@ -48,18 +49,18 @@
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column align="center" min-width="50px" label="状态">
|
|
|
- <template slot-scope="props">
|
|
|
- <span v-if="props.row.status == 0" style="color: #67C23A;font-weight: bold;">启用</span>
|
|
|
- <span v-if="props.row.status == 1" style="color: #E6A23C;font-weight: bold;">停用</span>
|
|
|
- </template>
|
|
|
+ <template slot-scope="props">
|
|
|
+ <span v-if="props.row.status == 0" style="color: #67C23A;font-weight: bold;">启用</span>
|
|
|
+ <span v-if="props.row.status == 1" style="color: #E6A23C;font-weight: bold;">停用</span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column align="center" label="操作" width="250" class-name="small-padding fixed-width">
|
|
|
<template slot-scope="scope">
|
|
|
<el-button type="primary" size="small" @click="handleUpdate(scope.row)">编辑</el-button>
|
|
|
<el-button v-if="scope.row.status == 1" type="success" size="small"
|
|
|
- @click="changeState(scope.row.id, scope.row.status)">启用</el-button>
|
|
|
+ @click="changeState(scope.row.id, scope.row.status)">启用</el-button>
|
|
|
<el-button v-if="scope.row.status == 0" type="warning" size="small"
|
|
|
- @click="changeState(scope.row.id, scope.row.status)">停用</el-button>
|
|
|
+ @click="changeState(scope.row.id, scope.row.status)">停用</el-button>
|
|
|
<el-button type="danger" size="small" @click="handleDelete(scope.row)">删除</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
@@ -77,28 +78,31 @@
|
|
|
<el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="600px">
|
|
|
<el-form :rules="rules" ref="dataForm" :model="dataForm" status-icon label-position="left" label-width="110px">
|
|
|
<el-form-item label="分销商编号" prop="customerCode">
|
|
|
- <el-input v-model="dataForm.customerCode" placeholder="请输入"></el-input>
|
|
|
+ <el-input v-model="dataForm.customerCode" placeholder="请输入分销商编号"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="公司名称" prop="companyName">
|
|
|
- <el-input v-model="dataForm.companyName" placeholder="请输入"></el-input>
|
|
|
+ <el-input v-model="dataForm.companyName" placeholder="请输入公司名称"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="分销商等级" prop="companyLevel">
|
|
|
- <el-select v-model="dataForm.companyLevel" filterable placeholder="请选择" style="width: 100%">
|
|
|
- <el-option :key="item.dictLabel" v-for="item in company_level" :label="item.dictLabel" :value="item.dictLabel">
|
|
|
+ <el-select v-model="dataForm.companyLevel" filterable placeholder="请选择分销商等级" style="width: 100%">
|
|
|
+ <el-option :key="item.dictLabel" v-for="item in company_level" :label="item.dictLabel"
|
|
|
+ :value="item.dictLabel">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="合同开始日期" prop="contractStart">
|
|
|
- <el-date-picker style="width: 100%;" v-model="dataForm.contractStart" type="date" placeholder="选择日期" value-format="yyyy-MM-dd"></el-date-picker>
|
|
|
+ <el-date-picker style="width: 100%;" v-model="dataForm.contractStart" type="date" placeholder="选择合同开始日期"
|
|
|
+ value-format="yyyy-MM-dd" :picker-options="startDatePickerOptions"></el-date-picker>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="合同结束日期" prop="contractEnd">
|
|
|
- <el-date-picker style="width: 100%;" v-model="dataForm.contractEnd" type="date" placeholder="选择日期" value-format="yyyy-MM-dd"></el-date-picker>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="联系人" prop="contactsName" placeholder="请输入">
|
|
|
- <el-input v-model="dataForm.contactsName"></el-input>
|
|
|
+ <el-date-picker style="width: 100%;" v-model="dataForm.contractEnd" type="date" placeholder="选择合同结束日期"
|
|
|
+ value-format="yyyy-MM-dd" :picker-options="endDatePickerOptions"></el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="联系人" prop="contactsName">
|
|
|
+ <el-input v-model="dataForm.contactsName" placeholder="请输入联系人"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="联系电话" prop="contactsPhone" placeholder="请输入">
|
|
|
- <el-input v-model="dataForm.contactsPhone"></el-input>
|
|
|
+ <el-form-item label="联系电话" prop="contactsPhone">
|
|
|
+ <el-input v-model="dataForm.contactsPhone" placeholder="请输入联系电话" onkeyup="value=value.replace(/^(0+)|[^\d]+/g,'')"></el-input>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
@@ -124,15 +128,15 @@ export default {
|
|
|
total: undefined,
|
|
|
listLoading: true,
|
|
|
statusList: [
|
|
|
- {
|
|
|
- type: 0,
|
|
|
- name: '启用'
|
|
|
- },
|
|
|
- {
|
|
|
- type: 1,
|
|
|
- name: '停用'
|
|
|
- },
|
|
|
- ],
|
|
|
+ {
|
|
|
+ type: 0,
|
|
|
+ name: '启用'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 1,
|
|
|
+ name: '停用'
|
|
|
+ },
|
|
|
+ ],
|
|
|
listQuery: {
|
|
|
page: 1,
|
|
|
limit: 10,
|
|
|
@@ -149,14 +153,28 @@ export default {
|
|
|
contactsName: undefined,
|
|
|
contactsPhone: undefined,
|
|
|
},
|
|
|
+ startDatePickerOptions: {
|
|
|
+ disabledDate: (date) => {
|
|
|
+ return this.dataForm.contractEnd && date > new Date(this.dataForm.contractEnd);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ endDatePickerOptions: {
|
|
|
+ disabledDate: (date) => {
|
|
|
+ return this.dataForm.contractStart && date < new Date(this.dataForm.contractStart);
|
|
|
+ }
|
|
|
+ },
|
|
|
dialogFormVisible: false,
|
|
|
dialogStatus: '',
|
|
|
textMap: {
|
|
|
- update: '编辑',
|
|
|
- create: '创建'
|
|
|
+ update: '编辑分销商',
|
|
|
+ create: '添加分销商'
|
|
|
},
|
|
|
rules: {
|
|
|
- customerCode: [{ required: true, message: '分销商编号不能为空', trigger: 'blur' }],
|
|
|
+ customerCode: [
|
|
|
+ { required: true, message: "分销商编号不能为空", trigger: "blur" },
|
|
|
+ { min: 7, max: 7, message: "分销商编号必须为7位", trigger: "blur" },
|
|
|
+ { pattern: /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,}$/, message: "分销商编号必须为7位字母加数字", trigger: "blur" }
|
|
|
+ ],
|
|
|
companyName: [{ required: true, message: '公司名称不能为空', trigger: 'blur' }],
|
|
|
companyLevel: [{ required: true, message: '请选择合同开始日期', trigger: 'blur' }],
|
|
|
contractStart: [{ required: true, message: '请选择分销商等级', trigger: 'blur' }],
|
|
|
@@ -171,7 +189,7 @@ export default {
|
|
|
this.getList();
|
|
|
},
|
|
|
methods: {
|
|
|
- getDictType(){
|
|
|
+ getDictType() {
|
|
|
//分销商等级
|
|
|
dataTypeList({ dictType: 'company_level' }).then(response => {
|
|
|
this.company_level = response.data.data;
|
|
|
@@ -281,37 +299,37 @@ export default {
|
|
|
},
|
|
|
handleDelete(row) {
|
|
|
this.$confirm('确认删除吗?', '提示', {
|
|
|
- confirmButtonText: '确定',
|
|
|
- cancelButtonText: '取消',
|
|
|
- type: 'warning'
|
|
|
- }).then(() => {
|
|
|
- deleteDistributor({id:row.id}).then(response => {
|
|
|
- this.$notify({
|
|
|
- title: '成功',
|
|
|
- message: '删除成功',
|
|
|
- type: 'success',
|
|
|
- duration: 2000
|
|
|
- })
|
|
|
- this.getList()
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ deleteDistributor({ id: row.id }).then(response => {
|
|
|
+ this.$notify({
|
|
|
+ title: '成功',
|
|
|
+ message: '删除成功',
|
|
|
+ type: 'success',
|
|
|
+ duration: 2000
|
|
|
})
|
|
|
- }).catch(() => {
|
|
|
-
|
|
|
+ this.getList()
|
|
|
})
|
|
|
+ }).catch(() => {
|
|
|
+
|
|
|
+ })
|
|
|
},
|
|
|
handleDownload() {
|
|
|
window.location.href = process.env.BASE_API + '/customer-distributor/export';
|
|
|
},
|
|
|
changeState(id, status) {
|
|
|
- setState({ id: id, status: status }).then(response => {
|
|
|
- this.$notify({
|
|
|
- title: '成功',
|
|
|
- message: '状态修改成功',
|
|
|
- type: 'success',
|
|
|
- duration: 2000
|
|
|
- })
|
|
|
- this.getList()
|
|
|
- })
|
|
|
- },
|
|
|
+ setState({ id: id, status: status }).then(response => {
|
|
|
+ this.$notify({
|
|
|
+ title: '成功',
|
|
|
+ message: '状态修改成功',
|
|
|
+ type: 'success',
|
|
|
+ duration: 2000
|
|
|
+ })
|
|
|
+ this.getList()
|
|
|
+ })
|
|
|
+ },
|
|
|
}
|
|
|
}
|
|
|
</script>
|
