|
|
@@ -0,0 +1,312 @@
|
|
|
+<template>
|
|
|
+<el-dialog
|
|
|
+ title="引用元素表"
|
|
|
+ :visible.sync="dialogVisible"
|
|
|
+ width="70%"
|
|
|
+ append-to-body
|
|
|
+ destroy-on-close
|
|
|
+ custom-class="flow-design-dialog"
|
|
|
+
|
|
|
+ >
|
|
|
+
|
|
|
+ <div class="flexStar" >
|
|
|
+ <div class="boxswai" style="width:26%;padding-left:0px;">
|
|
|
+ <div class="boxnei" style="display: flex;flex-direction: column;height:550px">
|
|
|
+ <div style="overflow: auto;flex:1">
|
|
|
+ <avue-tree :option="treeOption" :data="treeData" @node-click="nodeClick" ></avue-tree>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="boxswai" style="width:74%;padding-left:0px;padding-right:0px;">
|
|
|
+ <div class="boxnei" style="flex:1;">
|
|
|
+
|
|
|
+ <avue-crud
|
|
|
+ :data="loadData"
|
|
|
+ :option="loadOption"
|
|
|
+ v-model="obj"
|
|
|
+ :page.sync="page"
|
|
|
+ @on-load="quteonLoad"
|
|
|
+ @selection-change="selectionChange"
|
|
|
+ ref="crud">
|
|
|
+ <template slot="menuLeft" slot-scope="{size}">
|
|
|
+ <el-input placeholder="请输入你想搜索的表单名称" v-model="input3" :size="size" clearable>
|
|
|
+ <i class="el-icon-search" slot="append" @click="searchChange"></i>
|
|
|
+ </el-input>
|
|
|
+ </template>
|
|
|
+ </avue-crud>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogVisible = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="submitQute">确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {tabTypeLazyTreeAll,projecttabInfo} from "@/api/manager/wbsprivate";
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ input3:'',
|
|
|
+ dialogVisible:false,
|
|
|
+ obj: {},
|
|
|
+ treeData:[],
|
|
|
+
|
|
|
+ treeOption:{
|
|
|
+ filter:false,
|
|
|
+ addBtn:false,
|
|
|
+ props:{
|
|
|
+ labelText:'标题',
|
|
|
+ label:'title',
|
|
|
+ value:'id',
|
|
|
+ children:'children'
|
|
|
+ },
|
|
|
+ lazy: true,
|
|
|
+ treeLoad: function (node, resolve) {
|
|
|
+ const parentId = (node.level === 0) ? 12345678910 : node.data.id;
|
|
|
+ tabTypeLazyTreeAll({parentId,current:1,size:200}).then(res => {
|
|
|
+ resolve(res.data.data.records.map(item => {
|
|
|
+ return {
|
|
|
+ ...item,
|
|
|
+ leaf: !item.hasChildren
|
|
|
+ }
|
|
|
+ }))
|
|
|
+
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ selectionList:[],
|
|
|
+ loadData:[],
|
|
|
+ loadOption: {
|
|
|
+ height: 'auto',
|
|
|
+ calcHeight: 30,
|
|
|
+ tip: false,
|
|
|
+ searchShow:false,
|
|
|
+
|
|
|
+ border: true,
|
|
|
+ index: true,
|
|
|
+ viewBtn: false,
|
|
|
+ selection: true,
|
|
|
+ editBtn:false,
|
|
|
+ delBtn:false,
|
|
|
+ addBtn:false,
|
|
|
+ menu:false,
|
|
|
+
|
|
|
+ dialogClickModal: false,
|
|
|
+ column: [
|
|
|
+ {
|
|
|
+ label: "元素表名称",
|
|
|
+ prop: "title",
|
|
|
+ editDisplay: false,
|
|
|
+ addDisplay: false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "元素表类型",
|
|
|
+ prop: "tabType",
|
|
|
+ // search: true,
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请输入名称",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+ label: "元素总量",
|
|
|
+ prop: "elementTotal",
|
|
|
+
|
|
|
+ editDisplay: false,
|
|
|
+ addDisplay: false,
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ message: "请输入表数量",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "所书方",
|
|
|
+ prop: "tabOwner",
|
|
|
+
|
|
|
+ editDisplay: false,
|
|
|
+ addDisplay: false,
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ message: "请输入表数量",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "填报率",
|
|
|
+ prop: "fillRate",
|
|
|
+
|
|
|
+ editDisplay: false,
|
|
|
+ addDisplay: false,
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ message: "请输入表数量",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ ],
|
|
|
+
|
|
|
+ },
|
|
|
+ page:{
|
|
|
+ current:1,
|
|
|
+ size:10,
|
|
|
+ total:10
|
|
|
+ },
|
|
|
+ treeId:''
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ props:{
|
|
|
+ projectid:String,
|
|
|
+ onLoad1:Function,
|
|
|
+ refreshTree:Function
|
|
|
+ },
|
|
|
+ computed:{
|
|
|
+ ids () {
|
|
|
+ let ids = [];
|
|
|
+ this.selectionList.forEach(ele => {
|
|
|
+ ids.push(ele.id);
|
|
|
+ });
|
|
|
+ return ids.join(",");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created(){
|
|
|
+ // this.loadData=this.loadData1;
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ quteonLoad(page){
|
|
|
+ console.log(page,'page');
|
|
|
+ if(this.treeId){
|
|
|
+ this.tabTypeLazyTreeAll(this.treeId, page.currentPage,page.pageSize).then((res)=>{
|
|
|
+ this.loadData=res.records
|
|
|
+ this.page.total=res.total
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ selectionChange (list) {
|
|
|
+ this.selectionList = list;
|
|
|
+ },
|
|
|
+ selectionClear () {
|
|
|
+ this.selectionList = [];
|
|
|
+ this.$refs.crud.toggleSelection();
|
|
|
+ },
|
|
|
+ //搜索
|
|
|
+ searchChange(){
|
|
|
+ if(this.treeId){
|
|
|
+ this.tabTypeLazyTreeAll(this.treeId, this.page.current,this.page.size,this.input3).then((res)=>{
|
|
|
+ this.loadData=res.records
|
|
|
+ this.page.total=res.total
|
|
|
+
|
|
|
+ })
|
|
|
+ }else{
|
|
|
+ this.$message.warning("请先选择左侧节点");
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ resetChange(item){
|
|
|
+ console.log(item);
|
|
|
+ this.tabTypeLazyTreeAll(this.treeId, this.page.current,this.page.size).then((res)=>{
|
|
|
+ this.loadData=res.records
|
|
|
+ this.page.total=res.total
|
|
|
+
|
|
|
+ })
|
|
|
+ },
|
|
|
+ async tabTypeLazyTreeAll ( parentId,current,size,titleName) {//清表树
|
|
|
+ console.log(parentId);
|
|
|
+ const { data: res } = await tabTypeLazyTreeAll({parentId,current,size,titleName} )
|
|
|
+ console.log(res,'tabTypeLazyTreeAll');
|
|
|
+ if (res.code === 200) {
|
|
|
+ return res.data
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ nodeClick(data,node){
|
|
|
+ console.log(data,'treedata');
|
|
|
+ this.treeId=data.id
|
|
|
+ if(data.hasChildren){
|
|
|
+ this.tabTypeLazyTreeAll(data.id, this.page.current,this.page.size).then((res)=>{
|
|
|
+ this.loadData=res.records
|
|
|
+ this.page.total=res.total
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if(data.hasChildren===false&&node.level==2){
|
|
|
+ let arr=[]
|
|
|
+ arr.push(data)
|
|
|
+ this.loadData=arr
|
|
|
+ this.page.total=1
|
|
|
+ }else{
|
|
|
+ this.loadData=[]
|
|
|
+ this.page.total=0
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ handleClose(done) {
|
|
|
+ this.$confirm('确认关闭？')
|
|
|
+ .then(_ => {
|
|
|
+ done();
|
|
|
+ })
|
|
|
+ .catch(_ => {});
|
|
|
+ },
|
|
|
+ show(){
|
|
|
+ this.dialogVisible=true;
|
|
|
+
|
|
|
+ },
|
|
|
+ submitQute(){
|
|
|
+ console.log('确定');
|
|
|
+ console.log(this.ids,'ids');
|
|
|
+
|
|
|
+
|
|
|
+ projecttabInfo(this.ids,this.projectid).then((res)=>{
|
|
|
+ console.log(res,'res');
|
|
|
+ if(res.data.code===200){
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "操作成功!"
|
|
|
+ });
|
|
|
+ this.$refs.crud.toggleSelection();
|
|
|
+ this.dialogVisible=false;
|
|
|
+ this.onLoad1();
|
|
|
+ this.refreshTree()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+/deep/.avue-crud__left{
|
|
|
+ width: 75% !important;
|
|
|
+}
|
|
|
+.boxswai1 .boxnei {
|
|
|
+ -webkit-box-sizing: border-box;
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 14px;
|
|
|
+ border: 1px solid #ebeef5;
|
|
|
+ border-radius: 4px;
|
|
|
+ -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.2);
|
|
|
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.2);
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+</style>
|
duy