学习详情-相关页面搭建

pages/YNEduApp/index/index.vue

@@ -117,13 +117,13 @@
       }
 		},
     onShow() {
-      getNoticeAnnoByUserId({
+      /* getNoticeAnnoByUserId({
         status: 0
       }).then(res => {
         console.log(res)
       }).catch(err => {
         console.log(err)
-      })
+      }) */
       /*uni.showModal({
         title: '人脸识别',
         content: '开启人脸识别？',

pages/YNEduApp/learnProj/learnProj.vue

@@ -47,6 +47,7 @@
           v-for="(item, index) in projList"
           :key="item.id"
           class="single-proj"
+          @click="toggleDetail(item.id)"
       >
         <h4 class="img">
           <image :src="item.img"></image>
@@ -201,6 +202,11 @@
       },
       statusChange(item) {
         console.log(this.totalStatus)
+      },
+      toggleDetail(id) {
+        uni.navigateTo({
+          url: `/pages/YNEduApp/learnProj/learnProjDetail?id=${id}`
+        })
       }
 		}
 	}

pages/YNEduApp/learnProj/learnProjDetail.vue

@@ -0,0 +1,374 @@
+<template>
+	<view class="page">
+    <view class="proj-cont">
+      <h2 style="margin-bottom: 15rpx">这是标题</h2>
+      <span style="font-size: 12px; color: #B0B0B0">合格标准：学习进度完成100%，考试及格一场，练习通过一场</span>
+      <view class="user-info">
+        <view class="info-lef">
+          <view class="avatar">
+            <image src="/static/eduImg/avatar.jpg"></image>
+            <span style="font-size: 18px">马晓峰</span>
+          </view>
+          <view style="display: flex; align-items: center">
+            <l-starRate v-model="starRate" :disabled="true" style="margin-right: 1vw"></l-starRate>
+            <span style="color: #ffca3e">{{ starRate }}.0</span>
+          </view>
+        </view>
+        <view class="info-rig">
+          <view class="rig-up">
+            <view>
+              培训内容
+              <span>6</span>
+            </view>
+            <view style="margin-left: 2vw">
+              观看记录
+              <span>28</span>
+              <uni-icons style="color: #b0b0b0" type="right" size="12"></uni-icons>
+            </view>
+          </view>
+          <view class="rig-dn">
+            去评分
+            <uni-icons style="color: #b0b0b0" type="right" size="12"></uni-icons>
+          </view>
+        </view>
+      </view>
+      <view class="tip">
+        已开启进度同步，其他途径的学习进度已自动同步
+      </view>
+      <uni-collapse>
+        <uni-collapse-item title="理论学习">
+          <uni-list>
+            <uni-list-item
+                v-for="(item, index) in theoryLearnList"
+                :key="item.id"
+                title="练习"
+                :note="item.title"
+                showArrow
+                clickable
+                @click="toggleTheoryLearn(item.id)"
+            ></uni-list-item>
+          </uni-list>
+        </uni-collapse-item>
+        <uni-collapse-item title="理论练习">
+          <uni-list>
+            <uni-list-item title="练习" note="高压电取证理论学习"
+                           showArrow></uni-list-item>
+          </uni-list>
+        </uni-collapse-item>
+        <uni-collapse-item title="理论模拟考试">
+          <uni-list>
+            <uni-list-item title="练习" note="高压电取证理论学习"
+                           showArrow></uni-list-item>
+          </uni-list>
+        </uni-collapse-item>
+        <uni-collapse-item title="实操题目练习">
+          <uni-list>
+            <uni-list-item title="练习" note="高压电取证理论学习"
+                           showArrow></uni-list-item>
+          </uni-list>
+        </uni-collapse-item>
+      </uni-collapse>
+    </view>
+    <view class="comment-area">
+      <h2 style="margin-bottom: 15rpx">最新评论</h2>
+      <view class="write-cmt">
+        <uni-icons style="color: #9B9B9B; margin-right: 1vw" type="compose" size="12"></uni-icons>
+        写评论
+      </view>
+      <view
+          class="cmts"
+          v-for="(item, index) in commentList"
+          :key="index"
+      >
+        <view class="cmt-up">
+          <image :src="item.avatar"></image>
+          <span>{{ item.username }}</span>
+        </view>
+        <view class="cmt-dn">
+          {{ item.cont }}
+        </view>
+      </view>
+    </view>
+    <view class="btm-sticky">
+      <view class="icons">
+        <view>
+          <uni-icons style="color: #1989FA; margin-right: 1vw" type="chat-filled" size="24"></uni-icons>
+          <span>23</span>
+        </view>
+        <view>
+          <uni-icons style="color: #1989FA; margin-right: 1vw" type="hand-up-filled" size="24"></uni-icons>
+          <span>12</span>
+        </view>
+      </view>
+      <view class="learn-btn">继续学习</view>
+    </view>
+	</view>
+</template>
+
+<script>
+	import bindIngXMixins from "../../../uni_modules/uni-swipe-action/components/uni-swipe-action-item/bindingx";
+
+  export default {
+    computed: {
+      bindIngXMixins() {
+        return bindIngXMixins
+      }
+    },
+		data() {
+			return {
+        projId: '',
+        starRate: 5,
+        theoryLearnList: [
+          { title: '母猪的产后护理', id: 141 },
+          { title: '公猪的情绪安抚', id: 142 },
+          { title: '母狗的二三情事', id: 143 },
+          { title: '公狗的大顶绿帽', id: 144 },
+        ],
+        commentList: [
+          { username: '王二', avatar: '/static/eduImg/avatar.jpg', cont: '写的什么东西' },
+          { username: '张三', avatar: '/static/eduImg/avatar.jpg', cont: '我感觉写得挺好' },
+          { username: '李四', avatar: '/static/eduImg/avatar.jpg', cont: '+3' },
+        ]
+			}
+		},
+		methods: {
+      toggleTheoryLearn(id) {
+        console.log(id)
+      }
+		},
+    onLoad(params) {
+      this.projId = params.id
+      console.log(this.projId)
+    },
+	}
+</script>
+
+<style lang="scss">
+
+  .page{
+
+    width: 100vw;
+    background-color: #f8f8f8;
+    box-sizing: border-box;
+    padding: 5vw;
+    position: relative;
+
+    .proj-cont{
+
+      width: 100%;
+      box-sizing: border-box;
+      padding: 30rpx 15rpx;
+      background-color: #fff;
+      border-radius: 20rpx;
+      display: flex;
+      flex-direction: column;
+      box-shadow: #F4F4F4 2px 2px;
+
+      .user-info{
+
+        width: 100%;
+        height: 8vh;
+        display: flex;
+        margin-top: 2vh;
+
+        .info-lef{
+
+          width: 35%;
+          height: 100%;
+          display: flex;
+          flex-direction: column;
+          justify-content: space-around;
+
+          .avatar{
+
+            width: 100%;
+            display: flex;
+            align-items: center;
+
+            image{
+
+              width: 60rpx;
+              height: 60rpx;
+              border-radius: 50%;
+              margin-right: 1.5vw;
+
+            }
+
+          }
+
+        }
+
+        .info-rig{
+
+          flex: 1;
+          display: flex;
+          flex-direction: column;
+          justify-content: space-around;
+          box-sizing: border-box;
+          color: #b0b0b0;
+
+          .rig-up{
+
+            display: flex;
+            align-items: center;
+
+            view{
+
+              span{
+
+                padding: 0 1vw;
+
+              }
+
+            }
+
+          }
+
+          .rig-dn{
+
+            display: flex;
+            align-items: center;
+            box-sizing: border-box;
+            padding-left: 1vw;
+
+          }
+
+        }
+
+      }
+
+      .tip{
+
+        width: 100%;
+        margin: 2vh auto;
+        background-color: #F7F7F7;
+        font-size: 12px;
+        color: #9B9B9B;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        box-sizing: border-box;
+        padding: 25rpx 15rpx;
+
+      }
+
+    }
+
+    .comment-area{
+
+      width: 100%;
+      box-sizing: border-box;
+      margin: 1vh auto;
+      padding: 30rpx 15rpx 5vh 15rpx;
+      background-color: #fff;
+      border-radius: 20rpx;
+      display: flex;
+      flex-direction: column;
+      box-shadow: #F4F4F4 2px 2px;
+
+      .write-cmt{
+
+        width: 100%;
+        margin: 2vh auto;
+        background-color: #F7F7F7;
+        font-size: 12px;
+        color: #9B9B9B;
+        display: flex;
+        align-items: center;
+        box-sizing: border-box;
+        padding: 15rpx;
+
+      }
+
+      .cmts{
+
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+        margin-bottom: 2vh;
+
+        .cmt-up{
+
+          display: flex;
+          align-items: center;
+          font-weight: bold;
+
+          image{
+
+            width: 60rpx;
+            height: 60rpx;
+            border-radius: 50%;
+            margin-right: 2vw;
+
+          }
+
+        }
+
+        .cmt-dn{
+
+          box-sizing: border-box;
+          padding-left: calc(60rpx + 2vw);
+
+        }
+
+      }
+
+    }
+
+    .btm-sticky{
+
+      position: fixed;
+      left: 0;
+      bottom: 0;
+      width: 100%;
+      height: 8vh;
+      background-color: #fff;
+      border-top: 1px solid #D8D8D8;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      box-sizing: border-box;
+      padding: 0 5vw;
+
+      .icons{
+
+        width: 40%;
+        display: flex;
+        justify-content: space-between;
+
+        view{
+
+          display: flex;
+          align-items: center;
+
+          span{
+
+            font-size: 16px;
+            color: #1A89FA;
+            font-weight: bold;
+
+          }
+
+        }
+
+      }
+
+      .learn-btn{
+
+        width: 30%;
+        height: 60%;
+        background-color: #1A89FA;
+        color: #fff;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        font-size: 14px;
+        border-radius: 50rpx;
+
+      }
+
+    }
+
+  }
+
+</style>

pages/login.vue

@@ -330,7 +330,6 @@
 					return
 				}
 				this.$refs.uForm.validate().then(res => {
-					// uni.$u.toast('校验通过')
 					this.$store.dispatch('Login', this.loginForm).then((res) => {
 						console.log(res)
 						if (res.code == 200) {

unpackage/dist/dev/app-plus/app-config-service.js

@@ -1,8 +1,8 @@
 
 var isReady=false;var onReadyCallbacks=[];
 var isServiceReady=false;var onServiceReadyCallbacks=[];
-var __uniConfig = {"pages":["pages/login","pages/webview","pages/message/index","pages/message/detail","pages/gzt/index","pages/txl/index","pages/mine/index","pages/YNEduApp/index/index","pages/YNEduApp/user/user","pages/YNEduApp/user/settings","pages/YNEduApp/learnProj/learnProj"],"window":{"fontFamily":"Helvetica, Arial, sans-serif","pageOrientation":"portrait","navigationBarTitleText":"作业管控智慧平台","navigationBarTextStyle":"black","navigationBarBackgroundColor":"#ffffff","backgroundColor":"#F8F8F8","backgroundColorTop":"#F4F5F6","backgroundColorBottom":"#F4F5F6"},"darkmode":false,"nvueCompiler":"uni-app","nvueStyleCompiler":"uni-app","renderer":"auto","splashscreen":{"alwaysShowBeforeRender":true,"autoclose":false},"appname":"作业管控智慧平台","compilerVersion":"4.23","entryPagePath":"pages/login","networkTimeout":{"request":60000,"connectSocket":60000,"uploadFile":60000,"downloadFile":60000}};
-var __uniRoutes = [{"path":"/pages/login","meta":{"isQuit":true},"window":{"navigationBarTitleText":"登录","navigationStyle":"custom"}},{"path":"/pages/webview","meta":{},"window":{"navigationBarTitleText":"作业管控智慧平台","navigationStyle":"custom"}},{"path":"/pages/message/index","meta":{},"window":{"navigationBarTitleText":"消息"}},{"path":"/pages/message/detail","meta":{},"window":{"navigationBarTitleText":"消息"}},{"path":"/pages/gzt/index","meta":{},"window":{"navigationBarTitleText":"作业管控智慧平台","navigationStyle":"custom"}},{"path":"/pages/txl/index","meta":{},"window":{"navigationBarTitleText":"通讯录"}},{"path":"/pages/mine/index","meta":{},"window":{"navigationBarTitleText":"我的","navigationStyle":"custom"}},{"path":"/pages/YNEduApp/index/index","meta":{},"window":{"navigationBarTitleText":"首页"}},{"path":"/pages/YNEduApp/user/user","meta":{},"window":{"navigationStyle":"custom"}},{"path":"/pages/YNEduApp/user/settings","meta":{},"window":{"navigationBarTitleText":"设置"}},{"path":"/pages/YNEduApp/learnProj/learnProj","meta":{},"window":{"navigationBarTitleText":"学习项目"}}];
+var __uniConfig = {"pages":["pages/YNEduApp/index/index","pages/login","pages/webview","pages/message/index","pages/message/detail","pages/gzt/index","pages/txl/index","pages/mine/index","pages/YNEduApp/user/user","pages/YNEduApp/user/settings","pages/YNEduApp/learnProj/learnProj","pages/YNEduApp/learnProj/learnProjDetail"],"window":{"fontFamily":"Helvetica, Arial, sans-serif","pageOrientation":"portrait","navigationBarTitleText":"作业管控智慧平台","navigationBarTextStyle":"black","navigationBarBackgroundColor":"#ffffff","backgroundColor":"#F8F8F8","backgroundColorTop":"#F4F5F6","backgroundColorBottom":"#F4F5F6"},"darkmode":false,"nvueCompiler":"uni-app","nvueStyleCompiler":"uni-app","renderer":"auto","splashscreen":{"alwaysShowBeforeRender":true,"autoclose":false},"appname":"作业管控智慧平台","compilerVersion":"4.23","entryPagePath":"pages/YNEduApp/index/index","networkTimeout":{"request":60000,"connectSocket":60000,"uploadFile":60000,"downloadFile":60000}};
+var __uniRoutes = [{"path":"/pages/YNEduApp/index/index","meta":{"isQuit":true},"window":{"navigationBarTitleText":"首页"}},{"path":"/pages/login","meta":{},"window":{"navigationBarTitleText":"登录","navigationStyle":"custom"}},{"path":"/pages/webview","meta":{},"window":{"navigationBarTitleText":"作业管控智慧平台","navigationStyle":"custom"}},{"path":"/pages/message/index","meta":{},"window":{"navigationBarTitleText":"消息"}},{"path":"/pages/message/detail","meta":{},"window":{"navigationBarTitleText":"消息"}},{"path":"/pages/gzt/index","meta":{},"window":{"navigationBarTitleText":"作业管控智慧平台","navigationStyle":"custom"}},{"path":"/pages/txl/index","meta":{},"window":{"navigationBarTitleText":"通讯录"}},{"path":"/pages/mine/index","meta":{},"window":{"navigationBarTitleText":"我的","navigationStyle":"custom"}},{"path":"/pages/YNEduApp/user/user","meta":{},"window":{"navigationStyle":"custom"}},{"path":"/pages/YNEduApp/user/settings","meta":{},"window":{"navigationBarTitleText":"设置"}},{"path":"/pages/YNEduApp/learnProj/learnProj","meta":{},"window":{"navigationBarTitleText":"学习项目"}},{"path":"/pages/YNEduApp/learnProj/learnProjDetail","meta":{},"window":{"navigationBarTitleText":"学习项目"}}];
 __uniConfig.onReady=function(callback){if(__uniConfig.ready){callback()}else{onReadyCallbacks.push(callback)}};Object.defineProperty(__uniConfig,"ready",{get:function(){return isReady},set:function(val){isReady=val;if(!isReady){return}const callbacks=onReadyCallbacks.slice(0);onReadyCallbacks.length=0;callbacks.forEach(function(callback){callback()})}});
 __uniConfig.onServiceReady=function(callback){if(__uniConfig.serviceReady){callback()}else{onServiceReadyCallbacks.push(callback)}};Object.defineProperty(__uniConfig,"serviceReady",{get:function(){return isServiceReady},set:function(val){isServiceReady=val;if(!isServiceReady){return}const callbacks=onServiceReadyCallbacks.slice(0);onServiceReadyCallbacks.length=0;callbacks.forEach(function(callback){callback()})}});
 service.register("uni-app-config",{create(a,b,c){if(!__uniConfig.viewport){var d=b.weex.config.env.scale,e=b.weex.config.env.deviceWidth,f=Math.ceil(e/d);Object.assign(__uniConfig,{viewport:f,defaultFontSize:Math.round(f/20)})}return{instance:{__uniConfig:__uniConfig,__uniRoutes:__uniRoutes,global:void 0,window:void 0,document:void 0,frames:void 0,self:void 0,location:void 0,navigator:void 0,localStorage:void 0,history:void 0,Caches:void 0,screen:void 0,alert:void 0,confirm:void 0,prompt:void 0,fetch:void 0,XMLHttpRequest:void 0,WebSocket:void 0,webkit:void 0,print:void 0}}}});