|
@@ -0,0 +1,261 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <div style="display:flex">
|
|
|
+ <el-select
|
|
|
+ size="small"
|
|
|
+ v-model="value"
|
|
|
+ placeholder="请选择"
|
|
|
+ @input="$emit('balabala', value)"
|
|
|
+ :disabled="disabled"
|
|
|
+ filterable
|
|
|
+ clearable
|
|
|
+ @change="corpChange"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in corpList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.cname"
|
|
|
+ :value="item.id"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-button
|
|
|
+ icon="el-icon-search"
|
|
|
+ size="mini"
|
|
|
+ :disabled="disabled"
|
|
|
+ @click="openDialog()"
|
|
|
+ ></el-button>
|
|
|
+ </div>
|
|
|
+ <el-dialog
|
|
|
+ :title="title"
|
|
|
+ :visible.sync="corpVisible"
|
|
|
+ width="60%"
|
|
|
+ top="5vh"
|
|
|
+ append-to-body
|
|
|
+ @closed="closed"
|
|
|
+ class="el-dialogDeep"
|
|
|
+ v-dialog-drag
|
|
|
+ >
|
|
|
+ <span>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-scrollbar>
|
|
|
+ <basic-container>
|
|
|
+ <avue-tree
|
|
|
+ :option="treeOption"
|
|
|
+ :data="treeData"
|
|
|
+ @node-click="nodeClick"
|
|
|
+ />
|
|
|
+ </basic-container>
|
|
|
+ </el-scrollbar>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="19">
|
|
|
+ <avue-crud
|
|
|
+ :option="tableOption"
|
|
|
+ :data="data"
|
|
|
+ ref="crud"
|
|
|
+ v-model="form"
|
|
|
+ :page.sync="page"
|
|
|
+ :search.sync="search"
|
|
|
+ @search-change="searchChange"
|
|
|
+ @search-reset="searchReset"
|
|
|
+ @selection-change="selectionChange"
|
|
|
+ @on-load="onLoad"
|
|
|
+ @tree-load="treeLoad"
|
|
|
+ @saveColumn="saveColumn"
|
|
|
+ @refresh-change="refreshChange"
|
|
|
+ :table-loading="loading"
|
|
|
+ >
|
|
|
+ </avue-crud>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </span>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="corpVisible = false">取 消</el-button>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="importCorp"
|
|
|
+ :disabled="selectionList.length != 1"
|
|
|
+ >确 定</el-button
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import option from "./configuration/mainList.json";
|
|
|
+import {
|
|
|
+ customerList,
|
|
|
+ allCropList,
|
|
|
+ getDeptLazyTree
|
|
|
+} from "@/api/basicData/customerInformation";
|
|
|
+import { getCustomerCode, getCustomerName } from "@/enums/management-type";
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ corpList: [],
|
|
|
+ loading: false,
|
|
|
+ data: [],
|
|
|
+ tableOption: {},
|
|
|
+ form: {},
|
|
|
+ search: {},
|
|
|
+ treeDeptId: "",
|
|
|
+ treeDeptName: "",
|
|
|
+ page: {
|
|
|
+ currentPage: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ total: 0
|
|
|
+ },
|
|
|
+ treeOption: {
|
|
|
+ nodeKey: "id",
|
|
|
+ lazy: true,
|
|
|
+ addBtn: false,
|
|
|
+ menu: false,
|
|
|
+ size: "small",
|
|
|
+ props: {
|
|
|
+ labelText: "标题",
|
|
|
+ label: "title",
|
|
|
+ value: "value",
|
|
|
+ children: "children"
|
|
|
+ }
|
|
|
+ },
|
|
|
+ corpVisible: false,
|
|
|
+ selectionList: [],
|
|
|
+ title: null
|
|
|
+ };
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ value: String,
|
|
|
+ disabled: Boolean,
|
|
|
+ cropIndex: Number,
|
|
|
+ corpType: String
|
|
|
+ },
|
|
|
+ model: {
|
|
|
+ prop: "value",
|
|
|
+ event: "balabala"
|
|
|
+ },
|
|
|
+ async created() {
|
|
|
+ this.tableOption = await this.getColumnData(this.getColumnName(51), option);
|
|
|
+ this.title = getCustomerName(this.corpType);
|
|
|
+ allCropList({
|
|
|
+ corpType: getCustomerCode(this.corpType)
|
|
|
+ }).then(res => {
|
|
|
+ this.corpList = res.data.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ mounted() {},
|
|
|
+ methods: {
|
|
|
+ init() {
|
|
|
+ this.openDialog();
|
|
|
+ },
|
|
|
+ openDialog() {
|
|
|
+ let _this = this;
|
|
|
+ this.treeOption.treeLoad = function(node, resolve) {
|
|
|
+ const parentId = node.level === 0 ? 0 : node.data.id;
|
|
|
+ getDeptLazyTree({
|
|
|
+ parentId: parentId,
|
|
|
+ corpType: getCustomerCode(_this.corpType)
|
|
|
+ }).then(res => {
|
|
|
+ resolve(
|
|
|
+ res.data.data.map(item => {
|
|
|
+ return {
|
|
|
+ ...item,
|
|
|
+ leaf: !item.hasChildren
|
|
|
+ };
|
|
|
+ })
|
|
|
+ );
|
|
|
+ });
|
|
|
+ };
|
|
|
+ this.corpVisible = true;
|
|
|
+ },
|
|
|
+ closed() {
|
|
|
+ this.$refs.crud.toggleSelection();
|
|
|
+ },
|
|
|
+ importCorp() {
|
|
|
+ this.$emit("balabala", this.selectionList[0].id);
|
|
|
+ this.$emit("getCorpData", {
|
|
|
+ ...this.selectionList[0],
|
|
|
+ index: this.cropIndex
|
|
|
+ });
|
|
|
+ this.corpVisible = false;
|
|
|
+ },
|
|
|
+ corpChange(row) {
|
|
|
+ this.corpList.forEach(e => {
|
|
|
+ if (row == e.id) {
|
|
|
+ this.$emit("getCorpData", { ...e, index: this.cropIndex });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ refreshChange() {
|
|
|
+ this.onLoad(this.page, this.search);
|
|
|
+ },
|
|
|
+ onLoad(page, params = { parentId: 0 }) {
|
|
|
+ let queryParams = Object.assign({}, params, {
|
|
|
+ size: page.pageSize,
|
|
|
+ current: page.currentPage,
|
|
|
+ corpsTypeId: this.treeDeptId,
|
|
|
+ corpType: getCustomerCode(this.corpType)
|
|
|
+ });
|
|
|
+ this.loading = true;
|
|
|
+ customerList(queryParams)
|
|
|
+ .then(res => {
|
|
|
+ this.data = res.data.data.records;
|
|
|
+ this.page.total = res.data.data.total;
|
|
|
+ if (this.page.total) {
|
|
|
+ this.tableOption.height = window.innerHeight - 350;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ selectionChange(list) {
|
|
|
+ this.selectionList = list;
|
|
|
+ },
|
|
|
+ sizeChange(val) {
|
|
|
+ this.page.pageSize = val;
|
|
|
+ this.onLoad();
|
|
|
+ },
|
|
|
+ currentChange(val) {
|
|
|
+ this.page.currentPage = val;
|
|
|
+ this.onLoad();
|
|
|
+ },
|
|
|
+ //列表内展开树节点
|
|
|
+ treeLoad(tree, treeNode, resolve) {
|
|
|
+ const parentId = tree.id;
|
|
|
+ customerList({ parentId: parentId }).then(res => {
|
|
|
+ resolve(res.data.data.records);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //点击搜索按钮触发
|
|
|
+ searchChange(params, done) {
|
|
|
+ this.page.currentPage = 1;
|
|
|
+ this.onLoad(this.page, params);
|
|
|
+ done();
|
|
|
+ },
|
|
|
+ searchReset() {
|
|
|
+ this.treeDeptId = null;
|
|
|
+ },
|
|
|
+ nodeClick(data) {
|
|
|
+ this.treeDeptId = data.id;
|
|
|
+ this.page.currentPage = 1;
|
|
|
+ this.onLoad(this.page);
|
|
|
+ },
|
|
|
+ //列保存触发
|
|
|
+ async saveColumn() {
|
|
|
+ const inSave = await this.saveColumnData(
|
|
|
+ this.getColumnName(51),
|
|
|
+ this.option
|
|
|
+ );
|
|
|
+ if (inSave) {
|
|
|
+ this.$message.success("保存成功");
|
|
|
+ //关闭窗口
|
|
|
+ this.$refs.crud.$refs.dialogColumn.columnBox = false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss"></style>
|