添加自定义模块

src/views/kanBan/components/AschoolFeature.vue

@@ -324,6 +324,86 @@
 			</div>
 		</div>
 
+		<template v-if="CampusF.customTemplate && CampusF.customTemplate.length">
+			<div class="feature" v-for="(i,index) in CampusF.customTemplate" :key="index">
+				<!-- 标题区域 -->
+				<div class="topTit">
+					<div>
+						<div>{{ i.tit }}</div>
+						<div
+							style="
+								height: 4px;
+								background-color: #0663fe;
+								width: 2rem;
+								margin-top: 6px;
+							"
+						></div>
+					</div>
+					
+					<div>
+						<img
+							v-if="userinfo.role == 1 && userinfo.type == 1"
+							class="topTitEdit"
+							@click="editregion(4,index)"
+							src="../../../assets/img/bianji.svg"
+							alt=""
+						/>
+					</div>
+				</div>
+				<!-- 简介区域 -->
+				<div class="TopbriKl">
+					{{
+						i.bri
+							? i.bri
+							: "暂无简介"
+					}}
+				</div>
+				<!-- 内容区域  -->
+				<div class="featureAll">
+					<div class="featureCon2" v-for="(k, index) in i.list" :key="index+'a'">
+						<el-tooltip
+							class="item"
+							effect="dark"
+							:content="k.bri"
+							placement="bottom"
+						>
+							<div class="featureConTit2">{{ k.bri }}</div>
+						</el-tooltip>
+						<el-tooltip
+							class="item"
+							effect="dark"
+							:content="k.bri"
+							placement="bottom"
+						>
+							<div class="Topbri">{{ k.name }}</div>
+						</el-tooltip>
+					</div>
+				</div>
+			</div>
+		</template>
+		
+		<template v-if="userinfo.role == 1 && userinfo.type == 1">
+			<div class="topTit">
+				<div>
+					<div>添加自定义模块</div>
+					<div
+						style="
+							height: 4px;
+							background-color: #0663fe;
+							width: 2rem;
+							margin-top: 6px;
+						"
+					></div>
+				</div>
+			</div>
+			<div class="FedialogJIa" style="display: flex" @click="addTemVisible = true">
+				<div style="width: 100%; border: 1px #000 dashed; cursor: pointer">
+					<img src="../../../assets/kanban/jia.svg" alt="" />
+				</div>
+			</div>
+		</template>
+		
+
 		<!-- 修改校区特色弹框 -->
 		<el-dialog
 			:title="editTitle"
@@ -382,7 +462,7 @@
 						</div>
 					</div>
 
-					<!-- 办学特色 -->
+					<!-- 办学特色 isBtn === 1-->
 					<div
 						style="display: flex; flex-direction: column; gap: 10px"
 						v-if="isBtn === 1"
@@ -529,7 +609,7 @@
 						</div>
 					</div>
 
-					<!-- 师资力量 -->
+					<!-- 师资力量 isBtn === 2-->
 					<div
 						style="display: flex; flex-direction: column; gap: 10px"
 						v-if="isBtn === 2"
@@ -711,9 +791,232 @@
 							</div>
 						</div>
 					</div>
+
+					<!-- 自定义模块 isBtn === 4-->
+					<div
+						style="display: flex; flex-direction: column; gap: 10px"
+					>
+						<!-- 模块名称 -->
+						<div style="background: #fff;border-radius: 10px;padding: 16px;box-sizing: border-box;">
+							<div class="mouD">
+								<el-input v-if="editIndex == 'tit'" v-model="CampusF.customTemplate[TemNum].tit" placeholder="模块名称"></el-input>
+								<div class="mouDTitDiv" v-else>{{ CampusF.customTemplate[TemNum].tit }}</div>
+								<img
+									@click="editFea('tit')"
+									class="topTitEdit"
+									:src="
+										editIndex == 'tit'
+											? editBtnType == 1
+												? require('../../../assets/kanban/bz.svg')
+												: require('../../../assets/kanban/lj.svg')
+											: require('../../../assets/kanban/feaB.svg')
+									"
+									alt=""
+								/>
+								
+							</div>
+							<div
+								class="diaBtn"
+								style="padding: 0"
+								v-if="editIndex == 'tit'"
+							>
+								<div style="color: #000" @click="feaClo()">取消</div>
+								<div
+									style="background: #fff"
+									:style="{
+										border:
+											editBtnType == 1
+												? '1px #9747FF solid'
+												: '1px #0663fe solid',
+										color: editBtnType == 1 ? '#9747FF' : '#0663fe',
+									}"
+									@click="setJsonL(0)"
+								>
+									保存
+								</div>
+							</div>
+						</div>
+
+						<!-- 简介区域 -->
+						<div
+							class="diaFea"
+							:style="{
+								border: editIndex == 'bri' ? '2px dashed #9747FF' : '',
+							}"
+						>
+							<div style="display: flex; justify-content: space-between">
+								<div class="itemTit">简介</div>
+								<div
+									style="
+										display: flex;
+										justify-content: space-between;
+										gap: 10px;
+										align-items: center;
+									"
+								>
+									<img
+										@click="editFea('bri')"
+										class="topTitEdit"
+										:src="
+											editIndex == 'bri'
+												? editBtnType == 1
+													? require('../../../assets/kanban/bz.svg')
+													: require('../../../assets/kanban/lj.svg')
+												: require('../../../assets/kanban/feaB.svg')
+										"
+										alt=""
+									/>
+								</div>
+							</div>
+							<div>
+								<el-input
+									:disabled="editIndex != 'bri'"
+									resize="none"
+									style="border-radius: 10px; overflow: hidden"
+									type="textarea"
+									:rows="4"
+									:style="{
+										border:
+											editIndex == 'bri'
+												? editBtnType == 1
+													? '1px dashed #9747FF'
+													: '1px dashed #3681FC'
+												: ' 1px solid #969BA3',
+									}"
+									:class="editIndex == 'bri' ? 'tArea' : ''"
+									placeholder="请输入内容"
+									v-model="CampusF.customTemplate[TemNum].bri"
+								>
+								</el-input>
+								<div
+									class="diaBtn"
+									style="padding: 0"
+									v-if="editIndex == 'bri'"
+								>
+									<div style="color: #000" @click="feaClo()">取消</div>
+									<div
+										style="background: #fff"
+										:style="{
+											border:
+												editBtnType == 1
+													? '1px #9747FF solid'
+													: '1px #0663fe solid',
+											color: editBtnType == 1 ? '#9747FF' : '#0663fe',
+										}"
+										@click="setJsonL(0)"
+									>
+										保存
+									</div>
+								</div>
+							</div>
+						</div>
+
+						<!-- 循环区域 -->
+						<div
+							class="diaFea"
+							:style="{
+								border:
+									editIndex == index
+										? editBtnType == 1
+											? '2px dashed #9747FF'
+											: '2px dashed #3681FC'
+										: '',
+							}"
+							v-for="(i, index) in CampusF.customTemplate[TemNum].list"
+							:key="index + 'b'"
+						>
+							<div
+								style="
+									display: flex;
+									justify-content: space-between;
+									gap: 16px;
+									height: 28px;
+								"
+							>
+								<el-input
+									v-if="editIndex == index"
+									resize="none"
+									style="border-radius: 10px"
+									placeholder="请输入标题"
+									v-model="i.name"
+								>
+								</el-input>
+								<div v-else class="itemTit">{{ i.name ? i.name : '标题' }}</div>
+								<div
+									style="
+										display: flex;
+										justify-content: space-between;
+										gap: 10px;
+										align-items: center;
+									"
+								>
+									<img
+										@click="editFea(index)"
+										class="topTitEdit"
+										v-if="!(editBtnType == 2 && editIndex == index)"
+										:src="
+											editIndex == index
+												? editBtnType == 1
+													? require('../../../assets/kanban/bz.svg')
+													: require('../../../assets/kanban/lj.svg')
+												: require('../../../assets/kanban/feaB.svg')
+										"
+										alt=""
+									/>
+									<img
+										@click="delFe(index)"
+										class="topTitEdit"
+										src="../../../assets/kanban/delK.svg"
+										alt=""
+									/>
+								</div>
+							</div>
+							<div>
+								<el-input
+									:disabled="editIndex != index"
+									resize="none"
+									:style="{
+										border:
+											editIndex == index
+												? editBtnType == 1
+													? '1px dashed #9747FF'
+													: '1px dashed #3681FC'
+												: ' 1px solid #969BA3',
+									}"
+									:class="editIndex == index ? 'tArea' : ''"
+									style="border-radius: 10px; overflow: hidden"
+									type="textarea"
+									:rows="4"
+									placeholder="请输入内容"
+									v-model="i.bri"
+								>
+								</el-input>
+								<div
+									class="diaBtn"
+									style="padding: 0"
+									v-if="editIndex == index"
+								>
+									<div style="color: #000" @click="feaClo(index)">取消</div>
+									<div
+										style="background: #fff"
+										:style="{
+											border:
+												editBtnType == 1
+													? '1px #9747FF solid'
+													: '1px #0663fe solid',
+											color: editBtnType == 1 ? '#9747FF' : '#0663fe',
+										}"
+										@click="setJsonL(0)"
+									>
+										保存
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
 				</div>
 				<div
-					v-if="isBtn === 1 || isBtn === 2"
+					v-if="isBtn === 1 || isBtn === 2 || isBtn === 4"
 					@click="additem()"
 					style="
 						display: flex;
@@ -744,6 +1047,112 @@
 			</div>
 		</el-dialog>
 
+
+		<!-- 添加自定义模块-->
+		<el-dialog
+			title="添加自定义模块"
+			:visible.sync="addTemVisible"
+			close-on-click-modal
+			class="Fedialog"
+			:before-close="handleClose"
+		>
+			<div class="diaCon" id="bottomElement">
+				<div
+					style="display: flex; flex-direction: column; gap: 10px"
+				>
+					<!-- 模块名称 -->
+					<div style="background: #fff;border-radius: 10px;padding: 16px;box-sizing: border-box;">
+						<div class="mouD">
+							<el-input v-model="mouldD.tit" placeholder="模块名称"></el-input>
+						</div>
+					</div>
+
+					<!-- 简介区域 -->
+					<div
+						class="diaFea"
+					>
+						<div>
+							<div class="itemTit">简介</div>
+						</div>
+						<div>
+							<el-input
+								resize="none"
+								style="border-radius: 10px; overflow: hidden;border: 1px solid #969BA3;"
+								type="textarea"
+								:rows="4"
+								placeholder="请输入内容"
+								v-model="mouldD.bri"
+							>
+							</el-input>
+						</div>
+					</div>
+
+					<!-- 循环区域 -->
+					<div
+						class="diaFea"
+						v-for="(i, index) in mouldD.list"
+						:key="index + 'b'"
+					>
+						<div
+							style="
+								display: flex;
+								justify-content: space-between;
+								gap: 16px;
+								height: 28px;
+							"
+						>
+							<el-input
+								resize="none"
+								style="border-radius: 10px"
+								placeholder="请输入标题"
+								v-model="i.name"
+							>
+							</el-input>
+
+							
+						</div>
+						<div>
+							<el-input
+								resize="none"
+								style="border-radius: 10px; overflow: hidden;border: 1px solid #969BA3"
+								type="textarea"
+								:rows="4"
+								placeholder="请输入内容"
+								v-model="i.bri"
+							>
+							</el-input>
+						</div>
+					</div>
+
+					<div
+						@click="addtempitem"
+						style="
+							display: flex;
+							align-items: center;
+							padding: 10px 20px;
+							box-sizing: border-box;
+							cursor: pointer;
+						"
+					>
+						<img src="../../../assets/kanban/feaJ.svg" alt="" />
+						<span style="color: #0560fd">添加</span>
+					</div>
+					<div class="diaBtn" style="padding: 0 20px 10px !important">
+						<div style="color: #000" @click="handleClose">
+							取 消
+						</div>
+						<div
+							type="primary"
+							style="background: #0663fe;color: #fff;"
+							@click="addTemp"
+						>
+							确 定
+						</div>
+					</div>
+				</div>
+			</div>
+		</el-dialog>
+
 		<!-- 常见应用弹框 -->
 		<el-dialog
 			title="应用列表"
@@ -844,27 +1253,30 @@ export default {
 	},
 	data() {
 		return {
+			// 常见应用弹框
 			dialogVisible: false,
+			appinp:'', //搜索框
 
-			appinp:'',
 
 			// 0默认颜色 1编辑 2添加
 			editBtnType: 0,
 			// 添加与编辑弹框显示
 			editVisible: false,
+			// 判断点击的哪个部分的编辑按钮
+			// 0集团简介 1办学特色 2师资力量 3特色应用 4自动定义模块
+			isBtn: -1,
+
 			// app应用列表
 			usuallyList: [],
+			loading: false,//列表加载
+
 			// 正在编辑哪一个
 			editIndex: null,
 
 			// 上传图片loading
 			diaLoad: false,
 
-			loading: false,
-			appLoading: false,
 
-			// 判断点击的哪个部分的编辑按钮
-			isBtn: -1,
 
 			// 所有应用列表
 			appList: [],
@@ -878,6 +1290,18 @@ export default {
 			// 整体数据
 			Alldata: {},
 			AllLoading: false,
+
+
+			addTemVisible:false,
+			TemNum:0,
+			// 添加自定义模块模板
+			mouldD:{
+				tit:'',
+				bri:'',
+				list:[
+					{name:'',bri:''}
+				]
+			}
 		};
 	},
 	computed: {
@@ -919,8 +1343,8 @@ export default {
 			if (this.isBtn == 0) return "编辑集团简介";
 			else if (this.isBtn == 1) return "编辑办学特色";
 			else if (this.isBtn == 2) return "编辑师资力量";
-			else if (this.isBtn == 3) return "添加特色应用";
-			else if (this.isBtn == 4) return "编辑特色应用";
+			else if (this.isBtn == 4) return `编辑${this.CampusF.customTemplate[this.TemNum].tit}`;
+			else if (this.isBtn == 5) return "添加自定义模块";
 			else return ""; // 默认值
 		},
 	},
@@ -932,6 +1356,23 @@ export default {
 		},
 	},
 	methods: {
+		// 添加自定义模块item
+		addtempitem(){
+			if (this.hasEmptyData2(this.mouldD.list))
+					return this.$message.info("请填充空数据");
+			this.mouldD.list.push({name:'',bri:''})
+		},
+		// 添加自定义模块
+		addTemp(){
+			if (!this.mouldD.tit.trim()) return this.$message.error('请填充模块名称')
+			if (!this.mouldD.bri.trim()) return this.$message.error('请填充模块简介')
+
+			if (!this.CampusF.customTemplate) {
+				this.CampusF.customTemplate = []
+			}
+			this.CampusF.customTemplate.push(this.mouldD)
+			this.setJson(1)
+		},
 		// 修改特色应用
 		updateUApplist() {
 			this.CampusF.appList = [...this.CampusF.appList, ...this.selectedItem];
@@ -974,16 +1415,26 @@ export default {
 						behavior: "smooth",
 					});
 				}, 0);
+			} else if (this.isBtn == 4) {
+				if (this.CampusF.customTemplate[this.TemNum].list.length && this.hasEmptyData2(this.CampusF.customTemplate[this.TemNum].list))
+					return this.$message.info("请填充空数据");
+				this.CampusF.customTemplate[this.TemNum].list.push({ bri: "", name: "" });
+				this.editIndex = this.CampusF.customTemplate[this.TemNum].list.length - 1;
+				setTimeout(() => {
+					document.querySelector("#bottomElement").scrollTo({
+						top: document.querySelector("#bottomElement").scrollHeight,
+						behavior: "smooth",
+					});
+				}, 0);
 			}
 		},
-
 		// 点击区块编辑
-		async editregion(type) {
+		async editregion(type,index) {
 			this.editIndex = null;
 			this.editBtnType = 0;
+			this.TemNum = index
 			this.isBtn = type;
 			this.editVisible = true;
-			this.appLoading = true;
 		},
 		//删除集团简介中的图片
 		delImg(ind) {
@@ -995,10 +1446,10 @@ export default {
 			this.CampusF = JSON.parse(JSON.stringify(this.Alldata.admin.CampusF));
 			this.editIndex = ind;
 		},
-
 		handleClose() {
 			this.dialogVisible = false;
 			this.editVisible = false;
+			this.addTemVisible = false
 			this.isBtn = -1;
 			this.appList = [];
 			this.editIndex = null;
@@ -1008,6 +1459,15 @@ export default {
 			if (this.Alldata.admin.CampusF) {
 				this.CampusF = JSON.parse(JSON.stringify(this.Alldata.admin.CampusF));
 			}
+			// 重置自定义模板
+			this.mouldD = {
+				tit:'',
+				bri:'',
+				list:[
+					{name:'',bri:''}
+				]
+			}
+				
 		},
 		// 删除
 		delFe(index) {
@@ -1023,11 +1483,12 @@ export default {
 					} else if (this.isBtn == 2) {
 						this.CampusF.teacherN.list.splice(index, 1);
 					} else if (this.isBtn == 3) {
-						console.log("66666", index);
-
 						this.CampusF.appList.splice(index, 1);
+					} else if (this.isBtn == 4) {
+
+						this.CampusF.customTemplate[this.TemNum].list.splice(index, 1)
 					}
-					this.setJson(0);
+					// this.setJson(0);
 					// this.$message.success('删除成功！');
 				})
 				.catch(() => {
@@ -1089,6 +1550,8 @@ export default {
 				}
 			} else if (this.isBtn == 3) {
 				this.CampusF.appList = data.appList;
+			} else if (this.isBtn == 4) {
+				this.CampusF.customTemplate = data.customTemplate
 			}
 		},
 		// 保存时添加判断
@@ -1114,6 +1577,19 @@ export default {
 						this.CampusF.appList[ind].detail;
 				}
 
+				this.setJson(0);
+			} else if (this.isBtn == 4) {
+				// // 特色应用
+				// if (!this.CampusF.customTemplate[this.TemNum].tit)
+				// 	return this.$message.info("请填充模块名称");
+				// if (!this.CampusF.customTemplate[this.TemNum].bri)
+				// 	return this.$message.info("请填充简介");
+				
+				// if (this.CampusF.customTemplate[this.TemNum].list.length && this.hasEmptyData2(this.CampusF.customTemplate[this.TemNum].list))
+				// 	return this.$message.info("请填充空数据");
+
+				// 	console.log('66666');
+					
 				this.setJson(0);
 			}
 		},
@@ -1139,6 +1615,9 @@ export default {
 			if (this.isBtn == 1 && this.hasEmptyData(this.CampusF.feature))
 				return this.$message.info("请填充空数据");
 
+			if (this.isBtn == 4 && (!this.CampusF.customTemplate[this.TemNum].tit.trim() || !this.CampusF.customTemplate[this.TemNum].bri.trim() || (this.CampusF.customTemplate[this.TemNum].list.length && this.hasEmptyData2(this.CampusF.customTemplate[this.TemNum].list))))
+				return this.$message.info("请填充空数据");
+
 			this.editIndex = null;
 			this.diaLoad = true;
 			let _form = JSON.parse(JSON.stringify(this.Alldata));
@@ -1204,19 +1683,19 @@ export default {
 								uid: this.userinfo.userid,
 								cid: this.userinfo.organizeid,
 								type: "user_op",
-								content: `修改了${this.userinfo.schoolName}的权限设置`,
+								content: `修改了${this.userinfo.schoolName}的校区特色`,
 							},
 							"success"
 						);
 					} else {
-						this.$message.error("修改权限失败");
+						this.$message.error("修改失败");
 					}
 					this.diaLoad = false;
 				})
 				.catch((err) => {
 					console.log(err);
 					this.diaLoad = false;
-					this.$message.error("修改权限失败");
+					this.$message.error("修改失败");
 
 					this.addOp3(
 						"1",
@@ -1225,7 +1704,7 @@ export default {
 							uid: this.userid,
 							cid: this.data.id,
 							type: "user_op",
-							content: `修改了${this.data.name}的权限设置`,
+							content: `修改了${this.data.name}的校区特色`,
 						},
 						err
 					);
@@ -1776,7 +2255,7 @@ export default {
 	gap: 15px;
 }
 .FedialogJIa div {
-	height: 160px;
+	height: 122px;
 	display: flex;
 	justify-content: center;
 	align-items: center;
@@ -2026,6 +2505,26 @@ export default {
 .applistTop >>> .el-input__inner{
 	height: 30px;
 	line-height: 30px;
-
+}
+.mouD{
+	display: flex;gap: 10px;
+	align-items: center;
+	background: #fff;
+	box-sizing: border-box;
+	border-radius: 10px;
+}
+.mouDTitDiv{ 	
+	flex: 1;
+	border: 1px solid rgb(150, 155, 163);
+	padding: 5px 15px;
+	box-sizing: border-box;border-radius: 5px;
+	color: #C0C4CC;
+}
+.mouD >>> .el-input__inner{
+	border: none;
+	background: #F2F2F2 !important;
+	height: 28px;
+	border-radius: 10px;
+	color: #000 !important;
 }
 </style>

src/views/kanBan/components/dataBoardNew/index.vue

@@ -79,7 +79,7 @@ export default {
   width: 100% ;
   border-radius: 8px;
   overflow: auto;
-  padding: 0 30px;
+  /* padding: 0 30px; */
   box-sizing: border-box;
 }
 
@@ -138,7 +138,7 @@ export default {
     font-family: PingFang SC;
     font-weight: 500;
     font-size: 16px;
-    padding: 0 30px;
+    /* padding: 0 30px; */
     box-sizing: border-box;
     /* height: 50px; */
     color: #969BA3;

src/views/kanBan/index.vue

@@ -45,8 +45,8 @@
             </div>
             
             <div class="mainArea">
-                <div v-if="isActive === 1 || isActive === 2">
-                    <schoolArea v-if="fromL.admin.school.list.length" :schId="schId" :schOrg="schOrg" @cutSch="cutSch"/>
+                <div v-if="(isActive === 1 || isActive === 2) && fromL.admin.school.list.length">
+                    <schoolArea :schId="schId" :schOrg="schOrg" @cutSch="cutSch"/>
                 </div>
 
                 <div class="right_content">