前端 省市区
This commit is contained in:
parent
c2c0d01730
commit
0827bd6f95
|
|
@ -3449,6 +3449,11 @@
|
|||
"integrity": "sha1-M1bMoZyIlUTy16le1JzlCKDs9VI=",
|
||||
"dev": true
|
||||
},
|
||||
"china-area-data": {
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/china-area-data/-/china-area-data-5.0.1.tgz",
|
||||
"integrity": "sha512-BQDPpiv5Nn+018ekcJK2oSD9PAD+E1bvXB0wgabc//dFVS/KvRqCgg0QOEUt3vBkx9XzB5a9BmkJCEZDBxVjVw=="
|
||||
},
|
||||
"chokidar": {
|
||||
"version": "2.1.8",
|
||||
"resolved": "https://registry.npm.taobao.org/chokidar/download/chokidar-2.1.8.tgz",
|
||||
|
|
@ -5028,6 +5033,15 @@
|
|||
"integrity": "sha1-8Tl6Yzw15yZzDCS+EITNJcPugUg=",
|
||||
"dev": true
|
||||
},
|
||||
"element-china-area-data": {
|
||||
"version": "5.0.2",
|
||||
"resolved": "https://registry.npmjs.org/element-china-area-data/-/element-china-area-data-5.0.2.tgz",
|
||||
"integrity": "sha512-vLQuvOKJy/uiX7MRHEk3x/j09hipuIl6DJ/C4XFUG7D7Pj3O47sy+Y6aAArM6k9v8cD9UX6e+yz2S4J+IPnZ8g==",
|
||||
"requires": {
|
||||
"china-area-data": "^5.0.1",
|
||||
"lodash-es": "^4.17.15"
|
||||
}
|
||||
},
|
||||
"element-ui": {
|
||||
"version": "2.13.0",
|
||||
"resolved": "https://registry.npm.taobao.org/element-ui/download/element-ui-2.13.0.tgz",
|
||||
|
|
@ -9884,6 +9898,11 @@
|
|||
"integrity": "sha1-tEf2ZwoEVbv+7dETku/zMOoJdUg=",
|
||||
"dev": true
|
||||
},
|
||||
"lodash-es": {
|
||||
"version": "4.17.21",
|
||||
"resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
|
||||
"integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
|
||||
},
|
||||
"lodash.defaultsdeep": {
|
||||
"version": "4.6.1",
|
||||
"resolved": "https://registry.npm.taobao.org/lodash.defaultsdeep/download/lodash.defaultsdeep-4.6.1.tgz?cache=0&sync_timestamp=1562718178896&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Flodash.defaultsdeep%2Fdownload%2Flodash.defaultsdeep-4.6.1.tgz",
|
||||
|
|
|
|||
|
|
@ -17,6 +17,7 @@
|
|||
"dependencies": {
|
||||
"axios": "0.18.1",
|
||||
"echarts": "^4.7.0",
|
||||
"element-china-area-data": "^5.0.2",
|
||||
"element-ui": "2.13.0",
|
||||
"file-saver": "^2.0.2",
|
||||
"js-cookie": "2.2.0",
|
||||
|
|
|
|||
|
|
@ -1,138 +1,180 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div style="margin-top:10px">
|
||||
<el-input
|
||||
v-model="listQuery.search"
|
||||
placeholder="输入部门名称进行搜索"
|
||||
style="width: 200px;"
|
||||
class="filter-item"
|
||||
@keyup.enter.native="handleFilter"
|
||||
/>
|
||||
<el-button type="primary" @click="handleAdd" icon="el-icon-plus" v-if ="checkPermission(['company_create'])">新增</el-button>
|
||||
<el-button
|
||||
<div style="margin-top: 10px">
|
||||
<el-input
|
||||
v-model="listQuery.search"
|
||||
placeholder="输入部门名称进行搜索"
|
||||
style="width: 200px"
|
||||
class="filter-item"
|
||||
@keyup.enter.native="handleFilter"
|
||||
/>
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="handleAdd"
|
||||
icon="el-icon-plus"
|
||||
v-if="checkPermission(['company_create'])"
|
||||
>新增</el-button
|
||||
>
|
||||
<el-button
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh-left"
|
||||
@click="resetFilter"
|
||||
>刷新重置</el-button>
|
||||
>刷新重置</el-button
|
||||
>
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="handleTrans"
|
||||
v-if="checkPermission(['consumer__transfers'])"
|
||||
>批量移交</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
:data="tableData.results"
|
||||
style="width: 100%;margin-top:10px;"
|
||||
border
|
||||
fit
|
||||
v-loading="listLoading"
|
||||
highlight-current-row
|
||||
max-height="600"
|
||||
row-key="id"
|
||||
default-expand-all
|
||||
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<el-table-column type="selection" width="40"></el-table-column>
|
||||
<el-table-column label="单位名称">
|
||||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="所在地区">
|
||||
<template slot-scope="scope" v-if="scope.row.geo">
|
||||
<span v-if="scope.row.geo.pname">{{ scope.row.geo.pname }}</span>
|
||||
<span v-if="scope.row.geo.cityname">/{{ scope.row.geo.cityname }}</span>
|
||||
<span v-if="scope.row.geo.adname">/{{ scope.row.geo.adname }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建日期">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.create_time }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="所属">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.create_admin_name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="操作" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="handleEdit(scope)"
|
||||
icon="el-icon-edit"
|
||||
:disabled="!checkPermission(['company_update'])"
|
||||
></el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
size="small"
|
||||
@click="handleDelete(scope)"
|
||||
icon="el-icon-delete"
|
||||
:disabled="!checkPermission(['company_delete'])"
|
||||
></el-button>
|
||||
<el-button
|
||||
>批量移交</el-button
|
||||
>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
:data="tableData.results"
|
||||
style="width: 100%; margin-top: 10px"
|
||||
border
|
||||
fit
|
||||
v-loading="listLoading"
|
||||
highlight-current-row
|
||||
max-height="600"
|
||||
row-key="id"
|
||||
default-expand-all
|
||||
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<el-table-column type="selection" width="40"></el-table-column>
|
||||
<el-table-column label="单位名称">
|
||||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="所在地区">
|
||||
<template slot-scope="scope" v-if="scope.row.geo">
|
||||
<span v-if="scope.row.geo.pname">{{ scope.row.geo.pname }}</span>
|
||||
<span v-if="scope.row.geo.cityname"
|
||||
>/{{ scope.row.geo.cityname }}</span
|
||||
>
|
||||
<span v-if="scope.row.geo.adname">/{{ scope.row.geo.adname }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建日期">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.create_time }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="所属">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.create_admin_name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="操作" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="handleEdit(scope)"
|
||||
icon="el-icon-edit"
|
||||
:disabled="!checkPermission(['company_update'])"
|
||||
></el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
size="small"
|
||||
@click="handleDelete(scope)"
|
||||
icon="el-icon-delete"
|
||||
:disabled="!checkPermission(['company_delete'])"
|
||||
></el-button>
|
||||
<el-button
|
||||
v-if="checkPermission(['company_transfer'])"
|
||||
type="primary"
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="transfer(scope)"
|
||||
>移交</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
>移交</el-button
|
||||
>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination
|
||||
v-show="tableData.count>0"
|
||||
v-show="tableData.count > 0"
|
||||
:total="tableData.count"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="getList"
|
||||
/>
|
||||
<el-dialog :visible.sync="dialogVisible" :title="dialogType==='edit'?'编辑单位':'新增单位'" >
|
||||
<el-form :model="company" label-width="80px" label-position="right" :rules="rule1" ref="companyForm">
|
||||
<el-dialog
|
||||
:visible.sync="dialogVisible"
|
||||
:title="dialogType === 'edit' ? '编辑单位' : '新增单位'"
|
||||
>
|
||||
<el-form
|
||||
:model="company"
|
||||
label-width="80px"
|
||||
label-position="right"
|
||||
:rules="rule1"
|
||||
ref="companyForm"
|
||||
>
|
||||
<el-form-item label="名称" prop="name">
|
||||
<el-input v-model="company.name" placeholder="名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="所在地" prop="regin">
|
||||
<el-cascader
|
||||
size="large"
|
||||
:options="regionData"
|
||||
@change="handleRChange"
|
||||
style="width: 100%"
|
||||
clearable
|
||||
v-model="company.geo_"
|
||||
>
|
||||
|
||||
</el-cascader>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="text-align:right;">
|
||||
<el-button type="danger" @click="dialogVisible=false">取消</el-button>
|
||||
<el-button type="primary" @click="confirmCompany('companyForm')">确认</el-button>
|
||||
<div style="text-align: right">
|
||||
<el-button type="danger" @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="confirmCompany('companyForm')"
|
||||
>确认</el-button
|
||||
>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getCompanyList, createCompany, deleteCompany, updateCompany, transferCompany, transferCompanys } from "@/api/crm";
|
||||
import {
|
||||
getCompanyList,
|
||||
createCompany,
|
||||
deleteCompany,
|
||||
updateCompany,
|
||||
transferCompany,
|
||||
transferCompanys,
|
||||
} from "@/api/crm";
|
||||
import { deepClone } from "@/utils";
|
||||
import checkPermission from "@/utils/permission";
|
||||
import Pagination from "@/components/Pagination"
|
||||
|
||||
|
||||
import Pagination from "@/components/Pagination";
|
||||
import { regionData, CodeToText, TextToCode } from "element-china-area-data";
|
||||
|
||||
const defaultCompany = {
|
||||
id: "",
|
||||
name: "",
|
||||
};
|
||||
id: "",
|
||||
name: "",
|
||||
geo: null,
|
||||
};
|
||||
const listQuery = {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
search: ""
|
||||
}
|
||||
search: "",
|
||||
};
|
||||
export default {
|
||||
components: { Pagination },
|
||||
data() {
|
||||
return {
|
||||
selects:[],
|
||||
regionData: regionData,
|
||||
selects: [],
|
||||
company: {
|
||||
id: "",
|
||||
name: "",
|
||||
},
|
||||
listQuery:listQuery,
|
||||
tableData: {count:0},
|
||||
listQuery: listQuery,
|
||||
tableData: { count: 0 },
|
||||
listLoading: true,
|
||||
dialogVisible: false,
|
||||
dialogType: "new",
|
||||
|
|
@ -152,17 +194,17 @@ export default {
|
|||
methods: {
|
||||
checkPermission,
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
getCompanyList(this.listQuery).then(response => {
|
||||
this.tableData = response.data
|
||||
this.listLoading = false
|
||||
this.listLoading = true;
|
||||
getCompanyList(this.listQuery).then((response) => {
|
||||
this.tableData = response.data;
|
||||
this.listLoading = false;
|
||||
});
|
||||
},
|
||||
resetFilter() {
|
||||
this.listQuery = {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
search: ""
|
||||
search: "",
|
||||
};
|
||||
this.getList();
|
||||
},
|
||||
|
|
@ -180,6 +222,23 @@ export default {
|
|||
},
|
||||
handleEdit(scope) {
|
||||
this.company = Object.assign({}, scope.row); // copy obj
|
||||
this.company.geo_ = ["", "", ""];
|
||||
if (scope.row.geo) {
|
||||
if (scope.row.geo.pname) {
|
||||
this.company.geo_[0] = TextToCode[scope.row.geo.pname].code;
|
||||
if (scope.row.geo.cityname) {
|
||||
this.company.geo_[1] =
|
||||
TextToCode[scope.row.geo.pname][scope.row.geo.cityname].code;
|
||||
if (scope.row.geo.adname) {
|
||||
this.company.geo_[2] =
|
||||
TextToCode[scope.row.geo.pname][scope.row.geo.cityname][
|
||||
scope.row.geo.adname
|
||||
].code;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.dialogType = "edit";
|
||||
this.dialogVisible = true;
|
||||
this.$nextTick(() => {
|
||||
|
|
@ -190,37 +249,37 @@ export default {
|
|||
this.$confirm("确认删除该单位吗?将丢失数据!", "警告", {
|
||||
confirmButtonText: "确认",
|
||||
cancelButtonText: "取消",
|
||||
type: "error"
|
||||
type: "error",
|
||||
})
|
||||
.then(async () => {
|
||||
await deleteCompany(scope.row.id);
|
||||
this.getList()
|
||||
this.getList();
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "成功删除!"
|
||||
message: "成功删除!",
|
||||
});
|
||||
})
|
||||
.catch(err => {
|
||||
.catch((err) => {
|
||||
// console.error(err);
|
||||
});
|
||||
},
|
||||
async confirmCompany(form) {
|
||||
this.$refs[form].validate(valid => {
|
||||
this.$refs[form].validate((valid) => {
|
||||
if (valid) {
|
||||
const isEdit = this.dialogType === "edit";
|
||||
if (isEdit) {
|
||||
updateCompany(this.company.id, this.company).then(() => {
|
||||
this.getList();
|
||||
this.dialogVisible = false;
|
||||
this.$message.success('成功')
|
||||
this.$message.success("成功");
|
||||
});
|
||||
} else {
|
||||
createCompany(this.company).then(res => {
|
||||
createCompany(this.company).then((res) => {
|
||||
// this.company = res.data
|
||||
// this.tableData.unshift(this.company)
|
||||
this.getList();
|
||||
this.dialogVisible = false;
|
||||
this.$message.success('成功')
|
||||
this.$message.success("成功");
|
||||
});
|
||||
}
|
||||
} else {
|
||||
|
|
@ -229,47 +288,72 @@ export default {
|
|||
});
|
||||
},
|
||||
transfer(scope) {
|
||||
this.$prompt('请输入管理员账号以确认将('+scope.row.name + ')及其学员转交给他', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
this.$prompt(
|
||||
"请输入管理员账号以确认将(" + scope.row.name + ")及其学员转交给他",
|
||||
"提示",
|
||||
{
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
// inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
|
||||
// inputErrorMessage: '邮箱格式不正确'
|
||||
}).then(({ value }) => {
|
||||
transferCompany(scope.row.id, {'admin':value}).then(res=>{
|
||||
this.$message.success('转交成功!')
|
||||
this.getList()
|
||||
})
|
||||
}).catch(() => {
|
||||
});
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
}
|
||||
)
|
||||
.then(({ value }) => {
|
||||
transferCompany(scope.row.id, { admin: value }).then((res) => {
|
||||
this.$message.success("转交成功!");
|
||||
this.getList();
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
let selects = [];
|
||||
for (var i = 0; i < val.length; i++) {
|
||||
selects.push(val[i].id);
|
||||
}
|
||||
this.selects = selects;
|
||||
},
|
||||
handleTrans() {
|
||||
handleRChange(val) {
|
||||
if (val[0] != "") {
|
||||
this.company.geo.pname = CodeToText[val[0]];
|
||||
if (val[1] != "") {
|
||||
this.company.geo.cityname = CodeToText[val[1]];
|
||||
if (val[2] != "") {
|
||||
this.company.geo.adname = CodeToText[val[2]];
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
handleTrans() {
|
||||
if (this.selects.length) {
|
||||
this.$prompt('请输入管理员账号以确认将'+this.selects.length + '家企业及其学员转交给他', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
// inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
|
||||
// inputErrorMessage: '邮箱格式不正确'
|
||||
}).then(({ value }) => {
|
||||
transferCompanys({admin:value, companys:this.selects}).then(res=>{
|
||||
this.$message.success('转交成功!')
|
||||
this.getList()
|
||||
this.$prompt(
|
||||
"请输入管理员账号以确认将" +
|
||||
this.selects.length +
|
||||
"家企业及其学员转交给他",
|
||||
"提示",
|
||||
{
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
// inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
|
||||
// inputErrorMessage: '邮箱格式不正确'
|
||||
}
|
||||
)
|
||||
.then(({ value }) => {
|
||||
transferCompanys({ admin: value, companys: this.selects }).then(
|
||||
(res) => {
|
||||
this.$message.success("转交成功!");
|
||||
this.getList();
|
||||
}
|
||||
);
|
||||
})
|
||||
}).catch(() => {
|
||||
});
|
||||
.catch(() => {});
|
||||
} else {
|
||||
this.$message({
|
||||
message: "请先选择",
|
||||
type: "warning",
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -32,11 +32,15 @@
|
|||
<el-table-column label="单位名称">
|
||||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建日期">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.create_time }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="所在地区">
|
||||
<template slot-scope="scope" v-if="scope.row.geo">
|
||||
<span v-if="scope.row.geo.pname">{{ scope.row.geo.pname }}</span>
|
||||
<span v-if="scope.row.geo.cityname"
|
||||
>/{{ scope.row.geo.cityname }}</span
|
||||
>
|
||||
<span v-if="scope.row.geo.adname">/{{ scope.row.geo.adname }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
|
|
|
|||
Loading…
Reference in New Issue