yichael_zhongchuang_front_2/components/home/teacher/project.vue

<template>
	<view class="m_right">
		<image src="../../../assets/home/homeBG.png" class="s_logo" mode=""></image>
		<view class="m_right_container">

			<view class="m_row_class">
				<view class="m_row">
					<view class="m_row_link">

					</view>
					<view class="m_row_title" v-text="'项目管理'">

					</view>
					<view style="position: relative;margin-left: 40rpx;">
						<div class="triangle_border_down">
							<span></span>
						</div>
					</view>
				</view>

				<table style="width: 100%;border: 1px solid #DDDDDD;border-collapse: collapse">
					<thead class="m-table-hander">
						<tr>
							<th>名称</th>
							<th>类型</th>
							<th>介绍</th>
							<th>创始人</th>
							<th>修改</th>
							<th>删除</th>
						</tr>
					</thead>
					<tbody>
						<tr v-for="(item,index) in projectData" :key="index">
						<!-- 	<t-table @change="change"> 
							<t-tr> </t-tr> 
							<t-tr>{{item.ProjectName}}</t-tr>
							<t-tr>{{item.Type}}</t-tr>
							<t-tr>{{item.Describe}}</t-tr>
							<t-tr>{{item.CreateUserName}}</t-tr>
							<t-tr style="position: relative;"><button type="default" size="mini" @click="edit(index)" class="m_edit">修改</button></t-tr>
							<t-tr style="position: relative;"><button type="default" size="mini" @click="delete1(index)" class="m_delete">删除</button></t-tr>
							</t-table> -->
							
							<th>{{item.ProjectName}}</th>
							<th>{{item.Type}}</th>
							<!-- <th>{{item.Describe}}</th> -->
							<th>{{item.Type}}</th>
							<th>{{item.CreateUserName}}</th>
							<th style="position: relative;"><button type="default" size="mini" @click="edit(index)" class="m_edit">修改</button></th>
							<th style="position: relative;"><button type="default" size="mini" @click="delete1(index)" class="m_delete">删除</button></th>
						</tr>
					</tbody>
				</table>

			</view>
			<view class="m_row_class">
				<view class="" style="display: flex;justify-content: space-between;">

					<view class="m_row">
						<view class="m_row_link">

						</view>
						<view class="m_row_title" v-text="'文件管理'">

						</view>
						<view style="position: relative;margin-left: 40rpx;">
							<div class="triangle_border_down">
								<span></span>
							</div>
						</view>
					</view>
					<view class="">
						<button type="default" class="m_btn_download" size="mini" @click="onClick_addFile">添加文件</button>
					</view>
				</view>
				<table style="width: 100%;border: 1px solid #DDDDDD;border-collapse: collapse">
					<thead class="m-table-hander">
						<tr>
							<th>文件</th>
							<th>文件名</th>
							<th>文件类型</th>
							<th>上传人</th>
							<th>上传日期</th>
							<th>下载</th>
							<th>删除</th>
							<th>审核</th>
						</tr>
					</thead>
					<tbody>
						<tr v-for="(item,index) in fileData" :key="index">
							<th>{{index+1}}</th>
							<th>{{item.Name}}</th>
							<th>{{item.Type}}</th>
							<th>{{item.UploadUserName}}</th>
							<th>{{item.UPloadTime.substring(0,9)}}</th>
							<th style="position: relative;"><button type="default" size="mini" @click="download(index)" class="m_edit">下载</button></th>
							<th style="position: relative;"><button type="default" size="mini" @click="delete1(index)" class="m_delete">删除</button></th>
							<th style="position: relative;"><button type="default" size="mini" @click="audit(item)" class="m_audit">审核</button></th>
						</tr>
					</tbody>
				</table>

			</view>
			<view class="m_row_class">
				<view class="" style="display: flex;justify-content: space-between;">
					<view class="m_row">
						<view class="m_row_link">

						</view>
						<view class="m_row_title" v-text="'成员管理'">

						</view>
						<view style="position: relative;margin-left: 40rpx;">
							<div class="triangle_border_down">
								<span></span>
							</div>
						</view>
					</view>
					<view class="">
						<button type="default" class="m_btn_download" size="mini" @click="addMember">添加学生</button>
					</view>
				</view>
				<view class="df fdr aic addMember_box showboder" v-show="isShowAddMember">
					<view class="addMember_input_box">
						<input class="addMember_input" type="string" v-model="addedMemberModel.IlabAccount" />
					</view>
					<view class="addMember_btn df aic jcc">添加</view>
				</view>
				<table style="width: 100%;border: 1px solid #DDDDDD;border-collapse: collapse">
					<thead class="m-table-hander">
						<tr>
							<th>用户名</th>
							<th>姓名</th>
							<th>专业</th>
							<th>班级</th>
							<th>职务</th>
							<th>电话</th>
							<th>删除</th>
						</tr>
					</thead>
					<tbody>
						<tr v-for="(item,index) in projectMembers" :key="index">
							<th>{{item.User.IlabAccount}}</th>
							<th>{{item.User.Name}}</th>
							<th>{{item.User.Profession}}</th>
							<th>{{item.User.Class}}</th>
							<th>
								<div>
									<!-- <input type="number" value="" /> -->
									{{item.User.Type}}
								</div>
							</th>
							<th>{{item.User.PhoneNum}}</th>
							<th style="position: relative;"><button type="default" size="mini" class="m_delete" @click="delete1(item)">删除</button></th>
						</tr>

					</tbody>
				</table>

			</view>
		</view>
		<msg ref="msg" :title="title" @determine="determine" :btnArr="arr" v-show="show"></msg>
		<audit ref="audit" v-show="auditshow" @determine="determine"></audit>
		<!-- <locationtemp ref="location_temp"></locationtemp> -->
	</view>
</template>

<script>
	import msg from "./msg.vue"
	import audit from "./audit.vue"
	// import locationtemp from "./location_temp.vue"
	// import api from "../../../api/project.js"
	export default {
		name: "home_project",
		data() {
			return {
				index: 1,
				title: "",
				show: false,
				auditshow: false,
				callback: "",
				arr: [],
				data: [],
				projectData: [],
				ProjectItem: [],
				fileData: [],
				projectMembers: [],
				isShowAddMember: false,
				addedMemberModel: {
					"IlabAccount": '',
					"AddUserID": ''
				},
			}
		},
		components: {
			msg,
			audit,
			// locationtemp
		},
		created() {
			// this.getlist();
			// this.getFileList();
		},
		methods: {
			paging(obj) {
				this.index = obj;
			},
			delete1(index) {
				this.title = "是否删除信息?";
				this.arr = ["删除", "取消"]
				this.show = true;
			},
			download(index) {
				this.title = "下载成功?";
				this.arr = ["确认"];
				this.show = true;
			},
			edit(index) {
				this.title = "是否删除信息?";
				this.arr = ["删除", "取消"]
				this.show = true;
			},
			audit(index) {
				this.title = "是否确认审核?";
				this.arr = ["通过", "未通过"]
				this.show = true;
				this.callback = "audit"
				// this.auditshow = true;
			},
			determine(obj) {
				this.show = false;
				this.auditshow = false;
				switch (this.callback) {
					case "audit": //审核
						const data = {
							ProjectItemID: "xxxx",
							Pass: obj == 0
						}
						this.auditPost(data);
						break;
					default:
						break;
				}
				// if (this.audit == "audit") {

				// }

				console.log(obj)
			},
			auditPost(obj) {
				uni.request({
					url: this.$Api + "/project/setfilepass",
					data: obj,
					method: "POST",
					dataType: "json",
					success: res => {
						var {
							data
						} = res;
						alert(data.msg);
					}
				})
			},
			getlist() {
				uni.request({
					url: this.$Api + "/project/getprojectcontent",
					data: {
						"UserID": this.$UserId
					},
					method: "POST",
					dataType: "json",
					success: res => {

						var {
							data
						} = res;
						this.projectData = data.Projects;

					}
				})
			},
			getFileList() {
				console.log("用户id");
				console.log(this.$UserId);
				console.log(this.projectData[0].Id);
				uni.request({
					url: this.$Api + "/project/getprojectcontent",
					data: {
						"UserID": this.$UserId,
						"ProjectID": this.projectData[0].Id
					},
					method: "POST",
					dataType: "json",
					success: res => {
						this.fileData = res.data.ProjectItem;
						// console.log('this.fileData=',this.fileData)
					}
				})
				// var temp = {
				// 	"UserID": this.$UserId,
				// 	"ProjectID": this.projectData[0].Id
				// }
				// uni.request({
				// 	url: this.$Api + "/project/getprojectcontent",
				// 	data: temp,
				// 	method: "POST",
				// 	dataType: "json",
				// 	success: res => {
				// 		var {
				// 			data
				// 		} = res;
				// 		if (data.code == 100) {
				// 			this.fileData = data.ProjectItem;
				// 			console.log('this.fileData=',this.fileData)
				// 		}
				// 	}
				// })

			},
			viewProject(obj) {
				this.projectData = [obj];
				this.getFileList();
				this.getMemberList();
			},
			getMemberList() {
				var temp = {
					"ProjectID": this.projectData[0].Id
				}
				uni.request({
					url: this.$Api + "/project/getmember",
					data: temp,
					method: "POST",
					dataType: "json",
					success: res => {
						console.log("请求学生", res);
						if (res.data.Code == 100) {
							this.projectMembers = res.data.Users;
							console.log();
						}
					}
				})
			},
			addMember() {
				this.isShowAddMember = true;
			},
			onClick_addMember_ok() {
				console.log("添加学生", this.addedMemberModel);
				var temp = {
					"UserID": this.projectData[0].CreateUserID, //项目创建人ID
					"ProjectID": this.projectData[0].Id, //项目ID
					"AddUserID": mydata_userInfo.UserID, //添加人员ID 支持ilabID UserID
					"Type": "美术师" //编剧 摄影师 录音师 灯光师 创建人
				}
				uni.request({
					url: this.$Api + "/project/getmember",
					data: temp,
					method: "POST",
					dataType: "json",
					success: res => {
						console.log("请求学生", res);
						if (res.data.Code == 100) {
							this.projectMembers = res.data.Users;
							console.log();
						}
					}
				})
			},
			onClick_addFile(){
				
			}
		}
	}
</script>

<style lang="scss">
	.m_right {
		width: 100%;
		margin-top: 5rpx;
		// padding: 0 150rpx;
		background-color: #fff;
		box-shadow: 3px 0px 6px 0px rgba(0, 0, 0, 0.1);

		.m_right_container {
			padding: 150rpx;
		}

		.s_logo {
			width: 100%;
			height: 800rpx;
		}

		.m_right_hander {
			text-align: right;
			height: 250rpx;
			position: relative;

			.m_btn_red {
				position: absolute;
				height: 80rpx;
				line-height: 80rpx;
				padding: 0 40rpx;
				right: 0;
				top: 50%;
				transform: translateY(-50%);
				background: #EA252C;
				color: #fff;
			}
		}

	}

	.m_btn_download {
		height: 80rpx;
		line-height: 80rpx;
		padding: 0 70rpx;
		background: #EA252C;
		color: #fff;
		font-family: MicrosoftYaHei;
	}

	tbody tr {
		border-top: 2rpx solid #DDDDDD !important;

	}

	tbody tr th:first-child {
		position: relative;
	}

	tbody tr th {
		font-weight: 400 !important;
		height: 140rpx;
		line-height: 140rpx;
	}

	tbody tr:hover {
		// color: #fff;
		background: #FDEBEC;
		// opacity: 0.08;
	}

	.m-table-hander {
		background-color: #FFF8F7;
		height: 140rpx;
		line-height: 140rpx;
		font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
		font-weight: bold;
	}

	.m_edit {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		background: rgb(67, 127, 250);
		color: rgb(255, 255, 255);
		min-width: 130rpx;
	}

	.m_delete {
		position: absolute;
		top: 50%;
		left: 50%;
		min-width: 130rpx;
		transform: translate(-50%, -50%);
		background: rgb(234, 37, 44);
		color: rgb(255, 255, 255);
	}

	.m_right_footer {
		margin-top: 80rpx;
	}

	.m_logoimg {
		width: 80rpx;
		height: 80rpx;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

	.m_paging {
		text-align: right;

		.m_paging_item {
			padding: 10rpx 18rpx;
			border: 1rpx solid #DDDDDD;
			border-radius: 8rpx;
			margin-right: 10rpx;
		}

		.p_act {
			background: #EA252C;
			color: #fff;
			border: inherit;
		}
	}

	.m_paging_item:hover {
		background: #EA252C;
		color: #fff;
		border: inherit;
	}

	.m_act1 {
		color: #FF0019;
	}

	.m_row {
		display: flex;
		height: 60rpx;
		line-height: 60rpx;
		font-size: 30rpx;
		color: #ea252c;
		padding: 0 0 80rpx 0;

	}

	.m_audit {
		position: absolute;
		top: 50%;
		left: 50%;
		min-width: 65px;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		color: white;
		background-color: #FF791B;
	}

	.m_row_link {
		width: 10rpx;
		height: 60rpx;
		background-color: #ea252c;
		margin-right: 40rpx;
	}

	.m_row_title {
		color: #ea252c;
		font-weight: bold;
		font-size: 40rpx;
	}

	/*向下*/
	.triangle_border_down {
		width: 0;
		height: 0;
		border-width: 25rpx 25rpx 0;
		border-style: solid;
		border-color: #ea252c transparent transparent;
		/*灰 透明 透明 */
		margin: 20rpx auto;
		position: relative;
	}

	.m_row_class {
		margin-bottom: 60rpx;
	}
	
	.addMember_box{
		margin-bottom: 50rpx;
		height: 80rpx;
	}

	.addMember_input_box{
		width: 500rpx;
		height: 80rpx;
	}
	.addMember_input {
		width: 100%;
		height: 100%;
		border: 1px solid #ece8e8;
		line-height: 50rpx;
		font-size: 30rpx;
		border-radius: 6rpx;
		padding: 10rpx 40rpx;
	}

	.addMember_btn {
		width: 130rpx;
		height: 80rpx;
		transform: translate(-50%, -50%);
		background: rgb(234, 37, 44);
		color: rgb(255, 255, 255);
	}
</style>