|
|
@@ -0,0 +1,198 @@
|
|
|
+<template>
|
|
|
+ <normalLayout>
|
|
|
+ <template #content>
|
|
|
+ <div style="padding: 20px 20px 5px 20px;">
|
|
|
+ <div class="mt-10">
|
|
|
+ <label class="search__label" >范围:</label>
|
|
|
+ <el-cascader size="small" ref="selectdep" :options="deplist" :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}" @change="selectDep" clearable></el-cascader>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-scrollbar >
|
|
|
+ <div style="min-width: 1500px;padding: 10px 20px 5px 20px;height:calc(100vh - 300px)">
|
|
|
+ <div style="width: 20%;float: left" >
|
|
|
+ <el-table border :data="list" ref="table" highlight-current-row @row-click="rowClick">
|
|
|
+ <el-table-column
|
|
|
+ prop="projectname"
|
|
|
+ label="项目名称"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="projecttype"
|
|
|
+ label="项目类型"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="tradefield"
|
|
|
+ label="领域"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="负责人">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{scope.row.leader[0].name}}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div style="width: 100%">
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page="param.content.pageNumber"
|
|
|
+ :page-sizes="[20, 50, 100, 200]"
|
|
|
+ :page-size="20"
|
|
|
+ layout="total, prev, pager, next, jumper"
|
|
|
+ :total="total">
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div style="width: 79%;float: right;">
|
|
|
+ <mindmap v-if="flag" ref="project" class="inline-16" style="width:calc(150vh - 130px);height:calc(100vh - 300px) " :id="sa_projectid" ></mindmap>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-scrollbar>
|
|
|
+ </template>
|
|
|
+ </normalLayout>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import mindmap from "@/components/mindmap/project.vue";
|
|
|
+export default {
|
|
|
+ name: "index",
|
|
|
+ components:{mindmap},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ value:1,
|
|
|
+ list:[],
|
|
|
+ total:0,
|
|
|
+ flag:false,
|
|
|
+ sa_projectid:'',
|
|
|
+ depmentParam:{
|
|
|
+ "id": 20230620102004,
|
|
|
+ "content": {
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deplist:[],
|
|
|
+ param:{
|
|
|
+ "id":20221020143502,
|
|
|
+ "content":{
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "type":'',
|
|
|
+ "deleted": 0,
|
|
|
+ "isExport": false,
|
|
|
+ "isend": 0
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ selectChange(){
|
|
|
+ this.listData()
|
|
|
+ },
|
|
|
+ async departmentrtment() {
|
|
|
+ const res = await this.$api.requested(this.depmentParam)
|
|
|
+ this.deplist = this.createMenu(res.data.dep)
|
|
|
+ /*this.range = JSON.parse(window.sessionStorage.getItem('active_account')).name*/
|
|
|
+ },
|
|
|
+ createMenu (array) {
|
|
|
+ var that = this
|
|
|
+ let arr = []
|
|
|
+ function convertToElementTree(node) {
|
|
|
+ // 新节点
|
|
|
+ if (node.subdep.length === 0){
|
|
|
+ var elNode = {
|
|
|
+ label: node["depname"],
|
|
|
+ parentid:node['parentid'],
|
|
|
+ parentname:node['parentname'],
|
|
|
+ departmentid:node["departmentid"],
|
|
|
+ value:node["departmentid"],
|
|
|
+ remarks:node["remarks"],
|
|
|
+ isused:node["isused"],
|
|
|
+ changedate:node['changedate'],
|
|
|
+ changeby:node['changeby'],
|
|
|
+ createdate:node['createdate'],
|
|
|
+ createby:node['createby'],
|
|
|
+ depno:node['depno'],
|
|
|
+ disabled:that.pageOnlyRead,
|
|
|
+ }
|
|
|
+ }else {
|
|
|
+ var elNode = {
|
|
|
+ label: node["depname"],
|
|
|
+ parentid:node['parentid'],
|
|
|
+ parentname:node['parentname'],
|
|
|
+ departmentid:node["departmentid"],
|
|
|
+ value:node["departmentid"],
|
|
|
+ remarks:node["remarks"],
|
|
|
+ isused:node["isused"],
|
|
|
+ changedate:node['changedate'],
|
|
|
+ changeby:node['changeby'],
|
|
|
+ createdate:node['createdate'],
|
|
|
+ createby:node['createby'],
|
|
|
+ depno:node['depno'],
|
|
|
+ disabled:that.pageOnlyRead,
|
|
|
+ children: []
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (node.subdep && node.subdep.length > 0) {
|
|
|
+ // 如果存在子节点
|
|
|
+ for (var index = 0; index < node.subdep.length; index++) {
|
|
|
+ // 遍历子节点, 把每个子节点看做一颗独立的树, 传入递归构造子树, 并把结果放回到新node的children中
|
|
|
+ elNode.children.push(convertToElementTree(node.subdep[index]));
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return elNode;
|
|
|
+ }
|
|
|
+ array.forEach((element) => {
|
|
|
+ arr.push(convertToElementTree(element))
|
|
|
+ });
|
|
|
+ return arr
|
|
|
+ },
|
|
|
+ selectDep(val) {
|
|
|
+ console.log(val,'val')
|
|
|
+ let dataDep = this.$refs.selectdep.getCheckedNodes(true)[0].data
|
|
|
+ this.range = dataDep.label
|
|
|
+ },
|
|
|
+ async listData(){
|
|
|
+ this.param.content.type = this.value
|
|
|
+ const res = await this.$api.requested(this.param)
|
|
|
+ this.list = res.data
|
|
|
+ this.total = res.total
|
|
|
+ this.sa_projectid = res.data[0].sa_projectid
|
|
|
+ this.flag = true
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ this.$refs.project.getData()
|
|
|
+ this.$refs.table.setCurrentRow(this.list[0])
|
|
|
+ })
|
|
|
+ },
|
|
|
+ rowClick(val){
|
|
|
+ console.log(val)
|
|
|
+ this.sa_projectid = val.sa_projectid
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ this.$refs.project.getData()
|
|
|
+ this.flag = true
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
+ handleSizeChange(val) {
|
|
|
+ // console.log(`每页 ${val} 条`);
|
|
|
+ this.param.content.pageSize = val
|
|
|
+ this.listData()
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ // console.log(`当前页: ${val}`);
|
|
|
+ this.param.content.pageNumber = val
|
|
|
+ this.listData()
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.listData()
|
|
|
+ this.departmentrtment()
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+
|
|
|
+</style>
|
qymljy