1

Signed-off-by: lcw <1324309909@qq.com>

src/App.vue

@@ -199,7 +199,7 @@ body {
 }
 .pb_content_body {
   /* padding: 3rem 0 0 0; */
-  min-height: calc(100% - 5.5rem);
+  min-height: calc(100% - 6rem);
 }
 
 .Router {

src/components/pages/examine.vue

@@ -1,37 +1,228 @@
 <template>
-  <div class="pb_content2" style="background: #fff">
-    <div class="pb_head">
-      <van-icon
-        name="arrow-left"
-        color="#fff"
-        class="pb_back"
-        size="1.2rem"
-        @click="goBack"
-      />
-      <span>义工团审核</span>
-    </div>
-    <div class="pb_content_body"></div>
-  </div>
+	<div class="pb_content2">
+		<div class="pb_head">
+			<van-icon
+				name="arrow-left"
+				color="#fff"
+				class="pb_back"
+				size="1.2rem"
+				@click="goBack"
+			/>
+			<span>义工社团审核</span>
+		</div>
+		<div class="pb_content_body">
+			<div class="body_top_second">
+				<el-input placeholder="搜索成员..."></el-input>
+				<div class="search_img">
+					<img src="../../assets/icon/search.png" alt="" />
+				</div>
+			</div>
+			<div class="choose_box">
+				<div
+					:class="choose == 0 ? 'ischoose' : 'isnochoose'"
+					@click="choose = 0"
+				>
+					未审核
+				</div>
+				<div
+					:class="choose == 1 ? 'ischoose' : 'isnochoose'"
+					@click="choose = 1"
+				>
+					已审核
+				</div>
+			</div>
+			<div class="body_content" v-if="this.choose == 0">
+				<div class="content_body">
+					<div class="content_new">
+						<div class="new_left">
+							<div class="tx">
+								<img src="../../assets/icon/portal.png" alt="" />
+							</div>
+							<div class="tx_nav">
+								<div class="new_title">吴佳琪</div>
+								<div class="new_content">麓城亲子义工任务</div>
+							</div>
+						</div>
+						<div class="new_right" @click="goTo('/examineWork')">去审核</div>
+					</div>
+					<div class="content_new">
+						<div class="new_left">
+							<div class="tx">
+								<img src="../../assets/icon/portal.png" alt="" />
+							</div>
+							<div class="tx_nav">
+								<div class="new_title">吴佳琪</div>
+								<div class="new_content">麓城亲子义工任务</div>
+							</div>
+						</div>
+						<div class="new_right" @click="goTo('/examineWork')">去审核</div>
+					</div>
+					<div class="content_new">
+						<div class="new_left">
+							<div class="tx">
+								<img src="../../assets/icon/portal.png" alt="" />
+							</div>
+							<div class="tx_nav">
+								<div class="new_title">吴佳琪</div>
+								<div class="new_content">麓城亲子义工任务</div>
+							</div>
+						</div>
+						<div class="new_right" @click="goTo('/examineWork')">去审核</div>
+					</div>
+				</div>
+			</div>
+			<div class="body_content" v-if="this.choose == 1">
+				<div class="content_body">
+					<div class="content_new">
+						<div class="new_left">
+							<div class="tx">
+								<img src="../../assets/icon/portal.png" alt="" />
+							</div>
+							<div class="tx_nav">
+								<div class="new_title">吴佳琪</div>
+								<div class="new_content">麓城亲子义工任务</div>
+							</div>
+						</div>
+						<div class="new_right">已审核</div>
+					</div>
+					<div class="content_new">
+						<div class="new_left">
+							<div class="tx">
+								<img src="../../assets/icon/portal.png" alt="" />
+							</div>
+							<div class="tx_nav">
+								<div class="new_title">吴佳琪</div>
+								<div class="new_content">麓城亲子义工任务</div>
+							</div>
+						</div>
+						<div class="new_right">已审核</div>
+					</div>
+					<div class="content_new">
+						<div class="new_left">
+							<div class="tx">
+								<img src="../../assets/icon/portal.png" alt="" />
+							</div>
+							<div class="tx_nav">
+								<div class="new_title">吴佳琪</div>
+								<div class="new_content">麓城亲子义工任务</div>
+							</div>
+						</div>
+						<div class="new_right">已审核</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
 </template>
 
 <script>
-export default {
-  data() {
-    return {};
-  },
-  methods: {
-    goBack() {
-      this.$router.isBack = true;
-      if (window.history.length <= 1) {
-        this.$router.push({ path: "/" });
-        return false;
-      } else {
-        this.$router.go(-1);
-      }
-    },
-  },
-};
+	export default {
+		data() {
+			return {
+				choose: 0,
+			};
+		},
+		methods: {
+      goTo(path) {
+				this.$router.push(path);
+			},
+			goBack() {
+				this.$router.isBack = true;
+				if (window.history.length <= 1) {
+					this.$router.push({ path: "/" });
+					return false;
+				} else {
+					this.$router.go(-1);
+				}
+			},
+		},
+	};
 </script>
 
 <style scoped>
+	.body_top_second {
+		position: relative;
+	}
+	.body_top_second >>> .el-input > input {
+		border: none;
+	}
+	.search_img {
+		width: 1.5rem;
+		height: 1.5rem;
+		position: absolute;
+		top: 0.4rem;
+		right: 0;
+	}
+	.search_img {
+		width: 1rem;
+		height: 1rem;
+	}
+	.search_img > img,
+	.tx > img {
+		width: 100%;
+		height: 100%;
+	}
+	.choose_box {
+		display: flex;
+		margin: 0.5rem;
+	}
+	.ischoose {
+		border-bottom: 5px solid #51c970;
+		border-radius: 0.1rem;
+		padding-bottom: 0.2rem;
+	}
+	.choose_box > div {
+		margin: 0.8rem 0 0 1rem;
+		font-size: 0.7rem;
+		width: 2.8rem;
+		text-align: center;
+	}
+	.isnochoose {
+		color: #9e9e9e;
+	}
+	.content_body {
+		width: 95%;
+		margin: 0 auto;
+		height: 18rem;
+		background: #fff;
+		overflow: auto;
+		border-radius: 0.6rem;
+		box-shadow: 0.2rem 0.5rem 2em #ccc;
+	}
+	.content_new {
+		display: flex;
+		width: 90%;
+		margin: 0 auto;
+		flex-direction: row;
+		padding: 0.4rem 0.6rem 0.2rem 0.6rem;
+		justify-content: space-evenly;
+		border-bottom: 1px dashed #999;
+	}
+	.new_left {
+		display: flex;
+	}
+	.new_title {
+		font-size: 0.8rem;
+		margin-bottom: 0.4rem;
+	}
+	.new_content {
+		font-size: 0.5rem;
+		text-overflow: ellipsis;
+		overflow: hidden;
+		width: 250px;
+		white-space: nowrap;
+	}
+	.new_right {
+		font-size: 0.2rem;
+		line-height: 3rem;
+		color: #f54444;
+	}
+	.tx {
+		width: 2rem;
+		height: 2rem;
+		line-height: 4rem;
+	}
+	.tx_nav {
+		margin: 0.5rem 0 0 0.5rem;
+	}
 </style>

src/components/pages/examineWork.vue

@@ -1,37 +1,183 @@
 <template>
-  <div class="pb_content2" style="background: #fff">
-    <div class="pb_head">
-      <van-icon
-        name="arrow-left"
-        color="#fff"
-        class="pb_back"
-        size="1.2rem"
-        @click="goBack"
-      />
-      <span>吴佳琪的义工任务</span>
-    </div>
-    <div class="pb_content_body"></div>
-  </div>
+	<div class="pb_content2" style="background: #e8e7e7">
+		<div class="pb_head">
+			<van-icon
+				name="arrow-left"
+				color="#fff"
+				class="pb_back"
+				size="1.2rem"
+				@click="goBack"
+			/>
+			<span>吴佳琪的义工任务</span>
+		</div>
+		<div class="pb_content_body" style="position: relative;min-height: calc(100% - 3.5rem);">
+			<div class="is_who_work">
+				<div class="new_left">
+					<div class="tx">
+						<img src="../../assets/icon/portal.png" alt="" />
+					</div>
+					<div class="tx_nav">
+						<div class="new_title">吴佳琪</div>
+						<div class="new_content">三年级五班</div>
+					</div>
+				</div>
+			</div>
+			<div class="work_detail">
+				<div class="work_top">
+					<div class="lag">
+						<img src="../../assets/icon/heart.png" alt="" />
+					</div>
+					<div class="work_title">麓城亲戚义工任务</div>
+				</div>
+				<div class="work_content">
+					开展"家务劳动小能手"让幼儿体会父母的辛苦，激发幼儿为父母分担家务劳动的激情。因此让幼儿在家里做一件力所能及的家务。
+				</div>
+				<div class="work_time">09-24 18:00 周五发布</div>
+			</div>
+			<div class="ex_date">
+				<div class="ex_left">
+					<div class="nolck">
+						<img src="../../assets/icon/nolck.png" alt="" />
+					</div>
+					<div class="ex_time">截止日期</div>
+				</div>
+				<div class="ex_right">09-26 周日 23:59</div>
+			</div>
+			<div class="upload_work" @click="checkNow">审核通过</div>
+		</div>
+	</div>
 </template>
 
 <script>
-export default {
-  data() {
-    return {};
-  },
-  methods: {
-    goBack() {
-      this.$router.isBack = true;
-      if (window.history.length <= 1) {
-        this.$router.push({ path: "/" });
-        return false;
-      } else {
-        this.$router.go(-1);
-      }
-    },
-  },
-};
+	export default {
+		data() {
+			return {};
+		},
+		methods: {
+			goBack() {
+				this.$router.isBack = true;
+				if (window.history.length <= 1) {
+					this.$router.push({ path: "/" });
+					return false;
+				} else {
+					this.$router.go(-1);
+				}
+			},
+			checkNow() {
+				this.$toast.success("审核成功");
+				setTimeout(() => {
+					this.goBack();
+				}, 1000);
+			},
+		},
+	};
 </script>
 
 <style scoped>
+	.is_who_work {
+		display: flex;
+		background: #fff;
+		width: 90%;
+		margin: 0.5rem auto;
+		border-radius: 0.3rem;
+	}
+	.new_left {
+		display: flex;
+		padding: 0.2rem 0 0.5rem 0.8rem;
+	}
+	.new_title {
+		font-size: 0.8rem;
+		margin-bottom: 0.2rem;
+	}
+	.new_content {
+		font-size: 0.5rem;
+		color: #5c5e5d;
+	}
+	.tx {
+		width: 2rem;
+		height: 2rem;
+		line-height: 4rem;
+	}
+	.tx > img {
+		width: 100%;
+		height: 100%;
+	}
+	.tx_nav {
+		margin: 0.5rem 0 0 0.5rem;
+	}
+	.lag > img,
+	.nolck > img {
+		width: 100%;
+		height: 100%;
+	}
+	.lag {
+		width: 1.5rem;
+		height: 1.5rem;
+	}
+	.work_detail {
+		background: #fff;
+		width: 90%;
+		margin: 1rem auto;
+	}
+	.work_top {
+		display: flex;
+		padding: 0.8rem 0.5rem 0 0.5rem;
+	}
+	.work_title {
+		font-size: 0.9rem;
+		font-weight: bold;
+		line-height: 1.4rem;
+		padding-left: 0.4rem;
+		border-radius: 0.3rem;
+	}
+	.work_content {
+		width: 90%;
+		margin: 0 auto;
+		font-size: 0.8rem;
+		color: #999;
+		line-height: 1.5rem;
+		padding: 0.3rem 0 0.8rem 0;
+	}
+	.work_time {
+		color: #999;
+		font-size: 0.4rem;
+		padding: 0.5rem 1.2rem;
+	}
+	.nolck {
+		width: 1.1rem;
+		height: 1.1rem;
+		line-height: 1.9rem;
+	}
+	.ex_date {
+		display: flex;
+		width: 90%;
+		margin: 0 auto;
+		background: #fff;
+		padding: 0.5rem 0;
+		flex-direction: row;
+		justify-content: space-around;
+		border-radius: 0.3rem;
+	}
+	.ex_left {
+		display: flex;
+	}
+	.ex_time {
+		font-size: 0.8rem;
+		line-height: 1.5rem;
+		padding-left: 0.4rem;
+	}
+	.ex_right {
+		font-size: 0.8rem;
+		line-height: 1.5rem;
+	}
+	.upload_work {
+		position: absolute;
+		bottom: 0;
+		width: 100%;
+		height: 2.8rem;
+		background: #f86a6a;
+		color: #fff;
+		text-align: center;
+		line-height: 2.8rem;
+	}
 </style>

src/components/pages/home.vue

@@ -1,323 +1,508 @@
 <template>
-  <div class="pb_content">
-    <div class="pb_head">
-      <span>劳动教育平台</span>
-    </div>
-    <div class="pb_content_body">
-      <div class="swiper-area">
-        <van-swipe :autoplay="2000">
-          <van-swipe-item v-for="item in bannerList" :key="item.id" @click="goTo('/class?cid=' + item.url, item.url)">
-            <!-- <img v-lazy="item.poster" width="100%" alt="" srcset="" /> -->
-            <el-image
-              style="width: 100%; height: 7rem"
-              :src="item.poster"
-              fit="fill"
-            ></el-image>
-          </van-swipe-item>
-          <template #indicator>
-            <div></div>
-          </template>
-        </van-swipe>
-      </div>
-      <div class="recommend-class-box">
-        <div class="recommend-class-title">
-          <span
-            :class="{ active: item.id == active }"
-            @click="getZoneClass(item.id, $event)"
-            v-for="item in zoneList"
-            :key="item.id"
-            >{{ item.name }}</span
-          >
-        </div>
-        <van-pull-refresh
-          style="padding-top: 0.5rem"
-          v-model="refreshing"
-          @refresh="onRefresh"
-          looing-text="释放刷新"
-          pulling-text="下拉刷新"
-        >
-          <van-list
-            v-model="loading"
-            :finished="finished"
-            finished-text="没有更多啦"
-            offset="10"
-            :immediate-check="false"
-            @load="onLoad"
-          >
-            <van-empty
-              class="custom-image"
-              :image="require('../../assets/icon/custom-empty-image.png')"
-              description="暂无数据"
-              v-if="isShow"
-            />
-            <van-row type="flex" v-else>
-              <van-col
-                span="12"
-                v-for="(banner, index) in bannerP"
-                :key="index"
-                @click="goTo('/class?cid=' + banner.courseId, banner.courseId)"
-              >
-                <div class="recommend-box">
-                  <div class="img-box">
-                    <van-image
-                      width="100%"
-                      height="100%"
-                      fit="cover"
-                      :src="banner.imgUrl"
-                    >
-                      <template v-slot:loading>
-                        <van-loading type="spinner" size="20" />
-                      </template>
-                      <template v-slot:error>加载失败</template>
-                    </van-image>
-                  </div>
-                  <div class="van-ellipsis class-title">
-                    {{ banner.title }}
-                  </div>
-                  <div class="class-view">
-                    <i></i>
-                    <span>{{ banner.vcount }}</span>
-                  </div>
-                </div>
-              </van-col>
-            </van-row>
-          </van-list>
-        </van-pull-refresh>
-      </div>
-    </div>
-  </div>
+	<div class="pb_content">
+		<div class="pb_head" style="height: 6rem">
+			<div class="top_first">
+				<div class="tx" @click="goTo('/myDetail')">
+					<img src="../../assets/icon/portal.png" alt="" />
+				</div>
+				<div class="tx_right">
+					<div class="right_first">
+						<div>蓝小琴</div>
+						<div class="leader">
+							<img src="../../assets/icon/gleader.png" alt="" />
+						</div>
+					</div>
+					<div>四年级三班</div>
+				</div>
+			</div>
+			<div class="look_work">
+				<div class="clean">
+					<img src="../../assets/icon/clean.png" alt="" />
+				</div>
+				<div class="audit_work" @click="goTo('/examine')">审核任务</div>
+			</div>
+		</div>
+		<div class="pb_content_body">
+			<div class="body_top">
+				<div class="body_top_first">
+					<div
+						:class="choose == 0 ? 'ischoose' : 'nochoose'"
+						@click="choose = 0"
+					>
+						家
+					</div>
+					<div
+						:class="choose == 1 ? 'ischoose' : 'nochoose'"
+						@click="choose = 1"
+					>
+						校
+					</div>
+					<div
+						:class="choose == 2 ? 'ischoose' : 'nochoose'"
+						@click="choose = 2"
+					>
+						社
+					</div>
+				</div>
+				<div class="body_top_second">
+					<el-input
+						v-if="this.choose == 0 || this.choose == 1"
+						placeholder="请输入任务名搜索.."
+					></el-input>
+					<el-input v-else placeholder="请输入社团名搜索.."></el-input>
+					<div class="search_img">
+						<img src="../../assets/icon/search.png" alt="" />
+					</div>
+				</div>
+				<div
+					style="font-size: 0.8rem; width: 94%; margin: 0.5rem auto"
+					v-if="this.choose == 0 || this.choose == 1"
+				>
+					最近发布任务
+				</div>
+				<div class="body_content" v-if="this.choose == 0">
+					<div class="content_top">
+						<div class="content_top_tb">
+							<img src="../../assets/icon/house.png" alt="" />
+						</div>
+						<div
+							style="font-size: 16px; line-height: 2.2rem; padding-left: 0.5rem"
+						>
+							家庭劳动
+						</div>
+					</div>
+					<div class="content_body">
+						<div class="content_new" @click="goTo('/workDetail')">
+							<div class="new_left">
+								<div class="new_title">绿色快乐农耕园</div>
+								<div class="new_content">
+									开展"家务劳动小能手"让幼儿体会父母的艰苦劳动
+								</div>
+							</div>
+							<div
+								:class="finish == false ? 'new_right' : 'isfinish_new_right'"
+							>
+								{{ this.finish == false ? "去完成" : "已完成" }}
+							</div>
+						</div>
+						<div class="content_new" @click="goTo('/workDetail')">
+							<div class="new_left">
+								<div class="new_title">垃圾分类203</div>
+								<div class="new_content">
+									辛苦，激发幼儿为父母分担家务劳动的激情和孝敬父母的感恩之心
+								</div>
+							</div>
+							<div
+								:class="finish == false ? 'new_right' : 'isfinish_new_right'"
+							>
+								{{ this.finish == false ? "去完成" : "已完成" }}
+							</div>
+						</div>
+						<div class="content_new" @click="goTo('/workDetail')">
+							<div class="new_left">
+								<div class="new_title">制作中秋节灯笼</div>
+								<div class="new_content">
+									因此让幼儿在家里做一件力所能及的家务。
+								</div>
+							</div>
+							<div
+								:class="finish == false ? 'new_right' : 'isfinish_new_right'"
+							>
+								{{ this.finish == false ? "去完成" : "已完成" }}
+							</div>
+						</div>
+					</div>
+				</div>
+				<div class="body_content" v-if="this.choose == 1">
+					<div class="content_top">
+						<div class="content_top_tb">
+							<img src="../../assets/icon/house.png" alt="" />
+						</div>
+						<div
+							style="font-size: 16px; line-height: 2.2rem; padding-left: 0.5rem"
+						>
+							学校劳动
+						</div>
+					</div>
+					<div class="content_body">
+						<div class="content_new">
+							<div class="new_left">
+								<div class="new_title">绿色快乐农耕园</div>
+								<div class="new_content">
+									开展"家务劳动小能手"让幼儿体会父母的艰苦劳动
+								</div>
+							</div>
+							<div
+								:class="finish == false ? 'new_right' : 'isfinish_new_right'"
+							>
+								{{ this.finish == false ? "去完成" : "已完成" }}
+							</div>
+						</div>
+						<div class="content_new">
+							<div class="new_left">
+								<div class="new_title">垃圾分类203</div>
+								<div class="new_content">
+									辛苦，激发幼儿为父母分担家务劳动的激情和孝敬父母的感恩之心
+								</div>
+							</div>
+							<div
+								:class="finish == false ? 'new_right' : 'isfinish_new_right'"
+							>
+								{{ this.finish == false ? "去完成" : "已完成" }}
+							</div>
+						</div>
+						<div class="content_new">
+							<div class="new_left">
+								<div class="new_title">制作中秋节灯笼</div>
+								<div class="new_content">
+									因此让幼儿在家里做一件力所能及的家务。
+								</div>
+							</div>
+							<div
+								:class="finish == false ? 'new_right' : 'isfinish_new_right'"
+							>
+								{{ this.finish == false ? "去完成" : "已完成" }}
+							</div>
+						</div>
+					</div>
+				</div>
+				<div class="body_content" v-if="this.choose == 2">
+					<div class="content_community">
+						<div class="community_top">
+							<div class="community_people">
+								<img src="../../assets/icon/people.png" alt="" />
+							</div>
+							<div class="community_title">莲花街社区志愿者协会</div>
+						</div>
+						<div class="community_content">
+							<div class="community_content_title">
+								“全民防新冠，健康你我他”文明劝导
+							</div>
+							<div class="community_content_time">2021-09-25</div>
+							<div class="content_task">
+								<div>任务介绍</div>
+								<div>宣传防疫知识，劝导行人做好防疫措施、带好口罩</div>
+							</div>
+							<div class="content_rgtime">
+								<div>报名时间</div>
+								<div>2021-09-30</div>
+							</div>
+							<div class="content_phone">
+								<div class="phone">
+									<img src="../../assets/icon/phone.png" alt="" />
+								</div>
+								<div>82575674</div>
+							</div>
+						</div>
+						<div class="community_attend">加入报名</div>
+					</div>
+					<div class="content_community">
+						<div class="community_top">
+							<div class="community_people">
+								<img src="../../assets/icon/people.png" alt="" />
+							</div>
+							<div class="community_title">坂田街道义工联</div>
+						</div>
+						<div class="community_content">
+							<div class="community_content_title">
+								“全民防新冠，健康你我他”文明劝导
+							</div>
+							<div class="community_content_time">2021-09-25</div>
+							<div class="content_task">
+								<div>任务介绍</div>
+								<div>宣传防疫知识，劝导行人做好防疫措施、带好口罩</div>
+							</div>
+							<div class="content_rgtime">
+								<div>报名时间</div>
+								<div>2021-09-30</div>
+							</div>
+							<div class="content_phone">
+								<div class="phone">
+									<img src="../../assets/icon/phone.png" alt="" />
+								</div>
+								<div>82575674</div>
+							</div>
+						</div>
+						<div class="community_attend">加入报名</div>
+					</div>
+					<div class="content_community">
+						<div class="community_top">
+							<div class="community_people">
+								<img src="../../assets/icon/people.png" alt="" />
+							</div>
+							<div class="community_title">福田街道志愿者协会</div>
+						</div>
+						<div class="community_content">
+							<div class="community_content_title">
+								“全民防新冠，健康你我他”文明劝导
+							</div>
+							<div class="community_content_time">2021-09-25</div>
+							<div class="content_task">
+								<div>任务介绍</div>
+								<div>宣传防疫知识，劝导行人做好防疫措施、带好口罩</div>
+							</div>
+							<div class="content_rgtime">
+								<div>报名时间</div>
+								<div>2021-09-30</div>
+							</div>
+							<div class="content_phone">
+								<div class="phone">
+									<img src="../../assets/icon/phone.png" alt="" />
+								</div>
+								<div>82575674</div>
+							</div>
+						</div>
+						<div class="community_attend">加入报名</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
 </template>
 
 <script>
-export default {
-  name:"main-keep-alive",
-  data() {
-    return {
-      loading: false,
-      finished: false,
-      refreshing: false,
-      bannerList: [],
-      bannerP: [],
-      zoneList: [],
-      active: "",
-      page: 1,
-      isShow: false,
-    };
-  },
-  methods: {
-    goTo(path, cid) {
-      let params = [{ cid: cid }];
-      this.ajax
-        .post(this.$store.state.api + "addCourseCount", params)
-        .then((res) => {
-          this.$router.push(path);
-        })
-        .catch((err) => {
-          console.error(err);
-        });
-    },
-    //获取专区
-    getZone() {
-      this.ajax
-        .get(this.$store.state.api + "getZone", "")
-        .then((res) => {
-          this.active = this.active || res.data[0][0].id;
-          console.log(res.data[0]);
-          this.zoneList = res.data[0];
-          this.getZoneClass();
-        })
-        .catch((err) => {
-          console.error(err);
-        });
-    },
-    //获取专区下的课程
-    getZoneClass(groupid, e) {
-      if (groupid) {
-        this.page = 1;
-        var e = e.target;
-        if (e.className == "active") {
-          return;
-        }
-        document.getElementsByClassName("active")[0].className = "";
-        e.className = "active";
-        this.active = groupid;
-      }
-      this.loading = true;
-      let params = {
-        bid: this.active,
-        jid: this.$store.state.userInfo.classid,
-        page: this.page,
-      };
-      this.ajax
-        .get(this.$store.state.api + "getZoneCourse", params)
-        .then((res) => {
-          if (res.data[0].length == 0) {
-            this.isShow = true;
-          } else {
-            this.isShow = false;
-          }
-          this.page++;
-          this.loading = false;
-          this.refreshing = false;
-          this.finished = false;
-          this.bannerP = res.data[0];
-          this.bannerP.filter((element) => {
-            element.imgUrl = JSON.parse(element.chapters).poster;
-            return element;
-          });
-          console.log(this.bannerP);
-        })
-        .catch((err) => {
-          this.loading = false;
-          this.refreshing = false;
-          console.error(err);
-        });
-    },
-    onRefresh() {
-      this.page = 1;
-      this.getZoneClass();
-    },
-    onLoad() {
-      var _this = this;
-      let params = {
-        bid: _this.active,
-        jid: _this.$store.state.userInfo.classid,
-        page: _this.page,
-      };
-      _this.ajax
-        .get(_this.$store.state.api + "getZoneCourse", params)
-        .then((res) => {
-          // this.page++;
-          _this.loading = false;
-          _this.refreshing = false;
-          res.data[0].filter((element) => {
-            element.imgUrl = JSON.parse(element.chapters).poster;
-            return element;
-          });
-          _this.bannerP = _this.bannerP.concat(res.data[0]);
-
-          var num = _this.bannerP.length ? _this.bannerP[0].num : 0;
-          if (_this.bannerP.length < num) {
-            _this.page++;
-            _this.loading = false;
-          } else {
-            _this.finished = true;
-            _this.loading = true;
-          }
-          console.log(_this.bannerP);
-        })
-        .catch((err) => {
-          _this.loading = false;
-          _this.refreshing = false;
-          console.error(err);
-        });
-    },
-    //获取banner
-    getBanner() {
-      this.ajax
-        .get(this.$store.state.api + "getBanner", "")
-        .then((res) => {
-          this.bannerList = res.data[0];
-          console.log(this.bannerList);
-        })
-        .catch((err) => {
-          console.error(err);
-        });
-    },
-  },
-  activated() {
-    this.page = 1;
-    this.getZone();
-    this.getBanner();
-  },
-};
+	export default {
+		data() {
+			return {
+				choose: 0,
+				finish: false,
+			};
+		},
+		methods: {
+			goTo(path) {
+				this.$router.push(path);
+			},
+		},
+		activated() {},
+	};
 </script>
 
 <style scoped>
-.custom-image >>> .van-empty__image {
-  width: 4.5rem;
-  height: auto;
-  /* height: 6.4rem; */
-}
-.swiper-area {
-  clear: both;
-  max-height: 7rem;
-  overflow: hidden;
-}
-
-.recommend-class-box {
-  background: #fff;
-  margin: 0.7rem 0 0 0;
-  padding: 0.2rem;
-}
-.recommend-class-title {
-  margin: 0rem auto;
-  /* display: inline-block; */
-  width: 96%;
-  white-space: nowrap;
-  overflow-x: auto;
-  height: 2.4rem;
-}
-.recommend-class-title::-webkit-scrollbar {
-  width: 0;
-}
-.recommend-class-title span:nth-child(1) {
-  margin-left: 0;
-}
-.recommend-class-title span {
-  margin-left: 1rem;
-}
-.recommend-class-title .active {
-  color: #000;
-  border-bottom: 4px solid rgb(129, 236, 157);
-}
-
-.recommend-class-title span {
-  font-size: 0.85rem;
-  color: #8a8a8a;
-  /* font-weight: bold; */
-}
-
-.recommend-box {
-  margin-bottom: 0.4rem;
-}
-.img-box {
-  border-radius: 5px;
-  overflow: hidden;
-  width: 9.3rem;
-  height: 5rem;
-  margin: 0 auto;
-  box-shadow: #c8c8c8 0px 0px 10px 4px;
-}
-
-.class-title {
-  font-size: 0.72rem;
-  width: 9.3rem;
-  margin: 0.2rem auto 0;
-}
-
-.class-view {
-  font-size: 0.6rem;
-  color: #b4b4b4;
-  width: 9.3rem;
-  margin: 0.2rem auto 0;
-  display: flex;
-  align-items: center;
-}
-
-.class-view i {
-  background-image: url("../../assets/icon/liulan.png");
-  width: 1rem;
-  height: 1rem;
-  background-size: 100% 100%;
-  /* margin-top: 1px; */
-  line-height: 1rem;
-  vertical-align: text-top;
-  background-repeat: no-repeat;
-}
-
-.class-view span {
-  height: 1rem;
-  line-height: 1rem;
-}
+	.top_first {
+		display: flex;
+		flex-direction: row;
+		justify-content: center;
+	}
+	.tx {
+		width: 2.1rem;
+		height: 2.1rem;
+		line-height: 7.5rem;
+	}
+	.tx > img,
+	.search_img > img,
+	.content_top_tb > img,
+	.community_people > img,
+	.phone > img,
+	.leader > img,
+	.clean > img {
+		width: 100%;
+		height: 100%;
+	}
+	.tx_right {
+		display: flex;
+		flex-direction: column;
+		flex-wrap: nowrap;
+		text-align: left;
+		padding-left: 0.4rem;
+	}
+	.right_first > div:nth-child(1) {
+		font-size: 16px;
+		line-height: 3rem;
+		padding-top: 0.8rem;
+	}
+	.right_first {
+		display: flex;
+	}
+	.tx_right > div:nth-child(2) {
+		font-size: 12px;
+		line-height: 0.1rem;
+	}
+	.body_top_first {
+		margin: 0.3rem 0 0.3rem 0;
+		display: flex;
+	}
+	.ischoose {
+		width: 4rem;
+		text-align: center;
+		background: #ff6666;
+		border: 0.1rem solid #ff6666;
+		border-radius: 3rem;
+		color: #fff;
+		font-size: 0.7rem;
+		margin-left: 0.8rem;
+		line-height: 1.2rem;
+		box-shadow: 0px 0.3rem 0.1rem #db4141;
+	}
+	.nochoose {
+		background: #dbdbdb;
+		width: 4rem;
+		text-align: center;
+		border-radius: 3rem;
+		color: #fff;
+		font-size: 0.7rem;
+		margin-left: 0.8rem;
+		line-height: 1.2rem;
+	}
+	.body_top_second {
+		margin-top: 1rem;
+		position: relative;
+	}
+	.body_top_second >>> .el-input {
+		width: 95%;
+		border: none;
+		margin-left: 0.5rem;
+	}
+	.search_img {
+		width: 1.5rem;
+		height: 1.5rem;
+		position: absolute;
+		top: 0.2rem;
+		right: 0.7rem;
+	}
+	.content_top {
+		width: 95%;
+		margin: 0 auto;
+		display: flex;
+		background: #e8e8e8;
+		height: 2.2rem;
+	}
+	.content_top_tb {
+		width: 1.2rem;
+		height: 1.2rem;
+		padding: 0.5rem 0 0.5rem 0.5rem;
+	}
+	.content_body {
+		width: 95%;
+		margin: 0 auto;
+		height: 18rem;
+		background: #fff;
+		overflow: auto;
+	}
+	.content_new {
+		display: flex;
+		width: 86%;
+		margin: 0 auto;
+		flex-direction: row;
+		padding: 0.4rem 0.6rem 0.2rem 0.6rem;
+		justify-content: space-around;
+		border-bottom: 1px dashed #999;
+	}
+	.new_left {
+		display: flex;
+		flex-direction: column;
+		flex-wrap: nowrap;
+	}
+	.new_title {
+		font-size: 0.8rem;
+		font-weight: bold;
+		margin-bottom: 0.4rem;
+	}
+	.new_content {
+		font-size: 0.5rem;
+		text-overflow: ellipsis;
+		overflow: hidden;
+		width: 250px;
+		white-space: nowrap;
+	}
+	.new_right {
+		font-size: 0.2rem;
+		line-height: 3rem;
+		color: #f54444;
+	}
+	.isfinish_new_right {
+		font-size: 0.2rem;
+		line-height: 3rem;
+		color: #6ec784;
+	}
+	.content_community {
+		background: #fff;
+		width: 90%;
+		margin: 1rem auto;
+		border-radius: 0.2rem;
+	}
+	.community_top {
+		background: #e8e8e8;
+		display: flex;
+		width: 100%;
+		padding: 0.5rem 0;
+		margin: 0 auto;
+		height: 1.5rem;
+	}
+	.community_people {
+		width: 1rem;
+		height: 1rem;
+		line-height: 1.5rem;
+		margin: 0 0.5rem;
+	}
+	.community_title {
+		font-size: 16px;
+		line-height: 1.2rem;
+	}
+	.community_content {
+		display: flex;
+		flex-direction: column;
+		border-bottom: 1px solid #e6e6e6;
+	}
+	.community_content_title {
+		font-size: 18px;
+		font-weight: bold;
+		margin: 0.5rem 0;
+	}
+	.community_content_time {
+		font-size: 12px;
+		margin: 0 0.8rem;
+		color: #969696;
+	}
+	.content_task,
+	.content_rgtime,
+	.content_phone {
+		display: flex;
+		margin: 0.4rem 0 0 0.8rem;
+	}
+	.content_task > div:nth-child(1),
+	.content_rgtime > div:nth-child(1) {
+		font-size: 12px;
+		color: #c3c3c3;
+		width: 3rem;
+		line-height: 1rem;
+	}
+	.content_task > div:nth-child(2),
+	.content_rgtime > div:nth-child(2),
+	.content_phone > div:nth-child(2) {
+		font-size: 15px;
+		width: 14rem;
+		text-overflow: ellipsis;
+		overflow: hidden;
+		white-space: nowrap;
+	}
+	.phone {
+		width: 1rem;
+		height: 1rem;
+		margin: 0 0.5rem 0.8rem 0;
+	}
+	.community_attend {
+		padding: 0.5rem 0.5rem;
+		font-size: 16px;
+	}
+	.leader {
+		width: 1.5rem;
+		height: 1rem;
+		line-height: 4.3rem;
+	}
+	.look_work {
+		display: flex;
+		position: absolute;
+		right: 0.5rem;
+		top: 0;
+	}
+	.clean {
+		width: 1rem;
+		height: 1rem;
+		line-height: 3.4rem;
+	}
+	.audit_work {
+		padding-left: 0.2rem;
+		font-size: 0.8rem;
+		line-height: 3.1rem;
+	}
 </style>

src/components/pages/myDetail.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="pb_content2" style="background: #fff">
+  <div class="pb_content myd_content">
     <div class="pb_head">
       <van-icon
         name="arrow-left"
@@ -10,16 +10,354 @@
       />
       <span>个人资料</span>
     </div>
-    <div class="pb_content_body"></div>
+    <div class="pb_content_body">
+      <div class="myd_head">
+        <div class="myd_head_title"><span>头像</span></div>
+
+        <div class="li_head_portal">
+          <van-uploader
+            v-model="fileList"
+            :after-read="afterRead"
+            preview-size="5rem"
+            accept="image/*"
+            capture="camera"
+            preview-full-image="preview-full-image"
+            v-loading="photoLoading"
+            :limit="1"
+          >
+            <img
+              v-lazy="
+                this.userinfo.smailheadportrait
+                  ? this.userinfo.smailheadportrait
+                  : require('../../assets/icon/portal.png')
+              "
+              alt=""
+            />
+          </van-uploader>
+        </div>
+        <van-icon
+          name="arrow"
+          color="#d9d9d9"
+          size="1.2rem"
+          class="arrow_right"
+        />
+      </div>
+      <div class="myd_content_body">
+        <van-cell-group>
+          <van-cell
+            title="真实姓名:"
+            size="large"
+            :value="userinfo.name"
+            @click="updateInfo()"
+            is-link
+          >
+            <template #right-icon>
+              <van-icon
+                name="arrow"
+                color="#d9d9d9"
+                size="1.2rem"
+                class="arrow_left"
+              />
+            </template>
+          </van-cell>
+          <van-cell
+            title="绑定手机号:"
+            size="large"
+            :value="userinfo.phonenumber"
+          >
+            <template #right-icon>
+              <van-icon
+                name="arrow"
+                color="#d9d9d9"
+                size="1.2rem"
+                class="arrow_left"
+              />
+            </template>
+          </van-cell>
+          <van-cell
+            title="地区:"
+            size="large"
+            is-link
+            :value="userinfo.dest"
+            @click="popShow = true"
+          >
+            <template #right-icon>
+              <van-icon
+                name="arrow"
+                color="#d9d9d9"
+                size="1.2rem"
+                class="arrow_left"
+              />
+            </template>
+          </van-cell>
+          <van-cell title="学校:" size="large" :value="userinfo.schoolName">
+            <template #right-icon>
+              <van-icon
+                name="arrow"
+                color="#d9d9d9"
+                size="1.2rem"
+                class="arrow_left"
+              />
+            </template>
+          </van-cell>
+          <van-cell
+            title="家长姓名:"
+            size="large"
+            :value="userinfo.parentname"
+            is-link
+            @click="updateParent()"
+          >
+          <!-- v-if="!(this.$store.state.userInfo.type == '1')" -->
+            <template #right-icon>
+              <van-icon
+                name="arrow"
+                color="#d9d9d9"
+                size="1.2rem"
+                class="arrow_left"
+              />
+            </template>
+          </van-cell>
+          <!-- <van-cell
+            title="老师:"
+            size="large"
+            :value="userinfo.teacherName"
+            is-link
+            @click="popShowA = true"
+            v-if="!(this.$store.state.userInfo.type == '1')"
+          >
+            <template #right-icon>
+              <van-icon
+                name="arrow"
+                color="#d9d9d9"
+                size="1.2rem"
+                class="arrow_left"
+              />
+            </template>
+          </van-cell> -->
+          <van-cell
+            title="班级:"
+            size="large"
+            is-link
+            :value="userinfo.classnameA"
+            @click="updateGrade"
+          >
+          <!-- v-if="!(this.$store.state.userInfo.type == '1')" -->
+            <template #right-icon>
+              <van-icon
+                name="arrow"
+                color="#d9d9d9"
+                size="1.2rem"
+                class="arrow_left"
+              />
+            </template>
+          </van-cell>
+          <!-- <van-cell
+            title="班级:"
+            size="large"
+            :value="userinfo.classname"
+            is-link
+            @click="updateClass()"
+            v-if="!(this.$store.state.userInfo.type == '1')"
+          >
+            <template #right-icon>
+              <van-icon
+                name="arrow"
+                color="#d9d9d9"
+                size="1.2rem"
+                class="arrow_left"
+              />
+            </template>
+          </van-cell> -->
+        </van-cell-group>
+      </div>
+      <div class="exitButton">
+        <button @click="exit">退出登录</button>
+      </div>
+      <van-popup v-model="popShow" position="bottom">
+        <van-picker
+          show-toolbar
+          title="请选择您所在的地区"
+          :columns="fromJson"
+          @cancel="popShow = false"
+          @confirm="onConfirm"
+        />
+      </van-popup>
+      <van-popup v-model="popShowA" position="bottom">
+        <van-picker
+          show-toolbar
+          title="请选择老师"
+          :columns="teacherList"
+          @cancel="popShowA = false"
+          @confirm="onConfirmA"
+        />
+      </van-popup>
+      <van-popup v-model="popShowB" position="bottom">
+        <van-picker
+          show-toolbar
+          title="请选择年级"
+          :columns="classList"
+          @cancel="popShowB = false"
+          @confirm="onConfirmB"
+          v-if="classList.length>0"
+        />
+        <van-picker
+          v-else
+          show-toolbar
+          title="请选择年级"
+          :columns="classList1"
+          @cancel="popShowB = false"
+          @confirm="onConfirmB"
+        />
+      </van-popup>
+    </div>
+    <transition-group name="van-slide-right">
+      <div class="md_upadate_bod" v-show="showUpdateName" key="showUpdateName">
+        <div class="pb_head">
+          <van-icon
+            name="arrow-left"
+            color="#fff"
+            class="pb_back"
+            size="1.2rem"
+            @click="cancelUpdate"
+          />
+          <span>编辑信息</span>
+          <div class="pb_left"><span>保存</span></div>
+        </div>
+        <div class="md_panel_update">
+          <van-field v-model="updateName" placeholder="请输入修改的名字" />
+        </div>
+      </div>
+      <div
+        class="md_upadate_bod"
+        v-show="showUpdateParent"
+        key="showUpdateParent"
+      >
+        <div class="pb_head">
+          <van-icon
+            name="arrow-left"
+            color="#fff"
+            class="pb_back"
+            size="1.2rem"
+            @click="cancelUpdate"
+          />
+          <span>编辑信息</span>
+          <div class="pb_left"><span>保存</span></div>
+        </div>
+        <div class="md_panel_update">
+          <van-field
+            v-model="UpdateParentName"
+            placeholder="请输入修改的家长名字"
+          />
+        </div>
+      </div>
+      <div
+        class="md_upadate_bod"
+        v-show="showUpdateClass"
+        key="showUpdateClass"
+      >
+        <div class="pb_head">
+          <van-icon
+            name="arrow-left"
+            color="#fff"
+            class="pb_back"
+            size="1.2rem"
+            @click="cancelUpdate"
+          />
+          <span>编辑信息</span>
+          <div class="pb_left"><span>保存</span></div>
+        </div>
+        <div class="md_panel_update">
+          <van-field v-model="UpdateClassName" placeholder="请输入修改的班级" />
+        </div>
+      </div>
+    </transition-group>
   </div>
 </template>
 
 <script>
+import { Toast } from "vant";
+import areaList from "../../config/area";
+import "../../common/aws-sdk-2.235.1.min";
 export default {
   data() {
-    return {};
+    return {
+      showUpdateName: false,
+      showUpdateParent: false,
+      showUpdateClass: false,
+      updateName: "",
+      UpdateParentName: "",
+      UpdateClassName: "",
+      userinfo: this.$store.state.userInfo,
+      fromJson: areaList,
+      popShow: false,
+      fileList: [],
+      photoLoading: false,
+      teacherList: [],
+      classList: [],
+      classList1: [{text:"此学校没有设置班级",id:""}],
+      popShowA: false,
+      popShowB: false,
+    };
   },
   methods: {
+    getUser() {
+      let params = { uid: this.userinfo.userid };
+      this.ajax
+        .get(this.$store.state.api + "getUser", params)
+        .then((res) => {
+          this.userinfo = res.data[0][0];
+          // window.sessionStorage.setItem(
+          //   "userInfo",
+          //   JSON.stringify(this.userinfo)
+          // );
+          this.$cookies.set("userInfo",this.userinfo,-1)
+          this.$store.commit("update", ["userInfo", this.userinfo]);
+          this.getClass();
+          console.log(res.data[0][0]);
+        })
+        .catch((err) => {
+          console.error(err);
+        });
+    },
+    getTeacher() {
+      let params = { oid: this.$store.state.userInfo.organizeid };
+      this.ajax
+        .get(this.$store.state.api + "findTeacher", params)
+        .then((res) => {
+          this.teacherList = []
+          res.data[0].filter((element) => {
+            this.teacherList.push({ text: element.name, id: element.userid });
+          });
+          console.log(res.data[0][0]);
+        })
+        .catch((err) => {
+          console.error(err);
+        });
+    },
+    updateGrade() {
+      // if (!this.$store.state.userInfo.tid) {
+      //   this.$toast.fail("请选择老师后在选择年级");
+      //   return;
+      // }
+      this.popShowB = true;
+    },
+    getClass() {
+      // if (this.$store.state.userInfo.tid) {
+        let params = { cid: this.$store.state.userInfo.organizeid };
+        this.ajax
+          .get(this.$store.state.api + "findClassByTeacher", params)
+          .then((res) => {
+            this.classList = [];
+            res.data[0].filter((element) => {
+              this.classList.push({ text: element.name, id: element.id });
+            });
+            console.log(res.data[0][0]);
+          })
+          .catch((err) => {
+            console.error(err);
+          });
+      // }
+    },
     goBack() {
       this.$router.isBack = true;
       if (window.history.length <= 1) {
@@ -29,9 +367,376 @@ export default {
         this.$router.go(-1);
       }
     },
+    cancelUpdate() {
+      this.showUpdateName = false;
+      this.showUpdateParent = false;
+      this.showUpdateClass = false;
+    },
+    updateInfo(type) {
+      this.showUpdateName = true;
+      this.updateName = this.userinfo.name;
+      document
+        .getElementsByClassName("pb_left")[0]
+        .addEventListener("click", (e) => {
+          if (this.updateName === "") {
+            this.$toast.fail("姓名不能修改为空！");
+            return;
+          }
+          let params = [
+            {
+              n: this.updateName,
+              uid: this.$store.state.userInfo.userid,
+            },
+          ];
+          this.ajax
+            .post(this.$store.state.api + "UpdateUserName", params)
+            .then((res) => {
+              this.$toast.success("修改成功");
+              this.userinfo.name = this.updateName;
+              this.showUpdateName = false;
+              this.getUser();
+            })
+            .catch((err) => {
+              this.userinfo.smailheadportrait = "";
+              this.fileList = [];
+              this.$toast.success("修改失败");
+              console.error(err);
+            });
+        });
+    },
+    updateParent() {
+      this.showUpdateParent = true;
+      this.UpdateParentName = this.userinfo.parentname;
+      document
+        .getElementsByClassName("pb_left")[1]
+        .addEventListener("click", (e) => {
+          if (this.UpdateParentName === "") {
+            this.$toast.fail("家长姓名不能修改为空！");
+            return;
+          }
+          let params = [
+            {
+              n: this.UpdateParentName,
+              uid: this.$store.state.userInfo.userid,
+            },
+          ];
+          this.ajax
+            .post(this.$store.state.api + "UpdateUserParent", params)
+            .then((res) => {
+              this.$toast.success("修改成功");
+              this.userinfo.parentname = this.UpdateParentName;
+              this.showUpdateParent = false;
+              this.getUser();
+            })
+            .catch((err) => {
+              this.userinfo.smailheadportrait = "";
+              this.fileList = [];
+              this.$toast.success("修改失败");
+              console.error(err);
+            });
+        });
+    },
+    updateClass() {
+      this.showUpdateClass = true;
+      this.UpdateClassName = this.userinfo.classname;
+      document
+        .getElementsByClassName("pb_left")[2]
+        .addEventListener("click", (e) => {
+          if (this.UpdateClassName === "") {
+            this.$toast.fail("班级不能修改为空！");
+            return;
+          }
+          let params = [
+            {
+              n: this.UpdateClassName,
+              uid: this.$store.state.userInfo.userid,
+            },
+          ];
+          this.ajax
+            .post(this.$store.state.api + "UpdateUserClassName", params)
+            .then((res) => {
+              this.$toast.success("修改成功");
+              this.userinfo.classname = this.UpdateClassName;
+              this.showUpdateClass = false;
+              this.getUser();
+            })
+            .catch((err) => {
+              this.userinfo.smailheadportrait = "";
+              this.fileList = [];
+              this.$toast.success("修改失败");
+              console.error(err);
+            });
+        });
+    },
+    exit() {
+      sessionStorage.clear();
+      this.$cookies.remove('login')
+      this.$cookies.remove('userInfo')
+      this.$store.commit("update", ["isLogin", false]);
+      this.$store.commit("update", ["userInfo", {}]);
+      Toast.success("退出成功");
+      this.$router.push("/login");
+    },
+    //修改地区
+    onConfirm(value) {
+      let params = [
+        {
+          d: value.join(""),
+          uid: this.$store.state.userInfo.userid,
+        },
+      ];
+      this.ajax
+        .post(this.$store.state.api + "UpdateUserDest", params)
+        .then((res) => {
+          this.$toast.success("修改成功");
+          this.userinfo.dest = value.join("");
+          this.popShow = false;
+          this.getUser();
+        })
+        .catch((err) => {
+          this.$toast.success("修改失败");
+          console.error(err);
+        });
+    },
+    //修改老师
+    onConfirmA(value) {
+      if (value.id == this.$store.state.userInfo.tid) {
+        this.$toast.fail("您已经是这个老师的学生了");
+        retrun;
+      }
+      let params = [
+        {
+          uid: this.$store.state.userInfo.userid,
+          tid: value.id,
+        },
+      ];
+      // this.$Dialog
+        // .confirm({
+        //   title: "修改老师",
+        //   message: "确认修改老师嘛，修改了就要重新选择年级了！",
+        // })
+        // .then(() => {
+          this.ajax
+            .post(this.$store.state.api + "UpdateTeacher", params)
+            .then((res) => {
+              this.$toast.success("修改成功");
+              this.popShowA = false;
+              this.getUser();
+            })
+            .catch((err) => {
+              this.$toast.success("修改失败");
+              console.error(err);
+            });
+        // })
+        // .catch(() => {
+        //   // on cancel
+        // });
+    },
+    //修改年级
+    onConfirmB(value) {
+      if (value.id == this.$store.state.userInfo.classid) {
+        this.$toast.fail("您已经是这个年级的了");
+        retrun;
+      }
+      let params = [
+        {
+          uid: this.$store.state.userInfo.userid,
+          cid: value.id,
+        },
+      ];
+
+      this.ajax
+        .post(this.$store.state.api + "UpdateSClassC", params)
+        .then((res) => {
+          this.$toast.success("提交申请成功，请等待管理员同意");
+          this.popShowB = false;
+          this.getUser();
+        })
+        .catch((err) => {
+          this.$toast.success("申请失败");
+          console.error(err);
+        });
+    },
+    //上传头像
+    afterRead(file) {
+      this.photoLoading = true;
+
+      var _file = file.file;
+      file.status = "uploading";
+      file.message = "上传中...";
+
+      var credentials = {
+        accessKeyId: "AKIATLPEDU37QV5CHLMH",
+        secretAccessKey: "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",
+      }; //秘钥形式的登录上传
+      window.AWS.config.update(credentials);
+      window.AWS.config.region = "cn-northwest-1"; //设置区域
+
+      var bucket = new window.AWS.S3({ params: { Bucket: "ccrb" } }); //选择桶
+      var _this = this;
+
+      var mediaFormatList = ["png", "jpg", "jpeg"];
+
+      if (mediaFormatList.indexOf(_file.name.split(".")[1]) == "-1") {
+        _this.$toast.fail("请上传jpg或者png的图片格式文件");
+        _this.fileList = _this.fileList.filter((fileA) => {
+          return fileA.file.lastModified != file.file.lastModified;
+        });
+
+        file.status = "failed";
+        file.message = "上传失败";
+        return;
+      }
+
+      if (_file) {
+        var params = {
+          Key: _file.name,
+          ContentType: _file.type,
+          Body: _file,
+          "Access-Control-Allow-Credentials": "*",
+          ACL: "public-read",
+        }; //key可以设置为桶的相抵路径，Body为文件， ACL最好要设置
+        var options = {
+          partSize: 2048 * 1024 * 1024,
+          queueSize: 2,
+          leavePartsOnError: true,
+        };
+        bucket
+          .upload(params, options)
+          .on("httpUploadProgress", function (evt) {
+            //这里可以写进度条
+            // console.log("Uploaded : " + parseInt((evt.loaded * 80) / evt.total) + '%');
+          })
+          .send(function (err, data) {
+            _this.photoLoading = false;
+            if (err) {
+              _this.$toast.fail("上传失败");
+              file.status = "failed";
+              file.message = "修改失败";
+              //上传错误处理
+              _this.fileList = _this.fileList.filter((fileA) => {
+                return fileA.file.lastModified != _file.lastModified;
+              });
+            } else {
+              //上传成功处理
+              file.status = "success";
+              // _this.fileList = _this.fileList.filter((fileA) => {
+              //   if (fileA.file.lastModified == _file.lastModified) {
+              //     fileA.url = data.Location;
+              //     return fileA;
+              //   } else {
+              //     return fileA;
+              //   }
+              // });
+              // UpdateUserS
+              let params = [
+                {
+                  s: data.Location,
+                  uid: _this.$store.state.userInfo.userid,
+                },
+              ];
+              _this.ajax
+                .post(_this.$store.state.api + "UpdateUserS", params)
+                .then((res) => {
+                  _this.$toast.success("修改头像成功");
+                  _this.userinfo.smailheadportrait = data.Location;
+                  _this.fileList = [];
+                  _this.getUser();
+                })
+                .catch((err) => {
+                  _this.userinfo.smailheadportrait = "";
+                  _this.fileList = [];
+                  this.$toast.success("修改头像失败");
+                  console.error(err);
+                });
+              console.log(data.Location);
+            }
+          });
+      }
+    },
+  },
+  created() {
+    console.log(!(this.$store.state.userInfo.type=="1"));
+    this.getTeacher();
+    this.getUser();
   },
 };
 </script>
 
 <style scoped>
+.van-cell {
+  width: 100%;
+  margin: 0 auto;
+}
+.myd_content {
+  height: 100%;
+}
+.li_head_portal {
+  height: 2.8rem;
+  width: 2.8rem;
+  overflow: hidden;
+  border-radius: 10rem;
+  margin: 0 0.5rem 0 0rem;
+}
+.li_head_portal >>> img {
+  height: 2.8rem;
+  width: 2.8rem;
+}
+.myd_content_body {
+  margin-top: 0.6rem;
+}
+.myd_head {
+  background: #fff;
+  width: 100%;
+  display: flex;
+  padding: 1rem 0;
+  justify-content: flex-end;
+  align-items: center;
+}
+.myd_head_title {
+  flex: 1 1 auto;
+  margin-left: 0.8rem;
+  font-size: 16px;
+}
+.arrow_right {
+  margin-right: 0.7rem;
+}
+.arrow_left {
+  margin-left: 0.7rem;
+}
+.md_upadate_bod {
+  width: 100%;
+  height: 100%;
+  background: rgba(243, 243, 243);
+  position: absolute;
+  top: 0;
+  z-index: 99999;
+}
+.exitButton {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  /* margin-top: 1rem; */
+  /* position: absolute;
+  width: 100%;
+  bottom: 1rem; */
+  margin: 1rem 0;
+}
+.exitButton button {
+  color: white;
+  background: red;
+  border: none;
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  font-size: 1rem;
+  text-align: center;
+  border-radius: 10rem;
+  cursor: pointer;
+  transition: opacity 0.2s;
+  height: 2rem;
+  width: 90%;
+  font-size: 0.8rem;
+  line-height: 1.5rem;
+}
 </style>

src/components/pages/submitWork.vue

@@ -1,37 +1,96 @@
 <template>
-  <div class="pb_content2" style="background: #fff">
-    <div class="pb_head">
-      <van-icon
-        name="arrow-left"
-        color="#fff"
-        class="pb_back"
-        size="1.2rem"
-        @click="goBack"
-      />
-      <span>提交作业</span>
-    </div>
-    <div class="pb_content_body"></div>
-  </div>
+	<div class="pb_content2" style="background: #fff">
+		<div class="pb_head">
+			<van-icon
+				name="arrow-left"
+				color="#fff"
+				class="pb_back"
+				size="1.2rem"
+				@click="goBack"
+			/>
+			<span>提交作业</span>
+		</div>
+		<div
+			class="pb_content_body"
+			style="
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				position: relative;
+				min-height: calc(100% - 3rem);
+			"
+		>
+			<div class="myp_parent_textarea">
+				<van-field
+					v-model="message"
+					rows="6"
+					autosize
+					type="textarea"
+					placeholder="输入文字描述..."
+					border
+				/>
+			</div>
+			<div class="myp_upload">
+				<van-uploader v-model="fileList" multiple />
+			</div>
+			<div class="upload_work" @click="uploadNow">立即上传</div>
+		</div>
+		<el-dialog></el-dialog>
+	</div>
 </template>
 
 <script>
-export default {
-  data() {
-    return {};
-  },
-  methods: {
-    goBack() {
-      this.$router.isBack = true;
-      if (window.history.length <= 1) {
-        this.$router.push({ path: "/" });
-        return false;
-      } else {
-        this.$router.go(-1);
-      }
-    },
-  },
-};
+	import Vue from "vue";
+	import { Uploader } from "vant";
+	import { Dialog } from "vant";
+
+	// 全局注册
+	Vue.use(Dialog);
+
+	Vue.use(Uploader);
+	export default {
+		data() {
+			return {
+				message: "",
+				fileList: [],
+			};
+		},
+		methods: {
+			goBack() {
+				this.$router.isBack = true;
+				if (window.history.length <= 1) {
+					this.$router.push({ path: "/" });
+					return false;
+				} else {
+					this.$router.go(-1);
+				}
+			},
+			uploadNow() {
+				this.$toast.success("提交成功");
+				setTimeout(() => {
+					this.goBack();
+				}, 1000);
+			},
+		},
+	};
 </script>
 
 <style scoped>
+	.myp_parent_textarea {
+		width: 100%;
+		margin: 0 auto;
+	}
+	.myp_upload {
+		margin: 0 0 6rem 1.5rem;
+	}
+	.upload_work {
+		position: absolute;
+		bottom: 0;
+		width: 100%;
+		height: 2.8rem;
+		background: #50cf72;
+		color: #fff;
+		text-align: center;
+		line-height: 2.8rem;
+	}
 </style>

src/components/pages/workDetail.vue

@@ -1,37 +1,137 @@
 <template>
-  <div class="pb_content2" style="background: #fff">
-    <div class="pb_head">
-      <van-icon
-        name="arrow-left"
-        color="#fff"
-        class="pb_back"
-        size="1.2rem"
-        @click="goBack"
-      />
-      <span>作业详情</span>
-    </div>
-    <div class="pb_content_body"></div>
-  </div>
+	<div class="pb_content2" style="background: #e8e7e7">
+		<div class="pb_head">
+			<van-icon
+				name="arrow-left"
+				color="#fff"
+				class="pb_back"
+				size="1.2rem"
+				@click="goBack"
+			/>
+			<span>作业详情</span>
+		</div>
+		<div class="pb_content_body" style="position: relative;min-height: calc(100% - 4rem);">
+			<div class="work_detail">
+				<div class="work_top">
+					<div class="lag"><img src="../../assets/icon/lag.png" alt="" /></div>
+					<div class="work_title">绿色快乐农耕园</div>
+				</div>
+				<div class="work_content">
+					开展"家务劳动小能手"让幼儿体会父母的辛苦，激发幼儿为父母分担家务劳动的激情。因此让幼儿在家里做一件力所能及的家务。
+				</div>
+				<div class="work_time">09-24 18:00 周五发布</div>
+			</div>
+			<div class="ex_date">
+				<div class="ex_left">
+					<div class="nolck">
+						<img src="../../assets/icon/nolck.png" alt="" />
+					</div>
+					<div class="ex_time">截止日期</div>
+				</div>
+				<div class="ex_right">09-26 周日 23:59</div>
+			</div>
+			<div class="upload_work" @click="goTo('/submitWork')">提交作业</div>
+		</div>
+	</div>
 </template>
 
 <script>
-export default {
-  data() {
-    return {};
-  },
-  methods: {
-    goBack() {
-      this.$router.isBack = true;
-      if (window.history.length <= 1) {
-        this.$router.push({ path: "/" });
-        return false;
-      } else {
-        this.$router.go(-1);
-      }
-    },
-  },
-};
+	export default {
+		data() {
+			return {
+      };
+		},
+		methods: {
+      goTo(path) {
+				this.$router.push(path);
+			},
+			goBack() {
+				this.$router.isBack = true;
+				if (window.history.length <= 1) {
+					this.$router.push({ path: "/" });
+					return false;
+				} else {
+					this.$router.go(-1);
+				}
+			},
+		},
+	};
 </script>
 
 <style scoped>
+	.lag > img,
+	.nolck > img {
+		width: 100%;
+		height: 100%;
+	}
+	.lag {
+		width: 1.5rem;
+		height: 1.5rem;
+	}
+	.work_detail {
+		background: #fff;
+		width: 90%;
+		margin: 1rem auto;
+	}
+	.work_top {
+		display: flex;
+		padding: 0.8rem 0.5rem 0 0.5rem;
+	}
+	.work_title {
+		font-size: 0.9rem;
+		font-weight: bold;
+		line-height: 1.4rem;
+		padding-left: 0.4rem;
+		border-radius: 0.3rem;
+	}
+	.work_content {
+		width: 90%;
+		margin: 0 auto;
+		font-size: 0.8rem;
+		color: #999;
+		line-height: 1.5rem;
+		padding: 0.3rem 0 0.8rem 0;
+	}
+	.work_time {
+		color: #999;
+		font-size: 0.4rem;
+		padding: 0.5rem 1.2rem;
+	}
+	.nolck {
+		width: 1.1rem;
+		height: 1.1rem;
+		line-height: 1.9rem;
+	}
+	.ex_date {
+		display: flex;
+		width: 90%;
+		margin: 0 auto;
+		background: #fff;
+		padding: 0.5rem 0;
+		flex-direction: row;
+		justify-content: space-around;
+		border-radius: 0.3rem;
+	}
+	.ex_left {
+		display: flex;
+	}
+	.ex_time {
+		font-size: 0.8rem;
+		line-height: 1.5rem;
+		padding-left: 0.4rem;
+	}
+	.ex_right {
+		font-size: 0.8rem;
+		line-height: 1.5rem;
+	}
+	.upload_work {
+		position: absolute;
+		bottom: 0;
+		width: 100%;
+		height: 2.8rem;
+		background: #50cf72;
+		color: #fff;
+		text-align: center;
+		line-height: 2.8rem;
+	}
 </style>