禅意课堂3

app.json

@@ -1,18 +1,21 @@
 {
-  "pages":[
+    "pages": [
+        "pages/courseReservation/index",
+        "pages/companyPage/index", 
+        "pages/courseDetail/index",
+        "pages/goodsDetail/index",
         "pages/goodsList/index",
         "pages/home/index",
-    
         "pages/login/index",
-    "pages/goodsDetail/index",
         "pages/companyInfo/index",
         "pages/index/index"
+        
     ],
-  "window":{
-    "backgroundTextStyle":"light",
+    "window": {
+        "backgroundTextStyle": "light",
         "navigationBarBackgroundColor": "#fff",
         "navigationBarTitleText": "Weixin",
-    "navigationBarTextStyle":"black"
+        "navigationBarTextStyle": "black"
     },
     "style": "v2",
     "sitemapLocation": "sitemap.json"

pages/companyPage/index.js

@@ -0,0 +1,66 @@
+// pages/companyPage/index.js
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    }
+})

pages/companyPage/index.json

@@ -0,0 +1,7 @@
+{
+  "usingComponents": {},
+  "navigationBarBackgroundColor": "#343434",
+  "navigationBarTitleText": "公司介绍",
+  "navigationBarTextStyle": "white"
+
+}

pages/companyPage/index.wxml

@@ -0,0 +1,10 @@
+<!--pages/companyPage/index.wxml-->
+<view class="detail-page ">
+    <view class="cy1 cy"><image src="../../images/cy1.png" mode="aspectFill"></image></view>
+    <view class="cy2 cy"><image src="../../images/cy2.png" mode="aspectFill"></image></view>
+    <view class="cy3 cy"><image src="../../images/cy3.png" mode="aspectFill"></image></view>
+    <view class="footer ">
+        <view class="acea-row row-center-wrapper">全国咨询热线</view>
+        <view class="acea-row row-center-wrapper">400-631-8531</view>
+    </view>
+</view>

pages/companyPage/index.wxss

@@ -0,0 +1,26 @@
+/* pages/companyPage/index.wxss */
+.detail-page{
+    min-height: 100vh; 
+    background: linear-gradient(180deg, #343434 0%, #777777 100%);
+    font-size: 24rpx;
+
+}
+.cy image{
+    width: 100%;
+    
+}
+.cy1 image{
+    height: 1354rpx;
+}
+.cy2 image{
+    height: 1434rpx;
+}
+.cy3 image{
+    height: 1531rpx;
+
+}
+.footer{
+    height: 214rpx;
+    font-size: 32rpx;
+    color: #fff;
+}

pages/courseDetail/index.js

@@ -0,0 +1,66 @@
+// pages/courseDetail/index.js
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    }
+})

pages/courseDetail/index.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {},
+  "navigationBarTitleText": "课程详情"
+}

pages/courseDetail/index.wxml

@@ -0,0 +1,62 @@
+<!--pages/courseDetail/index.wxml-->
+<view class="detail-page">
+    <view class="subscribe">
+        <image src="../../images/coursepage.png" alt=""></image>
+        <view class="title acea-row row-center-wrapper">弘扬传统国学</view>
+        <view class="subscribe-con">
+            <view class="headline">国学智慧-怎样学好国学</view>    
+            <view class="subtitle">国学智慧-怎样学好国学</view>
+            <view class="placeicon acea-row row-middle">
+                <image src="../../images/placeicon.png" ></image>
+                <text>武汉</text>
+            </view>
+            <view class="timeicon acea-row row-middle">
+                <image src="../../images/time.png" ></image>
+                <text>2021.11.13-11.15</text>
+            </view>
+            <view class="num">22人已预约</view>
+            <view class="order-btn acea-row row-center-wrapper">去预约</view>
+        </view>          
+    </view>
+    <view class="introduse-box">
+        <view class="teach acea-row row-middle">
+            <image src="../../images/lh-ico.png" alt=""></image>
+            <text>授课老师</text>
+        </view>
+        <view class="introduce-name acea-row row-left">
+            <image src="../../images/head.png" class=""></image>
+            <view>
+                <view class="name">李大辉</view>
+                <view>中国资深国学大师</view>
+            </view>
+            
+        </view>
+        <view class="desc">中国杰出道家文化特邀嘉宾，互联网占扑界大师，资深命理大师家文化特邀嘉宾，互联网占扑界大师，资家文化特邀嘉宾，互联网占扑界大师，资家文化特邀嘉宾，互联网占扑界大师，资</view>
+    </view>
+    <view class="course-box">
+        <view class="teach acea-row row-middle">
+            <image src="../../images/lh-ico.png" alt=""></image>
+            <text>授课老师</text>
+        </view>
+        <view class="course-con">
+            <image src="../../images/lh-top.png"></image>
+            <view>中国杰出道家文化特邀嘉宾，互联网占扑界大师，资深命理大师家文化特邀嘉宾，互联网占扑界大师，资家文化特邀嘉宾，互联网占扑界大师，资家文化特邀嘉宾，互联网占扑界大师，资中国杰出道家文化特邀嘉宾，互联网占扑界大师，资深命理大师家文化特邀嘉宾，互联网占扑界大师，资家文化特邀嘉宾，互联网占扑界大师，资家文化特邀嘉宾，互联网占扑界大师，资.</view>
+            <view>中国杰出道家文化特邀嘉宾，互联网占扑界大师，资深命理大师家文化特邀嘉宾，互联网占扑界大师，资家文化特邀嘉宾，互联网占扑界大师，资家文化特邀嘉宾，互联网占扑界大师，资中国杰出道家文化特邀嘉宾，互联网占扑界大师，资深命理大师家文化特邀嘉宾，互联网占扑界大师，资家文化特邀嘉宾，互联网占扑界大师，资家文化特邀嘉宾，互联网占扑界大师，资.</view>
+            <image src="../../images/lh-bottom.png"></image>
+        </view>
+    </view>
+    <view class="list-box acea-row row-between">
+        <view class="acea-row row-center-wrapper  row-column">
+            <image src="../../images/lh.png"></image>
+             <text>首页</text>
+            </view>
+        <view class="acea-row row-center-wrapper  row-column">
+            <image src="../../images/book-icon.png"></image>
+            <text>课程</text>
+        </view>
+        <view class="acea-row row-center-wrapper  row-column">  
+            <image src="../../images/user-icon.png"></image>
+            <text>我的</text>
+        </view>
+    </view>
+</view>

pages/courseDetail/index.wxss

@@ -0,0 +1,158 @@
+/* pages/courseDetail/index.wxss */
+.detail-page{
+    min-height: 100vh; 
+    background-color: #F5F5F5;   
+    font-size: 24rpx;
+}
+.subscribe{
+    width: 100%;
+    height: 688rpx; 
+}
+.subscribe,.introduse-box,.course-box{
+    background-color: #fff;
+}
+.subscribe image{
+    width: 100%;
+    height: 432rpx;
+    position: relative;
+    display: block;
+    
+}
+.title{
+    width: 100%;
+    font-size: 96rpx;
+    position: absolute;
+    top: 76px;
+    color: #fff;
+    
+}
+.subscribe-con{
+    width: 100%;
+    height: 256rpx;
+    position: relative;
+    right: 40rpx;
+    padding-left: 80rpx;
+}
+
+.headline{
+    font-size: 36rpx;
+    font-weight: 600;
+    color: #4A4A4A;
+    padding-top: 30rpx;
+}
+
+.subtitle{
+    font-weight: 400;
+    color: #A5A5A5;
+    padding-top: 8rpx;
+}
+.placeicon{
+    float: left;
+    margin-top: 24rpx;
+}
+.placeicon image{
+    width: 21rpx;
+    height: 25rpx;
+} 
+.timeicon image{
+    width: 26rpx;
+    height: 26rpx;
+    margin-left: 30rpx;
+}
+.timeicon text,.placeicon text{
+    padding-left: 8rpx;
+    color: #A5A5A5;
+    font-weight: 400;
+}
+.timeicon{
+    margin-top: 24rpx;
+}
+.num{
+    color: #E19C01;
+    margin-top: 16rpx;
+}
+.order-btn{
+    position: absolute;
+    width: 216rpx;
+    height: 64rpx;
+    font-size: 36rpx;
+    color: #FFFFFF;
+    right: 0;
+    bottom: 32rpx;
+    background: linear-gradient(225deg, #FFD87D 0%, #E19C00 100%);
+    border-radius: 40px;
+}
+
+.introduse-box{
+    width: 100%;
+    height: 416rpx;
+    margin-top: 20rpx;
+    padding-left: 40rpx;
+}
+.teach{
+    padding-top: 28rpx;
+}
+.teach image{
+    width: 44rpx;
+    height: 28rpx;
+}
+.teach text{
+    font-size: 28rpx;
+    margin-left: 16rpx;
+   
+}
+.introduce-name{
+    margin-top: 32rpx;
+}
+.introduce-name image{
+    width: 76rpx;
+    height: 76rpx;
+    margin-right: 18rpx;
+}
+.introduce-name view{
+    margin-bottom: 4rpx;
+    font-size: 28rpx;
+    color: #4A4A4A;
+}
+.name{
+    font-weight: 600;
+}
+.desc{
+    width: 672rpx;
+    height: 102rpx;
+    color: #989898;
+    margin-top: 16rpx;
+}
+.course-box{
+    width: 100%;
+    height: 976rpx;
+    margin-top: 44rpx;
+    padding: 0 40rpx;
+}
+.course-con{
+    background-color: #E7DBBD;
+    margin: 12rpx 0 48rpx 0;
+}
+.course-con image{
+    width: 100%;
+    height: 178rpx;
+}
+.course-con view{
+    color: #343434;
+    padding: 8rpx 22rpx 18rpx 24rpx;
+}
+.list-box{
+    width: 100%;
+    height: 162rpx;
+    padding: 0 62rpx 0 64rpx;
+    box-shadow:  6rpx 0rpx 24rpx  rgba(0, 0, 0, 0.16);
+}
+.list-box image{
+    width: 96rpx;
+    height: 96rpx;
+}
+.list-box text{
+    font-size: 32rpx;
+    font-weight: 500;
+    color: #4A4A4A;
+}

pages/courseReservation/index.js

@@ -0,0 +1,66 @@
+// pages/courseReservation/index.js
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    }
+})

pages/courseReservation/index.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {},
+  "navigationBarTitleText": "课程预约"
+}

pages/courseReservation/index.wxml

@@ -0,0 +1,13 @@
+<!--pages/courseReservation/index.wxml-->
+<view class="detail-page">
+    <view class="top-bg"><image src="../../images/lh-top.png"></image></view>
+    <view class="title acea-row row-center-wrapper"><image src="../../images/yykc.png"></image></view>
+    <view class="input-box">
+        <view class="name"><image src="../../images/namebg.png"></image></view>
+        <input type="text" class="input" placeholder="刘天城" placeholder-style="color:#fff"/>
+        <view class="tel"><image src="../../images/telbg.png" ></image></view>
+        <input type="text" class="input" placeholder="17671086998" placeholder-style="color:#fff"/>
+    </view>
+    <button class="submit">提交</button>
+    <view class="bottom-bg"><image src="../../images/lh-bottom.png"></image></view>
+</view>

pages/courseReservation/index.wxss

@@ -0,0 +1,56 @@
+/* pages/courseReservation/index.wxss */
+.detail-page{
+    min-height: 100vh; 
+    background-color: #FDF1D3;
+    position: relative;
+}
+.top-bg image{
+    width: 100%;
+    height: 200rpx;
+    position: absolute;
+    top: 0;
+}
+.title image{
+    width: 408rpx;
+    height: 122rpx;
+    margin-top: 304rpx;
+
+}
+.input-box{
+    width: 100%;
+    padding: 44rpx 126rpx 100rpx 128rpx;
+}
+.name image{
+    width: 104rpx;
+    height: 48rpx;
+}
+.input{
+    width: 496rpx;
+    height: 80rpx;
+    background: #298C93;
+    border: 2px solid #CFBFA3;
+    border-radius: 56rpx;
+    margin-top: 16rpx;
+    padding-left: 32rpx;
+    font-size: 32rpx;
+    color: #FFFFFF;
+}
+.tel image{
+    width: 184rpx;
+    height: 48rpx;
+    margin-top: 64rpx;
+}
+.submit{
+    height: 80rpx;
+    background: linear-gradient(49deg, #E6A717 0%, #FFD471 100%);
+    border-radius: 16rpx;
+    font-size: 36rpx;
+    color: #fff;
+    margin-bottom: 224rpx;
+}
+.bottom-bg image{
+    width: 100%;
+    height: 200rpx;
+    position: absolute;
+    bottom: 0;
+}