调整图片像素大小 调整底部导航栏图片获取方式

对接腾讯位置

common/styles/common.scss

@@ -15,6 +15,9 @@ ol, ul {
 .mb5 {
   margin-bottom: 10rpx;
 }
+.mb5r {
+	margin-bottom: 5rpx;
+}
 .mbr11{
 	margin-bottom: 11rpx;
 }
@@ -182,6 +185,9 @@ ol, ul {
 .fs10 {
 	font-size: 20rpx;
 }
+.fs11 {
+	font-size: 22rpx;
+}
 .fs12 {
 	font-size: 24rpx;
 }
@@ -210,21 +216,24 @@ ol, ul {
 	font-size: 60rpx;
 }
 .fw700 {
-	font-weight: 700;
+	font-weight: 700 !important;
 }
 .fw600 {
-	font-weight: 600;
+	font-weight: 600!important;
 }
 .fw500 {
-	font-weight: 500;
+	font-weight: 500!important;
 }
 .fw400 {
-	font-weight: 400;
+	font-weight: 400!important;
 }
 .fw300 {
-	font-weight: 300;
+	font-weight: 300!important;
 }
 
+.lh18{
+	line-height: 36rpx;
+}
 .color-black {
 	color: #000;
 }

components/tabbar/tabbar.vue

@@ -63,21 +63,23 @@ export default {
   },
   mounted() {
 
-    // const configs = uni.getStorageSync("configs");
-    // console.log("getConfigzj=>", configs);
-    // if (configs) {
-    //   this.list[0].selectedIconPath = configs.menu1_on
-    //   this.list[0].iconPath = configs.menu1_off
-    //
-    //   this.list[1].selectedIconPath = configs.menu2_on
-    //   this.list[1].iconPath = configs.menu2_off
-    //
-    //   this.list[2].selectedIconPath = configs.menu3_on
-    //   this.list[2].iconPath = configs.menu3_off
-    //
-    //   this.list[3].selectedIconPath = configs.menu4_on
-    //   this.list[3].iconPath = configs.menu4_off
-    // }
+    const configs = uni.getStorageSync("configs");
+    console.log("getConfigzj=>", configs);
+    if (configs) {
+      this.list[0].selectedIconPath = configs.menu1_on
+      this.list[0].iconPath = configs.menu1_off
+
+      this.list[1].selectedIconPath = configs.menu2_on
+      this.list[1].iconPath = configs.menu2_off
+
+      this.list[2].selectedIconPath = configs.menu3_on
+      this.list[2].iconPath = configs.menu3_off
+
+      this.list[3].selectedIconPath = configs.menu4_on
+      this.list[3].iconPath = configs.menu4_off
+      this.list[4].selectedIconPath = configs.menu5_on
+      this.list[4].iconPath = configs.menu5_off
+    }
   },
   methods: {
     changeTab(e) {
@@ -94,12 +96,12 @@ export default {
 
 <style scoped>
 .u-page__item__slot-icon {
-  width: 60rpx !important;
-  height: 60rpx !important;
+  width: 58rpx !important;
+  height: 58rpx !important;
 }
 
 .u-page__item__slot-icon-index {
-  width: 60rpx !important;
-  height: 60rpx !important;
+  width: 58rpx !important;
+  height: 58rpx !important;
 }
 </style>

components/uview-ui/components/u-tabbar-item/u-tabbar-item.vue

@@ -106,7 +106,7 @@
 
     &__text {
       margin-top: 2px;
-      font-size: 26rpx;
+      font-size: 23rpx;
 			color: $u-content-color;
 		}
 	}

pages.json

@@ -268,7 +268,6 @@
 					}
 				}
 			},
-
 			{
 				"path": "accompanyingCamp/accompanyingCampDetail",
 				"style": {
@@ -280,6 +279,28 @@
 					}
 				}
 			},
+			{
+				"path": "service/service",
+				"style": {
+					"navigationBarTitleText": "服务预约",
+					"enablePullDownRefresh": false,
+					"app-plus": {
+						// 将回弹属性关掉
+						"bounce": "none"
+					}
+				}
+			},
+			{
+				"path": "service/serviceDetail",
+				"style": {
+					"navigationBarTitleText": "服务详情",
+					"enablePullDownRefresh": false,
+					"app-plus": {
+						// 将回弹属性关掉
+						"bounce": "none"
+					}
+				}
+			},
 			{
 				"path": "fragrantLife/fragrantLife",
 				"style": {

pages/home/index.vue

@@ -34,6 +34,13 @@
             </view>
           </view>
         </view>
+        <view style="background-color: #FFFFFF;margin-top: 16rpx;">
+          <view >
+            <u-notice-bar @click="handleAdv"  :text="advList.map((a) => a.remark)"></u-notice-bar>
+          </view>
+        </view>
+
+
         <!-- 商品分类 -->
         <view class="goods-list">
           <view class="goods-list-item" @click="jumpPage('haowu')">
@@ -520,7 +527,7 @@ export default {
       getNewsList({
         cid: 1,
         page: 1,
-        pageSize: 100,
+        pageSize: 1,
       }).then(({
                  data = {}
                }) => {
@@ -617,10 +624,12 @@ export default {
         url: `/pages/productCenter/productCenter?cateid=${item.id}`,
       });
     },
-    handleAdv(index) {
+    handleAdv(index=0) {
       const activeAdv = this.advList[index];
+      console.log("index==>", index)
+      console.log("advList==>", this.advList)
       uni.navigateTo({
-        url: `/pages/article/article?id=${activeAdv.id}`,
+        url: "/subPages/accompanyingCamp/accompanyingCampDetail?id=" + activeAdv.id,
       });
     },
   },
@@ -630,8 +639,6 @@ export default {
 <style lang="scss" scoped>
 .ps-wrapper {
   background-color: $primary-bg-color;
-  padding-top: 60rpx;
-
   .adv-box {
     position: relative;
     // padding: 0 33rpx 20rpx;
@@ -729,9 +736,9 @@ export default {
 
       .logo-search-container {
         position: absolute;
-        top: 8%;
+        top: 100rpx;
         left: 0;
-        width: 100%;
+        width: 77%;
         display: flex;
         justify-content: space-between;
         align-items: center;
@@ -739,7 +746,7 @@ export default {
         box-sizing: border-box;
 
         .search-box {
-          margin: 0 auto 0rpx;
+          margin: 0rpx 20rpx 0rpx 20rpx;
           height: 61rpx;
           background: rgba(255, 255, 255, 0.3);
           border-radius: 30rpx;

pages/mine/index.vue

@@ -284,7 +284,7 @@ export default {
         {
           name: "服务预约",
           url: require("@/static/ic-other-g.png"),
-          path: "/subPages/myOrder/myOrder",
+          path: "/subPages/service/service",
           isVip: true
         },
 

subPages/accompanyingCamp/accompanyingCampDetail.vue

@@ -7,7 +7,7 @@
         </view>
         <view class="list-item-read mt10 display-flex-between">
           <view class="display-flex">
-            <image :src="shop_logo" class="list-item-read-img mr8" mode="aspectFit"></image>
+            <image :src="shop_logo" class="list-item-read-img mr8" ></image>
             <view class="list-item-read-text">
               {{shopName}}
             </view>
@@ -115,7 +115,6 @@ export default {
   width: calc(100% - 40rpx);
   margin: 20rpx auto 0rpx;
   padding: 0rpx 20rpx 60rpx;
-
   .list-item {
     background: #FFFFFF;
     border-radius: 16rpx 16rpx 16rpx 16rpx;
@@ -170,6 +169,5 @@ export default {
   .list-item-content{
     background-color: #FFFFFF;
   }
-
 }
 </style>

subPages/fragrantLife/fragrantLifeDetail.vue

@@ -69,11 +69,9 @@ export default {
     const configs = uni.getStorageSync("configs");
     if (configs) {
       console.log(configs)
-
       this.shopName = configs.shop_name
       this.shop_logo = configs.shop_logo
     }
-
   },
   onLoad(options) {
     console.log(options)

subPages/service/service.vue

@@ -0,0 +1,116 @@
+<template>
+  <view>
+    <view class="shopping-wrapper">
+      <view class="list-item" v-for="(item, index) in data" :key="index" @click="toDetail(item)">
+        <image  :src="item.cover"  style="width: 100%;height: 264rpx">
+        </image>
+        <view class="list-item-title mt10 ml5">
+          <tetx class="list-item-title">{{item.goods_name}}</tetx>
+        </view>
+        <view class="display-flex-between ml5 mr5">
+          <view  class="display-flex">
+            <view class="fs11 fw600 lh18 color-333 " >
+              ￥
+              <text class="fs16 lh18">{{ item.price_selling }}</text>
+
+            </view>
+            <view class="ml15  fs13 fw400 lh18 color-666 mb5r">
+              已售: {{ item.stock_sales}}
+            </view>
+          </view>
+          <view class="list-item-btn   display-flex-content-center">
+            预约<u-icon
+              size="14"
+              color="#FFFFFF"
+              name="arrow-rightward"
+          ></u-icon>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import { getGoodList} from "@/common/api";
+
+export default {
+  data() {
+    return {
+      page: 1,
+      pageSize: 10,
+      total: 0,
+      search: "",
+      sort: "",
+      cateid: "",
+      subCateId: '',
+      sortType: "",
+      data:[],
+    };
+  },
+  onShow() {
+    this.getGoodList()
+  },
+  computed:{},
+  methods: {
+    getGoodList() {
+      let params = {
+        sort: this.sort,
+        sortType: this.sortType,
+        mark: "店内服务",
+        page: this.page,
+        pageSize: this.pageSize,
+        name: this.search,
+      }
+      getGoodList(params).then(({
+                                  data = {}
+                                }) => {
+        this.data = data.list
+        this.total = data.page.total
+      });
+    },
+    toDetail(item) {
+      uni.navigateTo({
+        url: `/subPages/service/serviceDetail?code=${item.code}`
+      });
+    },
+  },
+}
+</script>
+
+<style lang="scss">
+.shopping-wrapper {
+  width: calc(100% - 40rpx);
+  margin: 0rpx auto 0rpx;
+  padding: 0rpx 20rpx 60rpx;
+  .list-item {
+    margin-top: 25rpx;
+    background: #FFFFFF;
+    border-radius: 16rpx 16rpx 16rpx 16rpx;
+    width: calc(100% - 40rpx);
+    padding:20rpx;
+    &-title {
+      font-family: PingFang SC, PingFang SC;
+      font-weight: 600;
+      font-size: 28rpx;
+      color: #333333;
+      line-height: 40rpx;
+      text-align: left;
+      font-style: normal;
+      text-transform: none;
+    }
+    &-btn{
+      width: 164rpx;
+      height: 68rpx;
+      background: linear-gradient( 315deg, #CA9359 0%, #E2B98E 100%);
+      border-radius: 292rpx 292rpx 292rpx 292rpx;
+      font-size: 28rpx;
+      line-height: 36rpx;
+      text-align: center;
+      font-style: normal;
+      color: #FFFFFF;
+      text-transform: none;
+    }
+  }
+}
+</style>

subPages/service/serviceDetail.vue

@@ -0,0 +1,524 @@
+<template>
+  <view style="height: 100%; background: #F8F9FA;">
+    <van-image
+        class="huodongText2-img"
+        height="360rpx"
+        :src="courseInfo.cover"
+        width="100%"
+        style="display: flex;align-items: center;"
+    />
+    <view class="huodong-ccontent" >
+      <view class="course-content">
+        <view class="course-title fw700 fs18">{{ courseInfo.goods_name }}</view>
+        <view class="course-price" style="position: relative;">
+          <span style="font-size: 24rpx; color: #C29556;">￥&nbsp;</span><span class="fw700" style="font-size: 36rpx;color: #C29556;">{{courseInfo.price_selling}}</span>
+          <view style="position: absolute;right:0rpx;font-size: 22rpx;color:#888888;  display: flex;">
+            <view style="padding-top: 7rpx;width:28rpx;height: 28rpx ">
+              <van-image
+                  class="huodongText2-img"
+                  height="28rpx"
+                  src="/static/cart-a.png"
+                  width="28rpx"
+                  style="display: flex;"
+              />
+            </view>
+            <span style="padding-left: 20rpx;padding-right: 5rpx">&nbsp;已售:&nbsp;{{courseInfo.stock_sales}}</span>
+          </view>
+        </view>
+        <u-divider line-color="#E8E8E8"></u-divider>
+        <view class="course-title fw600">
+              门店信息
+        </view>
+        <view class="course-store display-flex-between">
+          <view class="course-store-left">
+            <view class="display-flex ">
+              <view class="course-store-left-img mr10">
+                <van-image
+                    class="huodongText2-img"
+                    height="28rpx"
+                    src="/static/hd-if-b.png"
+                    width="28rpx"
+                    style="display: flex;	align-items: center;justify-content: center;"
+                />
+              </view>
+              <view class="course-store-left-text">
+                {{store_position}}
+              </view>
+            </view>
+            <view class="display-flex-between ">
+              <view class="display-flex ">
+                <view class="course-store-left-img mr10">
+                  <van-image
+                      class="huodongText2-img"
+                      height="24rpx"
+                      src="/static/huodong-a.png"
+                      width="24rpx"
+                      style="display: flex;	align-items: center;justify-content: center;"
+                  />
+                </view>
+                <view class="course-store-left-text">
+                  {{business_hours}}
+                </view>
+              </view>
+              <view class="course-store-left-right">
+                <view class="course-store-left-right-img "  @click="openLocation">
+                  <van-image
+                      class="huodongText2-img"
+                      height="56rpx"
+                      src="/static/daohang.png"
+                      width="56rpx"
+                      style="display: flex;align-items: center;  justify-content: center;"
+
+                  />
+                </view>
+                <view class="course-store-left-right-img ml10" @click="makePhoneCall">
+                  <van-image
+                      class="huodongText2-img"
+                      height="56rpx"
+                      src="/static/dianhua.png"
+                      width="56rpx"
+                      style="display: flex;align-items: center;  justify-content: center;"
+                  />
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view  class="course-content-title">
+      课程介绍
+    </view>
+    <view   id="course-content"  ref="courseContent" style="width: 95%;margin: 0 auto;" v-html="courseInfo.content">
+    </view>
+    <view  style="width: 100%;height: 165rpx" > </view>
+    <van-toast id="van-toast"/>
+    <view class="bottom-navigation">
+      <view class="bottom-navigation-div">
+        <view  style="width: 40rpx;margin-right: 30rpx"   @click="toJump( 1)" >
+          <van-image
+              height="36rpx"
+              src="/static/hd-icon-a.png"
+              width="36rpx"
+              style="display: flex;align-items: center;  justify-content: center;"
+          />
+          <span>
+            首页
+          </span>
+        </view>
+        <view  style="width: 40rpx;position:relative"  open-type="contact">
+          <van-image
+              height="36rpx"
+              src="/static/hd-icon-c.png"
+              width="36rpx"
+              style="display: flex;align-items: center;  justify-content: center;"
+          />
+          <span>
+              咨询
+          </span>
+          <button style="position: absolute;width: 100%;height: 100%;z-index: 999;opacity: 0;top:0;"
+                  open-type="contact" ></button>
+        </view>
+      </view>
+      <button  class="course-button" @click="handleRegister">报名学习</button>
+    </view>
+  </view>
+
+</template>
+
+<script>
+import {getConfigData} from '@/common/api/common.js';
+
+import Toast from "../../wxcomponents/vant/dist/toast/toast";
+import {getGoodsDetail} from "../../common/api";
+
+
+export default {
+  components: {},
+  data() {
+    return {
+      page: 1,
+      pageSize: 10,
+      courseTypeList: [],
+      goods_code: 0,
+      courseInfo: {},
+      entry_end: 0,
+      remainingImages: [],
+      entry_num:0,
+      entry_max:0,
+      entry_balance:0,
+      is_entry:false,
+      suitNum:1,
+      phoneNumber: '',
+      store_name: '',
+      store_position: '',
+      business_hours: '',
+      latlng: '',
+    };
+  },
+
+  onLoad: function (option) {
+    this.goods_code = option.code
+  },
+  onShow() {
+    this.$nextTick(() => {
+      this.getCourseDetail()
+      this.setImgWidth()
+    });
+  },
+  created() {
+    const configs = uni.getStorageSync("configs");
+    if (configs) {
+      this.store_name = configs.store_name
+      this.phoneNumber = configs.store_phone
+      this.store_position = configs.store_position
+      this.business_hours = configs.business_hours
+      this.latlng = configs.latlng
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    getConfigDatalist() {
+      getConfigData({dict_id: 36}).then(({data}) => {
+        this.courseTypeList = data.reverse();
+      });
+    },
+    makePhoneCall() {
+      uni.makePhoneCall({
+        phoneNumber: this.phoneNumber, // 需要拨打的电话号码
+        success() {
+          console.log('拨打成功');
+        },
+        fail(err) {
+          console.error('拨打失败', err);
+          uni.showToast({
+            title: '拨打失败,请检查号码!',
+            icon: 'none'
+          });
+        }
+      });
+    },
+    openLocation() {
+      let [Lat, Lng] = ["36.02","117.93"]
+      if (this.latlng){
+         [Lat, Lng] = this.latlng.split(',')
+      }
+      uni.openLocation({
+        latitude: Number.parseFloat(Lat), // 实际的纬度，这里使用的是示例值
+        longitude: Number.parseFloat(Lng), // 实际的经度，这里使用的是示例值
+        scale: 18, // 地图缩放级别，范围通常是5~18，18是最详细的级别
+        name: this.store_name, // 可选，位置名称，会在地图的某些视图上显示
+        address: this.store_position // 可选，详细地址，同样会在地图的某些视图上显示
+      });
+    },
+    handleRegister() {
+      // Toast('敬请期待');
+      let tempList = this.courseInfo.data_specs[0].list
+      tempList = tempList.map(item => {
+        return {
+          group_name: item.group,
+          spec_name: item.name
+        }
+      })
+      let specText = tempList.map(item => {
+        return `${item.group_name}::${item.spec_name}`
+      })
+
+      // 准备发送的数据结构，包含商品代码、套件数量和规格文本
+      const sendData = {
+        items: [{
+          code: this.courseInfo.code, // 商品代码
+          count: this.suitNum, // 套件数量
+          // 将规格文本数组用“;;”连接成单个字符串
+          spec: specText.join(';;')
+        }]
+      }
+      // 调用API创建订单
+      this.$api.createOrder(sendData).then(res => {
+        // 成功创建订单后，显示成功提示
+        uni.showToast({
+          title: '订单创建成功'
+        })
+        // 导航到结算中心页面，并传递订单号作为查询参数
+        uni.navigateTo({
+          url: `/subPages/settleCenter/courseSettleCenter?orderNo=${res.data.order_no}`
+        })
+      })
+    },
+    getCourseDetail() {
+      getGoodsDetail({goods_code: this.goods_code}).then(({data}) => {
+        console.log(data)
+        this.courseInfo = data.goods
+        // 修正 courseInfo.content 中的 src 属性值
+        if (this.courseInfo.content) {
+          this.courseInfo.content = this.courseInfo.content.replace(/\/apihttps:/g, 'https:');
+          // 使用正则表达式匹配和修改 img 标签的 style 属性
+          this.courseInfo.content = this.courseInfo.content.replace(/<img([^>]*)>/gi, (match, attributes) => {
+            // 检查是否已经存在 style 属性
+            if (attributes.includes('style')) {
+              // 如果存在 style 属性，添加 width: 100%;
+              return match.replace(/style="([^"]*)"/i, (styleMatch, styleContent) => {
+                if (!styleContent.includes('width: 100%')) {
+                  return `style="${styleContent}; width: 100%;"`;
+                }
+                return styleMatch;
+              });
+            } else {
+              // 如果不存在 style 属性，添加 style="width: 100%;"
+              return match.replace(/<img/i, '<img style="width: 100%;"');
+            }
+          });
+          // 使用正则表达式匹配和修改 p 标签的 style 属性
+          this.courseInfo.content = this.courseInfo.content.replace(/<p([^>]*)>/gi, (match, attributes) => {
+            // 检查是否已经存在 style 属性
+            if (attributes.includes('style')) {
+              // 如果存在 style 属性，添加新的样式
+              return match.replace(/style="([^"]*)"/i, (styleMatch, styleContent) => {
+                const newStyles = 'font-weight: 400; font-size: 24rpx; color: #666666; line-height: 36rpx;';
+                if (!styleContent.includes(newStyles)) {
+                  return `style="${styleContent}; ${newStyles}"`;
+                }
+                return styleMatch;
+              });
+            } else {
+              // 如果不存在 style 属性，添加 style 属性
+              const newStyles = 'font-weight: 400; font-size: 24rpx; color: #666666; line-height: 36rpx;';
+              return match.replace(/<p/i, `<p style="${newStyles}"`);
+            }
+          });
+        }
+        // 确保在数据更新后调用 setImgWidth
+        this.$nextTick(() => {
+          this.setImgWidth();
+        });
+      });
+    },
+    setImgWidth() {
+      this.$nextTick(() => {
+        if (this.$refs.courseContent) {
+          const imgElements = this.$refs.courseContent.querySelectorAll('img');
+          imgElements.forEach(img => {
+            img.style.width = '100%';
+          });
+        } else {
+          console.log(this.$refs)
+        }
+      });
+    },
+    getStyles(index=0) {
+      let le =28
+      let  py=30
+      if (this.entry_num%2==1){
+        py+= 224/2-(84/2)-(le*Math.floor(this.entry_num / 2 ))-le/2
+      }else{
+        py+=224/2-(84/2)-(le*this.entry_num/2)
+      }
+      let right= index*le+py
+      var newVar = {
+        position: 'absolute',
+        width: '84rpx',
+        height: '84rpx',
+        borderRadius: '84rpx',
+        top: '30rpx',
+        right: right+'rpx',
+      };
+      return newVar
+    },
+    toJump( index) {
+      if(index==1){
+        uni.switchTab({
+          url:'/pages/home/index'
+        });
+      }else if(index==2){
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.common-page {
+  height: 100%;
+  padding: 30rpx;
+}
+
+.huodong-ccontent {
+  position: relative; /* 相对定位 */
+  width: 650rpx;
+  padding: 0rpx;
+  margin: 30rpx auto;
+  margin-bottom: 0;
+  padding: 30rpx;
+  background: #FFFFFF;
+  border-radius: 16rpx 16rpx 16rpx 16rpx;
+}
+
+
+.course-content {
+  margin-top: 30 rp;
+
+  .course-title {
+    font-family: PingFang SC-粗体;
+    font-weight: normal;
+    color: #333333;
+    line-height: 40rpx;
+    text-align: left;
+    font-style: normal;
+    text-transform: none;
+    margin-bottom: 16rpx;
+  }
+
+  .course-price {
+    font-family: 苹方, 苹方;
+    font-weight: 400;
+    font-size: 24rpx;
+    color: #666666;
+    line-height: 40rpx;
+    text-align: justify;
+    font-style: normal;
+    text-transform: none;
+    display: flex;
+  }
+  .course-store {
+    &-left{
+      width: 100%;
+      &-img{
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 28rpx;
+        height: 28rpx;
+
+      }
+      &-text{
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 500;
+        font-size: 24rpx;
+        color: #666666;
+        line-height: 36rpx;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+      }
+      &-right{
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        &-img{
+        }
+      }
+    }
+
+
+  }
+
+}
+
+
+
+.bottom-navigation{
+  position: fixed;
+  // 文字垂直居中
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  bottom: 0;
+  height: 100rpx;
+  width: calc(100% - 40rpx);
+  background: #FFFFFF;
+  box-shadow: 0rpx -2rpx 0rpx 0rpx #F1F3F6;
+  border-radius: 24rpx 24rpx 0rpx 0rpx;
+  border: 0rpx solid #979797;
+  padding: 20rpx 20rpx 68rpx 20rpx ;
+  &-div{
+    height: 76rpx;
+    width: 404rpx;
+    padding-top: 10rpx;
+    // 文字垂直居中
+    display: flex;
+    align-items: center;
+    padding-left: 30rpx;
+
+    span{
+      font-family: PingFang SC, PingFang SC;
+      font-weight: 400;
+      font-size: 20rpx;
+      color: #333333;
+      line-height: 32rpx;
+      text-align: left;
+      font-style: normal;
+      text-transform: none;
+    }
+
+  }
+
+
+  .course-button {
+    width: 264rpx;
+    height: 80rpx;
+    background: linear-gradient(315deg, #CA9359 0%, #E2B98E 100%);
+    border-radius: 292rpx 292rpx 292rpx 292rpx;
+    font-family: PingFang SC, PingFang SC;
+    font-weight: 400;
+    font-size: 28rpx;
+    color: #FFFFFF;
+    line-height: 36rpx;
+    text-align: center;
+    font-style: normal;
+    text-transform: none;
+    // 文字垂直居中
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+}
+/* 设置 v-html 渲染的内容中的 img 标签宽度为 100% */
+[v-html] img {
+  width: 100%!important;
+}
+/* 定义 CSS 变量 */
+:root {
+  --nav-bar-icon-color: black;
+  --nav-bar-arrow-size: 16px;
+  --tab-font-size: 28rpx;
+}
+.course-content-title {
+  margin: 30rpx auto;
+  width: 680rpx;
+  // 垂直居中
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 400;
+  font-size: 28rpx;
+  color: #333333;
+  line-height: 40rpx;
+  font-style: normal;
+  text-transform: none;
+  margin-bottom: 20rpx;
+  // 加粗
+  font-weight: bold;
+}
+/* 确保 van-nav-bar 内部的内容能够正确适应新的高度 */
+/deep/ .van-nav-bar__title {
+  font-family: PingFang SC, PingFang SC !important;
+  font-weight: 400 !important;
+  font-size: 36rpx !important;
+  color: #333333 !important;
+  text-align: center;
+  // 加粗
+  // font-weight: bold;
+}
+
+/deep/ .van-nav-bar__content {
+  text-align: center;
+}
+#course-content img{
+  width: 100%!important;
+}
+/* 添加 van-tab 标题的字体大小样式 */
+/deep/ .van-tab__text {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 400;
+  font-size: 28rpx;
+}
+</style>

subPages/service/serviceSave.vue

@@ -0,0 +1,524 @@
+<template>
+  <view style="height: 100%; background: #F8F9FA;">
+    <van-image
+        class="huodongText2-img"
+        height="360rpx"
+        :src="courseInfo.cover"
+        width="100%"
+        style="display: flex;align-items: center;"
+    />
+    <view class="huodong-ccontent" >
+      <view class="course-content">
+        <view class="course-title fw700 fs18">{{ courseInfo.goods_name }}</view>
+        <view class="course-price" style="position: relative;">
+          <span style="font-size: 24rpx; color: #C29556;">￥&nbsp;</span><span class="fw700" style="font-size: 36rpx;color: #C29556;">{{courseInfo.price_selling}}</span>
+          <view style="position: absolute;right:0rpx;font-size: 22rpx;color:#888888;  display: flex;">
+            <view style="padding-top: 7rpx;width:28rpx;height: 28rpx ">
+              <van-image
+                  class="huodongText2-img"
+                  height="28rpx"
+                  src="/static/cart-a.png"
+                  width="28rpx"
+                  style="display: flex;"
+              />
+            </view>
+            <span style="padding-left: 20rpx;padding-right: 5rpx">&nbsp;已售:&nbsp;{{courseInfo.stock_sales}}</span>
+          </view>
+        </view>
+        <u-divider line-color="#E8E8E8"></u-divider>
+        <view class="course-title fw600">
+              门店信息
+        </view>
+        <view class="course-store display-flex-between">
+          <view class="course-store-left">
+            <view class="display-flex ">
+              <view class="course-store-left-img mr10">
+                <van-image
+                    class="huodongText2-img"
+                    height="28rpx"
+                    src="/static/hd-if-b.png"
+                    width="28rpx"
+                    style="display: flex;	align-items: center;justify-content: center;"
+                />
+              </view>
+              <view class="course-store-left-text">
+                {{store_position}}
+              </view>
+            </view>
+            <view class="display-flex-between ">
+              <view class="display-flex ">
+                <view class="course-store-left-img mr10">
+                  <van-image
+                      class="huodongText2-img"
+                      height="24rpx"
+                      src="/static/huodong-a.png"
+                      width="24rpx"
+                      style="display: flex;	align-items: center;justify-content: center;"
+                  />
+                </view>
+                <view class="course-store-left-text">
+                  {{business_hours}}
+                </view>
+              </view>
+              <view class="course-store-left-right">
+                <view class="course-store-left-right-img "  @click="openLocation">
+                  <van-image
+                      class="huodongText2-img"
+                      height="56rpx"
+                      src="/static/daohang.png"
+                      width="56rpx"
+                      style="display: flex;align-items: center;  justify-content: center;"
+
+                  />
+                </view>
+                <view class="course-store-left-right-img ml10" @click="makePhoneCall">
+                  <van-image
+                      class="huodongText2-img"
+                      height="56rpx"
+                      src="/static/dianhua.png"
+                      width="56rpx"
+                      style="display: flex;align-items: center;  justify-content: center;"
+                  />
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view  class="course-content-title">
+      课程介绍
+    </view>
+    <view   id="course-content"  ref="courseContent" style="width: 95%;margin: 0 auto;" v-html="courseInfo.content">
+    </view>
+    <view  style="width: 100%;height: 165rpx" > </view>
+    <van-toast id="van-toast"/>
+    <view class="bottom-navigation">
+      <view class="bottom-navigation-div">
+        <view  style="width: 40rpx;margin-right: 30rpx"   @click="toJump( 1)" >
+          <van-image
+              height="36rpx"
+              src="/static/hd-icon-a.png"
+              width="36rpx"
+              style="display: flex;align-items: center;  justify-content: center;"
+          />
+          <span>
+            首页
+          </span>
+        </view>
+        <view  style="width: 40rpx;position:relative"  open-type="contact">
+          <van-image
+              height="36rpx"
+              src="/static/hd-icon-c.png"
+              width="36rpx"
+              style="display: flex;align-items: center;  justify-content: center;"
+          />
+          <span>
+              咨询
+          </span>
+          <button style="position: absolute;width: 100%;height: 100%;z-index: 999;opacity: 0;top:0;"
+                  open-type="contact" ></button>
+        </view>
+      </view>
+      <button  class="course-button" @click="handleRegister">报名学习</button>
+    </view>
+  </view>
+
+</template>
+
+<script>
+import {getConfigData} from '@/common/api/common.js';
+
+import Toast from "../../wxcomponents/vant/dist/toast/toast";
+import {getGoodsDetail} from "../../common/api";
+
+
+export default {
+  components: {},
+  data() {
+    return {
+      page: 1,
+      pageSize: 10,
+      courseTypeList: [],
+      goods_code: 0,
+      courseInfo: {},
+      entry_end: 0,
+      remainingImages: [],
+      entry_num:0,
+      entry_max:0,
+      entry_balance:0,
+      is_entry:false,
+      suitNum:1,
+      phoneNumber: '',
+      store_name: '',
+      store_position: '',
+      business_hours: '',
+      latlng: '',
+    };
+  },
+
+  onLoad: function (option) {
+    this.goods_code = option.code
+  },
+  onShow() {
+    this.$nextTick(() => {
+      this.getCourseDetail()
+      this.setImgWidth()
+    });
+  },
+  created() {
+    const configs = uni.getStorageSync("configs");
+    if (configs) {
+      this.store_name = configs.store_name
+      this.phoneNumber = configs.store_phone
+      this.store_position = configs.store_position
+      this.business_hours = configs.business_hours
+      this.latlng = configs.latlng
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    getConfigDatalist() {
+      getConfigData({dict_id: 36}).then(({data}) => {
+        this.courseTypeList = data.reverse();
+      });
+    },
+    makePhoneCall() {
+      uni.makePhoneCall({
+        phoneNumber: this.phoneNumber, // 需要拨打的电话号码
+        success() {
+          console.log('拨打成功');
+        },
+        fail(err) {
+          console.error('拨打失败', err);
+          uni.showToast({
+            title: '拨打失败,请检查号码!',
+            icon: 'none'
+          });
+        }
+      });
+    },
+    openLocation() {
+      let [Lat, Lng] = ["36.02","117.93"]
+      if (this.latlng){
+         [Lat, Lng] = this.latlng.split(',')
+      }
+      uni.openLocation({
+        latitude: Number.parseFloat(Lat), // 实际的纬度，这里使用的是示例值
+        longitude: Number.parseFloat(Lng), // 实际的经度，这里使用的是示例值
+        scale: 18, // 地图缩放级别，范围通常是5~18，18是最详细的级别
+        name: this.store_name, // 可选，位置名称，会在地图的某些视图上显示
+        address: this.store_position // 可选，详细地址，同样会在地图的某些视图上显示
+      });
+    },
+    handleRegister() {
+      // Toast('敬请期待');
+      let tempList = this.courseInfo.data_specs[0].list
+      tempList = tempList.map(item => {
+        return {
+          group_name: item.group,
+          spec_name: item.name
+        }
+      })
+      let specText = tempList.map(item => {
+        return `${item.group_name}::${item.spec_name}`
+      })
+
+      // 准备发送的数据结构，包含商品代码、套件数量和规格文本
+      const sendData = {
+        items: [{
+          code: this.courseInfo.code, // 商品代码
+          count: this.suitNum, // 套件数量
+          // 将规格文本数组用“;;”连接成单个字符串
+          spec: specText.join(';;')
+        }]
+      }
+      // 调用API创建订单
+      this.$api.createOrder(sendData).then(res => {
+        // 成功创建订单后，显示成功提示
+        uni.showToast({
+          title: '订单创建成功'
+        })
+        // 导航到结算中心页面，并传递订单号作为查询参数
+        uni.navigateTo({
+          url: `/subPages/settleCenter/courseSettleCenter?orderNo=${res.data.order_no}`
+        })
+      })
+    },
+    getCourseDetail() {
+      getGoodsDetail({goods_code: this.goods_code}).then(({data}) => {
+        console.log(data)
+        this.courseInfo = data.goods
+        // 修正 courseInfo.content 中的 src 属性值
+        if (this.courseInfo.content) {
+          this.courseInfo.content = this.courseInfo.content.replace(/\/apihttps:/g, 'https:');
+          // 使用正则表达式匹配和修改 img 标签的 style 属性
+          this.courseInfo.content = this.courseInfo.content.replace(/<img([^>]*)>/gi, (match, attributes) => {
+            // 检查是否已经存在 style 属性
+            if (attributes.includes('style')) {
+              // 如果存在 style 属性，添加 width: 100%;
+              return match.replace(/style="([^"]*)"/i, (styleMatch, styleContent) => {
+                if (!styleContent.includes('width: 100%')) {
+                  return `style="${styleContent}; width: 100%;"`;
+                }
+                return styleMatch;
+              });
+            } else {
+              // 如果不存在 style 属性，添加 style="width: 100%;"
+              return match.replace(/<img/i, '<img style="width: 100%;"');
+            }
+          });
+          // 使用正则表达式匹配和修改 p 标签的 style 属性
+          this.courseInfo.content = this.courseInfo.content.replace(/<p([^>]*)>/gi, (match, attributes) => {
+            // 检查是否已经存在 style 属性
+            if (attributes.includes('style')) {
+              // 如果存在 style 属性，添加新的样式
+              return match.replace(/style="([^"]*)"/i, (styleMatch, styleContent) => {
+                const newStyles = 'font-weight: 400; font-size: 24rpx; color: #666666; line-height: 36rpx;';
+                if (!styleContent.includes(newStyles)) {
+                  return `style="${styleContent}; ${newStyles}"`;
+                }
+                return styleMatch;
+              });
+            } else {
+              // 如果不存在 style 属性，添加 style 属性
+              const newStyles = 'font-weight: 400; font-size: 24rpx; color: #666666; line-height: 36rpx;';
+              return match.replace(/<p/i, `<p style="${newStyles}"`);
+            }
+          });
+        }
+        // 确保在数据更新后调用 setImgWidth
+        this.$nextTick(() => {
+          this.setImgWidth();
+        });
+      });
+    },
+    setImgWidth() {
+      this.$nextTick(() => {
+        if (this.$refs.courseContent) {
+          const imgElements = this.$refs.courseContent.querySelectorAll('img');
+          imgElements.forEach(img => {
+            img.style.width = '100%';
+          });
+        } else {
+          console.log(this.$refs)
+        }
+      });
+    },
+    getStyles(index=0) {
+      let le =28
+      let  py=30
+      if (this.entry_num%2==1){
+        py+= 224/2-(84/2)-(le*Math.floor(this.entry_num / 2 ))-le/2
+      }else{
+        py+=224/2-(84/2)-(le*this.entry_num/2)
+      }
+      let right= index*le+py
+      var newVar = {
+        position: 'absolute',
+        width: '84rpx',
+        height: '84rpx',
+        borderRadius: '84rpx',
+        top: '30rpx',
+        right: right+'rpx',
+      };
+      return newVar
+    },
+    toJump( index) {
+      if(index==1){
+        uni.switchTab({
+          url:'/pages/home/index'
+        });
+      }else if(index==2){
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.common-page {
+  height: 100%;
+  padding: 30rpx;
+}
+
+.huodong-ccontent {
+  position: relative; /* 相对定位 */
+  width: 650rpx;
+  padding: 0rpx;
+  margin: 30rpx auto;
+  margin-bottom: 0;
+  padding: 30rpx;
+  background: #FFFFFF;
+  border-radius: 16rpx 16rpx 16rpx 16rpx;
+}
+
+
+.course-content {
+  margin-top: 30 rp;
+
+  .course-title {
+    font-family: PingFang SC-粗体;
+    font-weight: normal;
+    color: #333333;
+    line-height: 40rpx;
+    text-align: left;
+    font-style: normal;
+    text-transform: none;
+    margin-bottom: 16rpx;
+  }
+
+  .course-price {
+    font-family: 苹方, 苹方;
+    font-weight: 400;
+    font-size: 24rpx;
+    color: #666666;
+    line-height: 40rpx;
+    text-align: justify;
+    font-style: normal;
+    text-transform: none;
+    display: flex;
+  }
+  .course-store {
+    &-left{
+      width: 100%;
+      &-img{
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 28rpx;
+        height: 28rpx;
+
+      }
+      &-text{
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 500;
+        font-size: 24rpx;
+        color: #666666;
+        line-height: 36rpx;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+      }
+      &-right{
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        &-img{
+        }
+      }
+    }
+
+
+  }
+
+}
+
+
+
+.bottom-navigation{
+  position: fixed;
+  // 文字垂直居中
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  bottom: 0;
+  height: 100rpx;
+  width: calc(100% - 40rpx);
+  background: #FFFFFF;
+  box-shadow: 0rpx -2rpx 0rpx 0rpx #F1F3F6;
+  border-radius: 24rpx 24rpx 0rpx 0rpx;
+  border: 0rpx solid #979797;
+  padding: 20rpx 20rpx 68rpx 20rpx ;
+  &-div{
+    height: 76rpx;
+    width: 404rpx;
+    padding-top: 10rpx;
+    // 文字垂直居中
+    display: flex;
+    align-items: center;
+    padding-left: 30rpx;
+
+    span{
+      font-family: PingFang SC, PingFang SC;
+      font-weight: 400;
+      font-size: 20rpx;
+      color: #333333;
+      line-height: 32rpx;
+      text-align: left;
+      font-style: normal;
+      text-transform: none;
+    }
+
+  }
+
+
+  .course-button {
+    width: 264rpx;
+    height: 80rpx;
+    background: linear-gradient(315deg, #CA9359 0%, #E2B98E 100%);
+    border-radius: 292rpx 292rpx 292rpx 292rpx;
+    font-family: PingFang SC, PingFang SC;
+    font-weight: 400;
+    font-size: 28rpx;
+    color: #FFFFFF;
+    line-height: 36rpx;
+    text-align: center;
+    font-style: normal;
+    text-transform: none;
+    // 文字垂直居中
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+}
+/* 设置 v-html 渲染的内容中的 img 标签宽度为 100% */
+[v-html] img {
+  width: 100%!important;
+}
+/* 定义 CSS 变量 */
+:root {
+  --nav-bar-icon-color: black;
+  --nav-bar-arrow-size: 16px;
+  --tab-font-size: 28rpx;
+}
+.course-content-title {
+  margin: 30rpx auto;
+  width: 680rpx;
+  // 垂直居中
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 400;
+  font-size: 28rpx;
+  color: #333333;
+  line-height: 40rpx;
+  font-style: normal;
+  text-transform: none;
+  margin-bottom: 20rpx;
+  // 加粗
+  font-weight: bold;
+}
+/* 确保 van-nav-bar 内部的内容能够正确适应新的高度 */
+/deep/ .van-nav-bar__title {
+  font-family: PingFang SC, PingFang SC !important;
+  font-weight: 400 !important;
+  font-size: 36rpx !important;
+  color: #333333 !important;
+  text-align: center;
+  // 加粗
+  // font-weight: bold;
+}
+
+/deep/ .van-nav-bar__content {
+  text-align: center;
+}
+#course-content img{
+  width: 100%!important;
+}
+/* 添加 van-tab 标题的字体大小样式 */
+/deep/ .van-tab__text {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 400;
+  font-size: 28rpx;
+}
+</style>