|
|
@@ -22,34 +22,43 @@
|
|
|
<div class="pb_head top">
|
|
|
<span>目标管理设置</span>
|
|
|
<div class="student_button">
|
|
|
- <el-button type="primary" class="bgColor" @click="addED">添加目标管理</el-button>
|
|
|
+ <el-button type="primary" class="bgColor" @click="addED"
|
|
|
+ >添加目标管理</el-button
|
|
|
+ >
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="student_head">
|
|
|
<div class="student_search">
|
|
|
<el-input placeholder="请输入名称" v-model="sn"></el-input>
|
|
|
- <el-button type="primary" class="btn" @click="search">查询</el-button>
|
|
|
+ <el-button type="primary" class="btn" @click="search"
|
|
|
+ >查询</el-button
|
|
|
+ >
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="pb_content_body" style="height: 100%">
|
|
|
<div class="e_box">
|
|
|
- <div class="e_card" v-for="(item,index) in dataArray" :key="index">
|
|
|
+ <div class="e_card" v-for="(item, index) in dataArray" :key="index">
|
|
|
<div class="e_card_picture">
|
|
|
<img src="../../assets/e_picture.png" />
|
|
|
</div>
|
|
|
<div class="e_card_name">
|
|
|
- <span>{{item.title}}</span>
|
|
|
+ <span>{{ item.title }}</span>
|
|
|
</div>
|
|
|
<div class="e_card_time">
|
|
|
- <span>{{item.time}}</span>
|
|
|
+ <span>{{ item.time }}</span>
|
|
|
</div>
|
|
|
<div class="e_card_btn">
|
|
|
<span @click="checkE(item)">查看</span>
|
|
|
<span @click="deleteE(item.id)">删除</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div v-if="dataArray.length === 0" style="margin:0 auto;color:#6e6e6e">暂无数据</div>
|
|
|
+ <div
|
|
|
+ v-if="dataArray.length === 0"
|
|
|
+ style="margin: 0 auto; color: #6e6e6e"
|
|
|
+ >
|
|
|
+ 暂无数据
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="student_page">
|
|
|
<el-pagination
|
|
|
@@ -76,7 +85,11 @@
|
|
|
<div class="e_add_top">
|
|
|
<div class="e_add_title">
|
|
|
<span>目标管理名称</span>
|
|
|
- <el-input v-model="eTitle" placeholder="请输入名称" @change="setMindData"></el-input>
|
|
|
+ <el-input
|
|
|
+ v-model="eTitle"
|
|
|
+ placeholder="请输入名称"
|
|
|
+ @change="setMindData"
|
|
|
+ ></el-input>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="e_add_content">
|
|
|
@@ -86,12 +99,17 @@
|
|
|
<img src="../../assets/add.png" @click="addE(1)" alt />
|
|
|
</div>
|
|
|
<div class="e_add_list_body">
|
|
|
- <div class="e_add_list_child" v-for="(item,index) in eJson" :key="index">
|
|
|
+ <div
|
|
|
+ class="e_add_list_child"
|
|
|
+ v-for="(item, index) in eJson"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
<span
|
|
|
- :class="{active:item.id == fid}"
|
|
|
- v-if="item.name.length<8"
|
|
|
+ :class="{ active: item.id == fid }"
|
|
|
+ v-if="item.name.length < 8"
|
|
|
@click="checkF(item.id)"
|
|
|
- >{{item.name}}</span>
|
|
|
+ >{{ item.name }}</span
|
|
|
+ >
|
|
|
<el-tooltip
|
|
|
v-else
|
|
|
class="item"
|
|
|
@@ -99,32 +117,49 @@
|
|
|
:content="item.name"
|
|
|
placement="top-start"
|
|
|
>
|
|
|
- <span :class="{active:item.id == fid}" @click="checkF(item.id)">{{item.name}}</span>
|
|
|
+ <span
|
|
|
+ :class="{ active: item.id == fid }"
|
|
|
+ @click="checkF(item.id)"
|
|
|
+ >{{ item.name }}</span
|
|
|
+ >
|
|
|
</el-tooltip>
|
|
|
- <img src="../../assets/delete.png" @click="deleteF(item.id)" alt />
|
|
|
+ <img
|
|
|
+ src="../../assets/delete.png"
|
|
|
+ @click="deleteF(item.id)"
|
|
|
+ alt
|
|
|
+ />
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="e_add_list_detail" v-if="fid">
|
|
|
- <textarea placeholder="添加目标描述" v-model="eJson[fid].detail"></textarea>
|
|
|
+ <textarea
|
|
|
+ placeholder="添加目标描述"
|
|
|
+ v-model="eJson[fid].detail"
|
|
|
+ ></textarea>
|
|
|
</div>
|
|
|
<!-- <div class="e_add_list_btn">添加二级标题</div> -->
|
|
|
</div>
|
|
|
<div class="e_add_list">
|
|
|
<div class="e_add_list_title">
|
|
|
<span>二级目标</span>
|
|
|
- <img src="../../assets/add.png" @click="addE(2)" v-if="fid != ''" alt />
|
|
|
+ <img
|
|
|
+ src="../../assets/add.png"
|
|
|
+ @click="addE(2)"
|
|
|
+ v-if="fid != ''"
|
|
|
+ alt
|
|
|
+ />
|
|
|
</div>
|
|
|
<div class="e_add_list_body">
|
|
|
<div
|
|
|
class="e_add_list_child"
|
|
|
- v-for="(item,index) in fid && eJson[fid].child"
|
|
|
+ v-for="(item, index) in fid && eJson[fid].child"
|
|
|
:key="index"
|
|
|
>
|
|
|
<span
|
|
|
- :class="{active:item.id == sid}"
|
|
|
- v-if="item.name.length<8"
|
|
|
+ :class="{ active: item.id == sid }"
|
|
|
+ v-if="item.name.length < 8"
|
|
|
@click="checkS(item.id)"
|
|
|
- >{{item.name}}</span>
|
|
|
+ >{{ item.name }}</span
|
|
|
+ >
|
|
|
<el-tooltip
|
|
|
v-else
|
|
|
class="item"
|
|
|
@@ -132,32 +167,51 @@
|
|
|
:content="item.name"
|
|
|
placement="top-start"
|
|
|
>
|
|
|
- <span :class="{active:item.id == sid}" @click="checkS(item.id)">{{item.name}}</span>
|
|
|
+ <span
|
|
|
+ :class="{ active: item.id == sid }"
|
|
|
+ @click="checkS(item.id)"
|
|
|
+ >{{ item.name }}</span
|
|
|
+ >
|
|
|
</el-tooltip>
|
|
|
- <img src="../../assets/delete.png" @click="deleteS(item.id)" alt />
|
|
|
+ <img
|
|
|
+ src="../../assets/delete.png"
|
|
|
+ @click="deleteS(item.id)"
|
|
|
+ alt
|
|
|
+ />
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="e_add_list_detail" v-if="sid">
|
|
|
- <textarea placeholder="添加目标描述" v-model="eJson[fid].child[sid].detail"></textarea>
|
|
|
+ <textarea
|
|
|
+ placeholder="添加目标描述"
|
|
|
+ v-model="eJson[fid].child[sid].detail"
|
|
|
+ ></textarea>
|
|
|
</div>
|
|
|
<!-- <div class="e_add_list_btn">添加二级标题</div> -->
|
|
|
</div>
|
|
|
<div class="e_add_list">
|
|
|
<div class="e_add_list_title">
|
|
|
<span>三级目标</span>
|
|
|
- <img src="../../assets/add.png" @click="addE(3)" v-if="sid != ''" alt />
|
|
|
+ <img
|
|
|
+ src="../../assets/add.png"
|
|
|
+ @click="addE(3)"
|
|
|
+ v-if="sid != ''"
|
|
|
+ alt
|
|
|
+ />
|
|
|
</div>
|
|
|
<div class="e_add_list_body">
|
|
|
<div
|
|
|
class="e_add_list_child"
|
|
|
- v-for="(item,index) in fid && sid && eJson[fid].child[sid].child"
|
|
|
+ v-for="(item, index) in fid &&
|
|
|
+ sid &&
|
|
|
+ eJson[fid].child[sid].child"
|
|
|
:key="index"
|
|
|
>
|
|
|
<span
|
|
|
- :class="{active:item.id == tid}"
|
|
|
- v-if="item.name.length<8"
|
|
|
+ :class="{ active: item.id == tid }"
|
|
|
+ v-if="item.name.length < 8"
|
|
|
@click="checkT(item.id)"
|
|
|
- >{{item.name}}</span>
|
|
|
+ >{{ item.name }}</span
|
|
|
+ >
|
|
|
<el-tooltip
|
|
|
v-else
|
|
|
class="item"
|
|
|
@@ -165,22 +219,47 @@
|
|
|
:content="item.name"
|
|
|
placement="top-start"
|
|
|
>
|
|
|
- <span :class="{active:item.id == tid}" @click="checkT(item.id)">{{item.name}}</span>
|
|
|
+ <span
|
|
|
+ :class="{ active: item.id == tid }"
|
|
|
+ @click="checkT(item.id)"
|
|
|
+ >{{ item.name }}</span
|
|
|
+ >
|
|
|
</el-tooltip>
|
|
|
- <img src="../../assets/delete.png" @click="deleteT(item.id)" alt />
|
|
|
+ <img
|
|
|
+ src="../../assets/delete.png"
|
|
|
+ @click="deleteT(item.id)"
|
|
|
+ alt
|
|
|
+ />
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="e_add_list_detail" v-if="tid">
|
|
|
- <textarea placeholder="添加目标描述" v-model="eJson[fid].child[sid].child[tid].detail"></textarea>
|
|
|
+ <textarea
|
|
|
+ placeholder="添加目标描述"
|
|
|
+ v-model="eJson[fid].child[sid].child[tid].detail"
|
|
|
+ ></textarea>
|
|
|
</div>
|
|
|
<!-- <div class="e_add_list_btn">添加二级标题</div> -->
|
|
|
</div>
|
|
|
- <Mind :showBar="false" :mindData="data"></Mind>
|
|
|
+ <div class="e_add_list_pbox">
|
|
|
+ <div class="e_add_list_pbox_title">
|
|
|
+ <span class="type_title">切换模式</span>
|
|
|
+ <div class="type_content">
|
|
|
+ <span :class="{'active':typeMode==1}" @click="typeMode = 1">目标树</span>
|
|
|
+ <span :class="{'active':typeMode==2}" @click="typeMode = 2">目标罗盘</span>
|
|
|
+ <span :class="{'active':typeMode==3}" @click="typeMode = 3">目标看板</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="e_add_list_pbox_content">
|
|
|
+ <Mind :showBar="false" :mindData="data" v-show="typeMode == 1"></Mind>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<span slot="footer" class="dialog-footer">
|
|
|
<el-button @click="dialogVisible = false">关 闭</el-button>
|
|
|
- <el-button @click="addEJson" type="primary" v-if="!update">确 定</el-button>
|
|
|
+ <el-button @click="addEJson" type="primary" v-if="!update"
|
|
|
+ >确 定</el-button
|
|
|
+ >
|
|
|
<el-button @click="updateEJson" type="primary" v-else>修 改</el-button>
|
|
|
</span>
|
|
|
</el-dialog>
|
|
|
@@ -257,6 +336,7 @@ export default {
|
|
|
dataArray: [],
|
|
|
update: false,
|
|
|
eid: "",
|
|
|
+ typeMode:1
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
@@ -485,6 +565,7 @@ export default {
|
|
|
this.update = false;
|
|
|
this.init();
|
|
|
this.setMindData();
|
|
|
+ this.typeMode = 1;
|
|
|
this.dialogVisible = true;
|
|
|
},
|
|
|
checkE(res) {
|
|
|
@@ -808,4 +889,49 @@ export default {
|
|
|
padding: 5px;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
+
|
|
|
+.e_add_list_pbox {
|
|
|
+ margin: 15px 0 0 0;
|
|
|
+ width: 500px;
|
|
|
+ height: 500px;
|
|
|
+}
|
|
|
+.e_add_list_pbox_title {
|
|
|
+ height: 50px;
|
|
|
+ background: #fff;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.type_title{
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: 700;
|
|
|
+}
|
|
|
+.type_content{
|
|
|
+ font-size: 16px;
|
|
|
+ margin-left: 30px;
|
|
|
+}
|
|
|
+.type_content span+span{
|
|
|
+ margin-left: 20px;
|
|
|
+}
|
|
|
+.type_content span{
|
|
|
+ cursor: pointer;
|
|
|
+ padding-bottom: 5px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.type_content .active{
|
|
|
+ color: #409eff;
|
|
|
+ border-bottom: 2px solid #409eff;
|
|
|
+}
|
|
|
+
|
|
|
+.e_add_list_pbox_content {
|
|
|
+ height: calc(100% - 50px);
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
</style>
|
