123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259 |
- <template>
- <basic-container>
- <div class="flex">
- <div class="flex1 mg-r-20">
- <p>工程节点信息</p>
- <div class="flex">
- <el-input placeholder="输入关键字进行过滤" v-model="filterText"></el-input>
- <el-button type="info" class="mg-l-20">导入划分</el-button>
- </div>
- <el-tree
- class="filter-tree" lazy
- :load="loadNode" @node-click="getNodeDetail"
- :props="defaultProps"
- highlight-current
- :filter-node-method="filterNode"
- ref="tree">
- <span class="custom-tree-node" slot-scope="{ node, data }">
- <span>
- {{ node.label }}
- <el-dropdown @click="command=>{setLeftType(command,data)}">
- <el-button
- type="text" icon="el-icon-more" class="normal-black">
- </el-button>
- <el-dropdown-menu slot="dropdown">
- <el-dropdown-item @click.native="setLeftType(1,data,node)" icon="el-icon-circle-plus-outline">新增子级</el-dropdown-item>
- <el-dropdown-item @click.native="setLeftType(2,data,node)" icon="el-icon-edit">编辑节点</el-dropdown-item>
- <el-dropdown-item @click.native="setLeftType(3,data,node)" icon="el-icon-document-copy">复制节点</el-dropdown-item>
- <el-dropdown-item @click.native="setLeftType(4,data,node)" icon="iconfont hcicon-danganziliao-biaogetianxie" class="font-s-12">表单设置</el-dropdown-item>
- <el-dropdown-item @click.native="setLeftType(5,data,node)" icon="el-icon-coin">元素设置</el-dropdown-item>
- </el-dropdown-menu>
- </el-dropdown>
- </span>
- </span>
- </el-tree>
- </div>
- <div class="flex1">
- <template v-if="leftType==2 || leftType==1">
- <p>节点信息</p>
- <el-table :data="tableData" border style="width: 100%">
- <el-table-column align="center" prop="deptName" label="当前节点" ></el-table-column>
- <el-table-column align="center" prop="deptCategory" label="节点类型" width="180"></el-table-column>
- <el-table-column align="center" prop="parentName" label="上级节点"></el-table-column>
- </el-table>
- </template>
- <template v-if="leftType==4">
- <el-table :data="formData" border style="width: 100%">
- <el-table-column align="center" prop="tableName" label="表单名称" ></el-table-column>
- <el-table-column align="center" prop="tableType" label="表单类型"></el-table-column>
- <el-table-column align="center" prop="elementTotal" label="元素总量"></el-table-column>
- <el-table-column align="center" prop="isCreateTable" label="是否创建表"></el-table-column>
- <el-table-column align="center" prop="tableName" label="所属方"></el-table-column>
- <el-table-column label="操作">
- <template slot-scope="scope">
- <el-button
- size="mini"
- @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
- <el-button
- size="mini"
- type="danger"
- @click="handleDelete(scope.$index, scope.row)">删除</el-button>
- </template>
- </el-table-column>
- </el-table>
- </template>
- </div>
- </div>
- <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="50%" append-to-body>
- <el-form ref="nodeDetail" :model="nodeDetail" label-width="110px">
- <el-form-item label="节点名称">
- <el-input v-model="nodeDetail.deptName"></el-input>
- </el-form-item>
- <el-form-item label="上级节点">
- <el-input v-model="nodeDetail.parentName" disabled></el-input>
- </el-form-item>
- <el-form-item label="节点类型">
- <el-select v-model="nodeDetail.deptCategory" placeholder="请选择" class="w-100p">
- <el-option v-for="item in deptCategorylist" :key="item.id" :label="item.dictValue" :value="item.dictKey"></el-option>
- </el-select>
- </el-form-item>
- <el-form-item label="划分编号">
- <el-input v-model="nodeDetail.partitionCode"></el-input>
- </el-form-item>
- <el-form-item label="唯一编码">
- <el-input v-model="nodeDetail.uniqueCode"></el-input>
- </el-form-item>
- <el-form-item label="是否有混凝土">
- <el-radio-group v-model="nodeDetail.isConcrete" size="small">
- <el-radio :label="0" border>无</el-radio>
- <el-radio :label="1" border>有</el-radio>
- </el-radio-group>
- </el-form-item>
- <el-form-item label="是否试验节点">
- <el-radio-group v-model="nodeDetail.isExpernode" size="small">
- <el-radio :label="0" border>否</el-radio>
- <el-radio :label="1" border>是</el-radio>
- </el-radio-group>
- </el-form-item>
- <el-form-item label="试验节点">
- <el-input v-model="nodeDetail.remark" type="textarea"></el-input>
- </el-form-item>
- </el-form>
- <span slot="footer" class="dialog-footer">
- <el-button @click="dialogVisible = false">取 消</el-button>
- <el-button type="primary" @click="saveNode">确 定</el-button>
- </span>
- </el-dialog>
- </basic-container>
- </template>
- <script>
- import {getLazytree,getDetail,update,selectByNodeTable} from "@/api/manager/wbstree";
- import {getDictionary} from "@/api/system/dict";
- import {mapGetters} from "vuex";
- export default {
- data() {
- return {
- id:'',
- filterText:'',
- treeData:[],
- defaultProps: {
- children: 'children',
- label: 'title',
- isLeaf: function(data){
- return !data.hasChildren;
- }
- },
- leftType:2,
- curTreeData:{},
- tableData:[],
- nodeDetail:{},
- formData:[],
- dialogVisible:false,
- deptCategorylist:[],
- };
- },
- computed: {
- ...mapGetters(["userInfo"]),
- dialogTitle:function(){
- let text = '节点';
- if(this.leftType == 1){
- text = '新增'+text;
- }else if(this.leftType == 2){
- text = '编辑'+text;
- }
- return text;
- },
- },
- created() {
- this.init();
- },
- methods: {
- init(){
- this.id = this.$route.params.id;
- },
- loadNode(node, resolve){
- let pid = 0;
- if (node.level != 0) {
- pid = node.data.id
- }
- getLazytree(this.id ,pid).then((res)=>{
- return resolve(res.data.data);
- })
- },
- getNodeDetail(data,node){
- //console.log(data,node,ref)
- let parentName = '';
- if(node.parent.data){
- parentName = node.parent.data.title;
- }
- this.curTreeData = data;
- this.curTreeData.parentName = parentName;
- getDetail(data.id).then((res)=>{
- res.data.data.parentName = parentName;
- this.tableData = [res.data.data];
- this.nodeDetail = Object.assign({},res.data.data);
- })
- },
- saveNode(){
- update(this.nodeDetail).then(()=>{
- let node = this.tableData[0];
- node.deptName = this.nodeDetail.deptName;
- node.deptCategory = this.nodeDetail.deptCategory;
- this.curTreeData.title = this.nodeDetail.deptName;
- this.dialogVisible = false;
- this.$message({
- type: "success",
- message: "操作成功!"
- });
- })
- },
- addNode(){
- },
- setLeftType(type,data,node){
- this.leftType = type;
- this.curTreeData = data;
- if(this.leftType == 1 || this.leftType == 2){
- this.getDeptCategorylist();
- this.dialogVisible = true;
- }
- getDetail(data.id).then((res)=>{
- let parentName = '';
- if(node.parent.data){
- parentName = node.parent.data.title;
- }
- res.data.data.parentName = parentName;
- this.tableData = [res.data.data];
- if(this.leftType == 1){
- this.nodeDetail = {
- parentId:res.data.data.id,
- parentName:parentName
- };
- }else{
- this.nodeDetail = Object.assign({},res.data.data);
- }
- })
- if(this.leftType == 4){
- selectByNodeTable(data.id).then((res)=>{
- console.log(res)
- })
- }
-
- },
- getDeptCategorylist(){
- if(this.deptCategorylist.length >1){
- return;
- }
- getDictionary({
- code:'wbs_node_type'
- }).then((res)=>{
- this.deptCategorylist = res.data.data;
- })
- },
- filterNode(value, data) {
- if (!value) return true;
- return data.label.indexOf(value) !== -1;
- }
- }
- };
- </script>
- <style scoped lang="scss">
- .font-s-12 /deep/ .iconfont{
- font-size: 12px;
- }
- .el-popper[x-placement^=bottom]{
- margin-top: -6px;
- }
- </style>
|