|
|
@@ -0,0 +1,429 @@
|
|
|
+<template>
|
|
|
+ <basic-container>
|
|
|
+ <avue-crud :option="option"
|
|
|
+ :table-loading="loading"
|
|
|
+ :data="data"
|
|
|
+ :page.sync="page"
|
|
|
+ :permission="permissionList"
|
|
|
+ :before-open="beforeOpen"
|
|
|
+ v-model="form"
|
|
|
+ ref="crud"
|
|
|
+ @row-update="rowUpdate"
|
|
|
+ @row-save="rowSave"
|
|
|
+ @row-del="rowDel"
|
|
|
+ @selection-change="selectionChange"
|
|
|
+ @current-change="currentChange"
|
|
|
+ @size-change="sizeChange"
|
|
|
+ @refresh-change="refreshChange"
|
|
|
+ @on-load="onLoad">
|
|
|
+ <template slot-scope="{type,size,row}" slot="menu">
|
|
|
+ <el-button icon="el-icon-setting" :size="size" :type="type" @click="configurationClick(row)">配置划分</el-button>
|
|
|
+ <el-button icon="el-icon-setting" :size="size" :type="type" @click="Associationlist(row)">关联清表</el-button>
|
|
|
+ <el-button icon="el-icon-setting" :size="size" :type="type" @click="associatedClick(row)">数据映射配置</el-button>
|
|
|
+ </template>
|
|
|
+ </avue-crud>
|
|
|
+
|
|
|
+ <!-- 关联清表 -->
|
|
|
+ <el-dialog
|
|
|
+ title="关联下载模板表"
|
|
|
+ class="excelBox"
|
|
|
+ :visible.sync="GLExcel"
|
|
|
+ width="500px"
|
|
|
+ modal-append-to-body
|
|
|
+ append-to-body
|
|
|
+ @close="GLExcelMD"
|
|
|
+ >
|
|
|
+ <div class="mg-b-10">
|
|
|
+ <el-alert
|
|
|
+ :closable="false"
|
|
|
+ title="选择需要关联的清表 注意:每次只能单选操作"
|
|
|
+ type="warning">
|
|
|
+ </el-alert>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-select
|
|
|
+ style="width: 100%"
|
|
|
+ v-model="GLExcelFrom.name"
|
|
|
+ placeholder="请选择"
|
|
|
+ @change="changetherr()"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, key) in GLExcelData"
|
|
|
+ :key="key"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-scrollbar style="margin-top: 20px; height: 50vh">
|
|
|
+ <el-input
|
|
|
+ style="width: 100%"
|
|
|
+ v-model.trim="GLExcelFrom.search"
|
|
|
+ placeholder="请输入需要选择的内容"
|
|
|
+ ></el-input>
|
|
|
+ <el-tree
|
|
|
+ :filter-node-method="filterNode222"
|
|
|
+ ref="tree"
|
|
|
+ class="filter-tree"
|
|
|
+ style="margin-top: 10px"
|
|
|
+ :props="GLExcelProps"
|
|
|
+ :data="exceldata"
|
|
|
+ node-key="id"
|
|
|
+ accordion
|
|
|
+ show-checkbox
|
|
|
+ @check="checkchange"
|
|
|
+ v-loading="GLExcelLoading"
|
|
|
+ >
|
|
|
+ </el-tree>
|
|
|
+ </el-scrollbar>
|
|
|
+ </div>
|
|
|
+ <span
|
|
|
+ slot="footer"
|
|
|
+ class="dialog-footer"
|
|
|
+ style="display: flex; justify-content: center; align-items: center"
|
|
|
+ >
|
|
|
+ <el-button @click="GLExcelMD()">取 消</el-button>
|
|
|
+ <el-button
|
|
|
+ style="margin-left: 30px"
|
|
|
+ type="primary"
|
|
|
+ v-throttle="2000"
|
|
|
+ @click="saveLinkTab()"
|
|
|
+ >确 定</el-button
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ <!-- 配置划分数据 -->
|
|
|
+ <configDivision :testGLExcel="testGLExcel"></configDivision>
|
|
|
+ </basic-container>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <script>
|
|
|
+ import {getList, getDetail, add, update, remove} from "@/api/tentative/testcollect";
|
|
|
+ import {mapGetters} from "vuex";
|
|
|
+ import {
|
|
|
+ getList as getListQing,
|
|
|
+ tabLazytreeAll,
|
|
|
+ saveLinkTab,
|
|
|
+ getExcelHtml,
|
|
|
+} from "@/api/exctab/excelmodel";
|
|
|
+import configDivision from "./components/configDivision.vue";
|
|
|
+
|
|
|
+ export default {
|
|
|
+ components:{
|
|
|
+ configDivision
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ form: {},
|
|
|
+ query: {},
|
|
|
+ loading: true,
|
|
|
+ page: {
|
|
|
+ pageSize: 20,
|
|
|
+ currentPage: 1,
|
|
|
+ total: 0
|
|
|
+ },
|
|
|
+ search:{},
|
|
|
+ selectionList: [],
|
|
|
+ option: {
|
|
|
+ menuWidth:440,
|
|
|
+ height:'auto',
|
|
|
+ calcHeight: 30,
|
|
|
+ tip: false,
|
|
|
+ searchShow: false,
|
|
|
+ searchMenuSpan: 0,
|
|
|
+ border: true,
|
|
|
+ index: true,
|
|
|
+ viewBtn: true,
|
|
|
+ selection: false,
|
|
|
+ dialogClickModal: false,
|
|
|
+ labelWidth:150,
|
|
|
+ column: [
|
|
|
+ {
|
|
|
+ label: "分类名称",
|
|
|
+ prop: "className",
|
|
|
+ rules: [{
|
|
|
+ required: true,
|
|
|
+ message: "请输入分类名称",
|
|
|
+ trigger: "blur"
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ data: [],
|
|
|
+ GLExcel:false,
|
|
|
+ GLExcelFrom:{
|
|
|
+ id: "",
|
|
|
+ name: "",
|
|
|
+ search: "", //搜素框舒服的值
|
|
|
+ ids: "",
|
|
|
+ excelId: "",
|
|
|
+ initTableName: "",
|
|
|
+ initTableId:""
|
|
|
+ },
|
|
|
+ GLExcelData:[],
|
|
|
+ exceldata:[],
|
|
|
+ GLExcelProps: {
|
|
|
+ label: "name",
|
|
|
+ children: "children",
|
|
|
+ disabled: "hasChildren",
|
|
|
+ isLeaf: function (data) {
|
|
|
+ let tag = false;
|
|
|
+ if (!data.hasChildren) {
|
|
|
+ tag = true;
|
|
|
+ }
|
|
|
+ if (data.isExistForm == 1) {
|
|
|
+ tag = true;
|
|
|
+ }
|
|
|
+ return tag;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ testGLExcel:false,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(["permission"]),
|
|
|
+ permissionList() {
|
|
|
+ return {
|
|
|
+ viewBtn: false,
|
|
|
+ //addBtn: this.vaildData(this.permission.imageclassificationconfig_add, false),
|
|
|
+ //viewBtn: this.vaildData(this.permission.imageclassificationconfig_view, false),
|
|
|
+ //delBtn: this.vaildData(this.permission.imageclassificationconfig_delete, false),
|
|
|
+ // editBtn: this.vaildData(this.permission.imageclassificationconfig_edit, false)
|
|
|
+ };
|
|
|
+ },
|
|
|
+ ids() {
|
|
|
+ let ids = [];
|
|
|
+ this.selectionList.forEach(ele => {
|
|
|
+ ids.push(ele.id);
|
|
|
+ });
|
|
|
+ return ids.join(",");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ "GLExcelFrom.search"(val) {
|
|
|
+ console.log(val);
|
|
|
+ if (this.exceldata) {
|
|
|
+ this.$refs.tree.filter(val);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ rowSave(row, done, loading) {
|
|
|
+ add(row).then(() => {
|
|
|
+ this.onLoad(this.page);
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "操作成功!"
|
|
|
+ });
|
|
|
+ done();
|
|
|
+ }, error => {
|
|
|
+ loading();
|
|
|
+ window.console.log(error);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ rowUpdate(row, index, done, loading) {
|
|
|
+ update(row).then(() => {
|
|
|
+ this.onLoad(this.page);
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "操作成功!"
|
|
|
+ });
|
|
|
+ done();
|
|
|
+ }, error => {
|
|
|
+ loading();
|
|
|
+ console.log(error);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ rowDel(row) {
|
|
|
+ this.$confirm("确定将选择数据删除?", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning"
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ return remove(row.id);
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ this.onLoad(this.page);
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "操作成功!"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ beforeOpen(done, type) {
|
|
|
+ if (["edit", "view"].includes(type)) {
|
|
|
+ getDetail(this.form.id).then(res => {
|
|
|
+ this.form = res.data.data;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ done();
|
|
|
+ },
|
|
|
+ searchReset() {
|
|
|
+ this.query = {};
|
|
|
+ this.onLoad(this.page);
|
|
|
+ },
|
|
|
+ searchChange(params, done) {
|
|
|
+ this.query = params;
|
|
|
+ this.page.currentPage = 1;
|
|
|
+ this.onLoad(this.page, params);
|
|
|
+ done();
|
|
|
+ },
|
|
|
+ selectionChange(list) {
|
|
|
+ this.selectionList = list;
|
|
|
+ },
|
|
|
+ selectionClear() {
|
|
|
+ this.selectionList = [];
|
|
|
+ this.$refs.crud.toggleSelection();
|
|
|
+ },
|
|
|
+ currentChange(currentPage){
|
|
|
+ this.page.currentPage = currentPage;
|
|
|
+ },
|
|
|
+ sizeChange(pageSize){
|
|
|
+ this.page.pageSize = pageSize;
|
|
|
+ },
|
|
|
+ refreshChange() {
|
|
|
+ this.onLoad(this.page, this.query);
|
|
|
+ },
|
|
|
+ onLoad(page, params = {}) {
|
|
|
+ this.loading = true;
|
|
|
+ getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
|
|
|
+ const data = res.data.data;
|
|
|
+ this.page.total = data.total;
|
|
|
+ this.data = data.records;
|
|
|
+ this.loading = false;
|
|
|
+ this.selectionClear();
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ //关联清表
|
|
|
+ Associationlist(row) {
|
|
|
+ //关联清表点击事件
|
|
|
+ console.log(row,'row');
|
|
|
+ this.GLExcelFrom.id = row.pkeyId;
|
|
|
+ this.GLExcel =true ;
|
|
|
+ this.getList({
|
|
|
+ current: 1,
|
|
|
+ size: 100000,
|
|
|
+ parentId: 0,
|
|
|
+ });
|
|
|
+
|
|
|
+ },
|
|
|
+ GLExcelMD() {
|
|
|
+ //弹框关闭事件
|
|
|
+ this.GLExcelFrom.name = "";
|
|
|
+ this.GLExcelFrom.search = "";
|
|
|
+ this.GLExcelFrom.id = "";
|
|
|
+ this.exceldata = [];
|
|
|
+
|
|
|
+ this.GLExcel = false;
|
|
|
+ },
|
|
|
+ changetherr() {
|
|
|
+ //清表类型选择框change事件
|
|
|
+ if (this.GLExcelFrom.name != "") {
|
|
|
+ this.GLExcelFrom.search = "";
|
|
|
+ this.tabLazytreeAll();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async tabLazytreeAll() {
|
|
|
+ //清表树信息
|
|
|
+ this.GLExcelLoading = true;
|
|
|
+ const { data: res } = await tabLazytreeAll({
|
|
|
+ modeId: this.GLExcelFrom.name,
|
|
|
+ name: this.GLExcelFrom.search,
|
|
|
+ });
|
|
|
+ this.GLExcelLoading = false;
|
|
|
+ console.log(res);
|
|
|
+ if (res.code === 200 && res.msg === "操作成功") {
|
|
|
+ this.exceldata = res.data;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ filterNode222(value,data,node) {
|
|
|
+ if(!value){
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ let level = node.level;
|
|
|
+ let _array = [];//这里使用数组存储 只是为了存储值。
|
|
|
+ this.getReturnNode2(node,_array,value);
|
|
|
+ let result = false;
|
|
|
+ _array.forEach((item)=>{
|
|
|
+ result = result || item;
|
|
|
+ });
|
|
|
+ return result;
|
|
|
+ },
|
|
|
+ getReturnNode2(node,_array,value){
|
|
|
+ let isPass = node.data && node.data.name && node.data.name.indexOf(value) !== -1;
|
|
|
+ isPass?_array.push(isPass):'';
|
|
|
+ if(!isPass && node.level!=1 && node.parent){
|
|
|
+ this.getReturnNode2(node.parent,_array,value);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async getList(da) {
|
|
|
+ //获取清表模板信息
|
|
|
+ const { data: res } = await getListQing(da);
|
|
|
+ console.log(res);
|
|
|
+ if (res.code === 200 && res.msg === "操作成功") {
|
|
|
+ this.GLExcelData = res.data.records;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ checkchange(data) {
|
|
|
+ //节点选中回调
|
|
|
+ if (this.$refs.tree.getCheckedNodes().length === 0) {
|
|
|
+ this.$refs.tree.setCheckedKeys([]);
|
|
|
+ } else if (this.$refs.tree.getCheckedNodes().length >= 1) {
|
|
|
+ this.$refs.tree.setCheckedKeys([data.id]);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async saveLinkTab() {
|
|
|
+ //保存按钮
|
|
|
+ let checkNodes = this.$refs.tree.getCheckedNodes();
|
|
|
+ if (checkNodes.length > 0) {
|
|
|
+ let node = checkNodes[checkNodes.length - 1];
|
|
|
+ if (node.fileType != 3) {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "请先上传Excel表",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ const { data: res } = await saveLinkTab({
|
|
|
+ exceTabId: node.id,
|
|
|
+ tabId: this.GLExcelFrom.id,
|
|
|
+ });
|
|
|
+ console.log(res);
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "关联清表成功",
|
|
|
+ });
|
|
|
+ this.GLExcel =false ;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: "warning",
|
|
|
+ message: "请先设置清表",
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //配置划分
|
|
|
+ configurationClick(row){
|
|
|
+ this.testGLExcel=true
|
|
|
+ },
|
|
|
+ //数据映射配置
|
|
|
+ associatedClick() {
|
|
|
+ this.$router.push({
|
|
|
+ path: '/tentative/dataMap',
|
|
|
+ // query: { pid: this.projectid,wbsid:this.$route.query.wbsid }
|
|
|
+
|
|
|
+
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+ };
|
|
|
+ </script>
|
|
|
+
|
|
|
+ <style>
|
|
|
+ </style>
|
|
|
+
|
yangyj