公告添加完成

src/pages.json

@@ -234,6 +234,12 @@
 			"style": {
 				"navigationBarTitleText": "购买协议"
 			}
+		},
+		{
+			"path": "pages/notice/detail",
+			"style": {
+				"navigationBarTitleText": "公告详情"
+			}
 		}
 	],
 	"tabBar": {

src/pages/index/index.vue

@@ -1,316 +1,392 @@
 <template>
-    <div class="Appindex">
-        <!-- 顶部 -->
-        <view class="head">
-            <!-- 搜索框 -->
-            <!-- <view class="head_search">
+  <div class="Appindex">
+    <!-- 顶部 -->
+    <view class="head">
+      <!-- 搜索框 -->
+      <!-- <view class="head_search">
                 <text class="iconfont">&#xe661;</text>
                 <text class="search_text">请输入搜索关键字</text>
             </view> -->
-            <!-- 搜索框-end -->
-
-            <!-- 轮播图 -->
-            <swiper-banner :radius="1" imgScale="5:2" :imgArr="BannerImg" :duration="1000" :interval="5000" :circular="true" :autoplay="true" @goList="goList" :indicator-dots="true" indicator-active-color="#12B280" indicator-color="rgba(255, 255, 255, .82)"></swiper-banner>
-            <!-- 轮播图-end -->
-
-            <!-- 公告 -->
-            <view class="head_notice clearfix">
-                <view class="notice_title">
-                    <image class="gg_img" src="@/static/img/gg.png"></image>
-                </view>
-                <swiper class="notice_swiper" vertical autoplay circular :interval="5000" :duration="1000">
-                    <swiper-item v-for="(item, index) in not_list" :key="index">
-                        <text class="not_list ellipsis1">{{ item.title }}</text>
-                        <text class="not_ico iconfont">&#xe62e;</text>
-                    </swiper-item>
-                </swiper>
-            </view>
-            <!-- 公告-end -->
-
-            <!-- 金刚区 -->
-            <view class="head_area">
-                <view class="area_list" v-for="(item, index) in area_list" :key="index" @click="setPageUrl(item)">
-                    <image class="area_img" :src="item.url"></image>
-                    <view class="area_name">{{ item.name }}</view>
-                </view>
-            </view>
-            <!-- 金刚区-end -->
-
-            <!-- 活动 -->
-            <view class="activity" v-if="spc_list.length > 0">
-                <image class="act_one_img" :src="spc_list[0].url" @click="setPageUrl({type:4})"  mode=""></image>
-                <view class="act_other">
-                    <image class="act_two_img" :src="spc_list[1].url" mode=""></image>
-                    <image class="act_two_img" :src="spc_list[2].url" mode=""></image>
-                </view>
-            </view>
-            <!-- 活动-end -->
+      <!-- 搜索框-end -->
+
+      <!-- 轮播图 -->
+      <swiper-banner
+        :radius="1"
+        imgScale="5:2"
+        :imgArr="BannerImg"
+        :duration="1000"
+        :interval="5000"
+        :circular="true"
+        :autoplay="true"
+        @goList="goList"
+        :indicator-dots="true"
+        indicator-active-color="#12B280"
+        indicator-color="rgba(255, 255, 255, .82)"
+      ></swiper-banner>
+      <!-- 轮播图-end -->
+
+      <!-- 公告 -->
+      <view class="head_notice clearfix">
+        <view class="notice_title">
+          <image class="gg_img" src="@/static/img/gg.png"></image>
         </view>
-        <view class="list_bar">
-            <div class="tit">猜你喜欢</div>
-            <view class="product-list">
-                <view class="product" v-for="(i, s) in productList" :key="s" @click="NavToGoodsDetail(i.id,i.type)">
-                    <view class="image-view">
-                        <image class="product-image" :src="i.original_img"></image>
-                    </view>
-                    <view :class="['product-title', 'ellipsis1']">{{ i.goods_name }}</view>
-                    <view class="product-price">
-                        <text class="product-price-original"><text class="product-unit">￥</text>{{ i.price }}</text>
-                        <!-- <text class="product-price-favour">￥{{i.originalPrice}}</text> -->
-                        <!-- <text class="product-tip">{{i.tip}}</text> -->
-                    </view>
-                    <view class="product-txt">赠送{{ i.give_integral ? i.give_integral + '批发积分' : i.give_cha_bao + '茶宝'}}</view>
-                </view>
-                <view class='fz_w_text mar_t20 mar_b20'>让数字经济赋能美好生活！</view>
-            </view>
+        <swiper
+          class="notice_swiper"
+          vertical
+          autoplay
+          circular
+          :interval="5000"
+          :duration="1000"
+        >
+          <swiper-item
+            v-for="(item, index) in not_list"
+            :key="index"
+            @click="toDetail(item)"
+          >
+            <text class="not_list ellipsis1">{{ item.title }}</text>
+            <text class="not_ico iconfont">&#xe62e;</text>
+          </swiper-item>
+        </swiper>
+      </view>
+      <!-- 公告-end -->
+
+      <!-- 金刚区 -->
+      <view class="head_area">
+        <view
+          class="area_list"
+          v-for="(item, index) in area_list"
+          :key="index"
+          @click="setPageUrl(item)"
+        >
+          <image class="area_img" :src="item.url"></image>
+          <view class="area_name">{{ item.name }}</view>
         </view>
-    </div>
+      </view>
+      <!-- 金刚区-end -->
+
+      <!-- 活动 -->
+      <view class="activity" v-if="spc_list.length > 0">
+        <image
+          class="act_one_img"
+          :src="spc_list[0].url"
+          @click="setPageUrl({ type: 4 })"
+          mode=""
+        ></image>
+        <view class="act_other">
+          <image class="act_two_img" :src="spc_list[1].url" mode=""></image>
+          <image class="act_two_img" :src="spc_list[2].url" mode=""></image>
+        </view>
+      </view>
+      <!-- 活动-end -->
+    </view>
+    <view class="list_bar">
+      <div class="tit">猜你喜欢</div>
+      <view class="product-list">
+        <view
+          class="product"
+          v-for="(i, s) in productList"
+          :key="s"
+          @click="NavToGoodsDetail(i.id, i.type)"
+        >
+          <view class="image-view">
+            <image class="product-image" :src="i.original_img"></image>
+          </view>
+          <view :class="['product-title', 'ellipsis1']">{{
+            i.goods_name
+          }}</view>
+          <view class="product-price">
+            <text class="product-price-original"
+              ><text class="product-unit">￥</text>{{ i.price }}</text
+            >
+            <!-- <text class="product-price-favour">￥{{i.originalPrice}}</text> -->
+            <!-- <text class="product-tip">{{i.tip}}</text> -->
+          </view>
+          <view class="product-txt"
+            >赠送{{
+              i.give_integral
+                ? i.give_integral + "批发积分"
+                : i.give_cha_bao + "茶宝"
+            }}</view
+          >
+        </view>
+        <view class="fz_w_text mar_t20 mar_b20">让数字经济赋能美好生活！</view>
+      </view>
+    </view>
+  </div>
 </template>
 <script>
-let app=getApp();
+let app = getApp();
 var appEv = app.$vm.$options;
 // import goodslist from "@/components/goodsList"; //商品列表
 import swiperBanner from "@/components/swiperBanner"; //轮播
 import { get, post } from "@/request/api.js";
 export default {
-    name: "Appindex",
-    components: {
-        // goodslist, //商品列表
-        swiperBanner, //轮播
-    },
-    data() {
-        return {
-            BannerImg: [], // 轮播图列表
-            not_list: [], // 公告列表
-             // 金刚区
-            area_list: [
-                 {name: "零售区", url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/menu/cart.png", type:1},
-                 {name: "批发区", url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/menu/wholesale.png", type:2},
-                 {name: "精品优选", url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/menu/preferred.png", type:3},
-                 {name: "茶宝兑换", url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/menu/integral.png", type:5}
-            ],
-            spc_list: [
-                {url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/ShuZiTea/ShuZiTeaHT/202210/f70cd8e0-e468-45eb-a9f7-2c42713cd607.jpg"},
-                {url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/ShuZiTea/ShuZiTeaHT/202210/b13c0186-fdfc-4b87-b466-5c9fc336cc54.jpg"},
-                {url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/ShuZiTea/ShuZiTeaHT/202210/49886d9c-ce5a-49ca-a281-12910541344f.jpg"}
-            ], //活动列表
-            productList: [], //商品数据
-        };
-    },
-    onLoad(option) {},
-    onLaunch() {},
-    onShow() {
-        this.loadData()
-        this.getBanner(); //获取轮播图
-        this.getAnnounce(); //获取公告列表
-        // this.getImageTwo(); //金刚区
-        // this.getImage(); //获取活动列表
-    },
-    onHide() {},
-    methods: {
-        loadData() {
-            post("goods/indexGoods").then((res) => {
-                if (res.code === 0) {
-                    this.productList = res.data.data;
-                }
-            });
+  name: "Appindex",
+  components: {
+    // goodslist, //商品列表
+    swiperBanner, //轮播
+  },
+  data() {
+    return {
+      BannerImg: [], // 轮播图列表
+      not_list: [], // 公告列表
+      // 金刚区
+      area_list: [
+        {
+          name: "零售区",
+          url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/menu/cart.png",
+          type: 1,
         },
-        // 跳转到商品详情页
-        NavToGoodsDetail(id, type) {
-            this.goto("/pages/product/p_details", { id, type });
+        {
+          name: "批发区",
+          url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/menu/wholesale.png",
+          type: 2,
         },
-        // 获取轮播图
-        getBanner() {
-            post("banner").then((res) => {
-                if (res.code === 0) {
-                    this.BannerImg = []
-                    res.data.data.forEach(e => {
-                        if(e.image) this.BannerImg.push(e.image)
-                    });
-                }
-            });
+        {
+          name: "精品优选",
+          url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/menu/preferred.png",
+          type: 3,
         },
-        // 获取公告列表
-        getAnnounce() {
-            post("notice").then((res) => {
-                if (res.code === 0) {
-                    this.not_list = [res.data.data];
-                }
-            });
+        {
+          name: "茶宝兑换",
+          url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/menu/integral.png",
+          type: 5,
         },
-        
-        // 获取金刚区列表
-        getImageTwo() {
-            post("ShuZiTeaSpecial/special/imageTwo").then((res) => {
-                if (res.status == 200) {
-                    this.area_list = res.data;
-                }
-            });
+      ],
+      spc_list: [
+        {
+          url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/ShuZiTea/ShuZiTeaHT/202210/f70cd8e0-e468-45eb-a9f7-2c42713cd607.jpg",
         },
-        // 获取活动区列表
-        getImage() {
-            post("ShuZiTeaSpecial/special/image").then((res) => {
-                if (res.status == 200) {
-                    this.spc_list = res.data;
-                }
-            });
+        {
+          url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/ShuZiTea/ShuZiTeaHT/202210/b13c0186-fdfc-4b87-b466-5c9fc336cc54.jpg",
         },
-        // 轮播图跳转
-        goList(e) {},
-        // 金刚区跳转
-        setPageUrl(item){
-            if([1,3,4].includes(item.type)){
-                this.goto('/pages/product/productRetail',{type:item.type})
-            }
-            else if(item.type == 2){
-                this.goto('/pages/product/productWholesale',{type:2})
-            }
-            else if(item.type == 5){
-                this.goto('/pages/product/productTeaBaby',{type:item.type})
-            }
-            else{
-                appEv.errTips('此功能暂未开放！')
-                return false
-            }
+        {
+          url: "https://teaclub.oss-cn-chengdu.aliyuncs.com/ShuZiTea/ShuZiTeaHT/202210/49886d9c-ce5a-49ca-a281-12910541344f.jpg",
         },
+      ], //活动列表
+      productList: [], //商品数据
+    };
+  },
+  onLoad(option) {},
+  onLaunch() {},
+  onShow() {
+    this.loadData();
+    this.getBanner(); //获取轮播图
+    this.getAnnounce(); //获取公告列表
+    // this.getImageTwo(); //金刚区
+    // this.getImage(); //获取活动列表
+  },
+  onHide() {},
+  methods: {
+    loadData() {
+      post("goods/indexGoods").then((res) => {
+        if (res.code === 0) {
+          this.productList = res.data.data;
+        }
+      });
+    },
+    // 跳转到商品详情页
+    NavToGoodsDetail(id, type) {
+      this.goto("/pages/product/p_details", { id, type });
     },
-    computed: {},
-    watch: {},
-    onShareAppMessage: function () {
-        let userinfo = uni.getStorageSync('userinfo');
-        var path = '/pages/index/index?agentId=1';
-        if (userinfo.user_id) {
-            path = '/pages/index/index?agentId=' + userinfo.user_id;
+    // 获取轮播图
+    getBanner() {
+      post("banner").then((res) => {
+        if (res.code === 0) {
+          this.BannerImg = [];
+          res.data.data.forEach((e) => {
+            if (e.image) this.BannerImg.push(e.image);
+          });
         }
-        var title = `让数字经济赋能美好生活！`;
-        return {
-            title: title,
-            path: path
+      });
+    },
+    // 获取公告列表
+    getAnnounce() {
+      post("notice").then((res) => {
+        if (res.code === 0) {
+          this.not_list = [res.data.data];
+        }
+      });
+    },
+    //跳转公告详情
+    toDetail(item) {
+      uni.redirectTo({
+        url:
+          "/pages/notice/detail?detail=" +
+          encodeURIComponent(JSON.stringify(item)),
+      });
+      // this.goto("/pages/notice/detail", { ...item });
+    },
+
+    // 获取金刚区列表
+    getImageTwo() {
+      post("ShuZiTeaSpecial/special/imageTwo").then((res) => {
+        if (res.status == 200) {
+          this.area_list = res.data;
         }
+      });
     },
+    // 获取活动区列表
+    getImage() {
+      post("ShuZiTeaSpecial/special/image").then((res) => {
+        if (res.status == 200) {
+          this.spc_list = res.data;
+        }
+      });
+    },
+    // 轮播图跳转
+    goList(e) {},
+    // 金刚区跳转
+    setPageUrl(item) {
+      if ([1, 3, 4].includes(item.type)) {
+        this.goto("/pages/product/productRetail", { type: item.type });
+      } else if (item.type == 2) {
+        this.goto("/pages/product/productWholesale", { type: 2 });
+      } else if (item.type == 5) {
+        this.goto("/pages/product/productTeaBaby", { type: item.type });
+      } else {
+        appEv.errTips("此功能暂未开放！");
+        return false;
+      }
+    },
+  },
+  computed: {},
+  watch: {},
+  onShareAppMessage: function () {
+    let userinfo = uni.getStorageSync("userinfo");
+    var path = "/pages/index/index?agentId=1";
+    if (userinfo.user_id) {
+      path = "/pages/index/index?agentId=" + userinfo.user_id;
+    }
+    var title = `让数字经济赋能美好生活！`;
+    return {
+      title: title,
+      path: path,
+    };
+  },
 };
 </script>
 <style scoped lang='scss'>
 .head {
-    padding: 12rpx 28rpx;
+  padding: 12rpx 28rpx;
 }
 
 .head_search {
-    width: 100%;
-    height: 64rpx;
-    line-height: 64rpx;
-    background: #f3f5f7;
-    border-radius: 32rpx;
-    text-align: center;
-    font-size: 28rpx;
-    color: #bbbbbb;
-    margin-bottom: 26rpx;
-
-    .search_text {
-        margin-left: 14rpx;
-    }
+  width: 100%;
+  height: 64rpx;
+  line-height: 64rpx;
+  background: #f3f5f7;
+  border-radius: 32rpx;
+  text-align: center;
+  font-size: 28rpx;
+  color: #bbbbbb;
+  margin-bottom: 26rpx;
+
+  .search_text {
+    margin-left: 14rpx;
+  }
 }
 
 .head_notice {
-    margin: 30rpx 0;
+  margin: 30rpx 0;
 
-    .notice_title {
-        width: 130rpx;
-        height: 40rpx;
-        float: left;
+  .notice_title {
+    width: 130rpx;
+    height: 40rpx;
+    float: left;
 
-        .gg_img {
-            width: 100%;
-            height: 40rpx;
-        }
+    .gg_img {
+      width: 100%;
+      height: 40rpx;
     }
+  }
 
-    .notice_swiper {
-        height: 40rpx;
-        padding-left: 20rpx;
-        font-size: 28rpx;
-        float: left;
-        box-sizing: border-box;
-        width: calc(100% - 130rpx);
+  .notice_swiper {
+    height: 40rpx;
+    padding-left: 20rpx;
+    font-size: 28rpx;
+    float: left;
+    box-sizing: border-box;
+    width: calc(100% - 130rpx);
 
-        .not_list {
-            width: calc(100% - 50rpx);
-        }
+    .not_list {
+      width: calc(100% - 50rpx);
+    }
 
-        .not_ico {
-            width: 30rpx;
-            font-size: 28rpx;
-            color: #999;
-        }
+    .not_ico {
+      width: 30rpx;
+      font-size: 28rpx;
+      color: #999;
+    }
 
-        .not_list,
-        .not_ico {
-            display: inline-block;
-            vertical-align: middle;
-            height: 40rpx;
-            line-height: 40rpx;
-        }
+    .not_list,
+    .not_ico {
+      display: inline-block;
+      vertical-align: middle;
+      height: 40rpx;
+      line-height: 40rpx;
     }
+  }
 }
 
 // 金刚区
 .head_area {
-    margin: 20rpx 0 20rpx;
-    padding: 20rpx 0;
-    border-radius: 18rpx;
-    box-shadow: 4rpx 4rpx 26rpx 2rpx rgba(17, 18, 29, 0.08);
-
-    .area_list {
-        display: inline-block;
-        width: 25%;
-        text-align: center;
+  margin: 20rpx 0 20rpx;
+  padding: 20rpx 0;
+  border-radius: 18rpx;
+  box-shadow: 4rpx 4rpx 26rpx 2rpx rgba(17, 18, 29, 0.08);
+
+  .area_list {
+    display: inline-block;
+    width: 25%;
+    text-align: center;
 
-        .area_img {
-            width: 46rpx;
-            height: 46rpx;
-            margin-bottom: 12rpx;
-        }
+    .area_img {
+      width: 46rpx;
+      height: 46rpx;
+      margin-bottom: 12rpx;
+    }
 
-        .area_name {
-            font-size: 24rpx;
-            color: #474747;
-        }
+    .area_name {
+      font-size: 24rpx;
+      color: #474747;
     }
+  }
 }
 
 // 金刚区-end
 
 // 活动
 .activity {
-    .act_one_img {
-        display: inline-block;
-        width: 300rpx;
-        height: 378rpx;
-        margin-right: 10rpx;
-    }
+  .act_one_img {
+    display: inline-block;
+    width: 300rpx;
+    height: 378rpx;
+    margin-right: 10rpx;
+  }
 
-    .act_other {
-        display: inline-block;
-        width: calc(100% - 300rpx - 10rpx);
-    }
+  .act_other {
+    display: inline-block;
+    width: calc(100% - 300rpx - 10rpx);
+  }
 
-    .act_two_img {
-        width: 100%;
-        height: 185rpx;
-    }
+  .act_two_img {
+    width: 100%;
+    height: 185rpx;
+  }
 }
 
 // 活动-end
 
 // 商品列表
-.list_bar{
-    .tit{
-        text-align: center;
-        font-size: 36rpx;
-        color: #121212;
-        padding: 40rpx 0 20rpx;
-        font-weight: bold;
-    }
+.list_bar {
+  .tit {
+    text-align: center;
+    font-size: 36rpx;
+    color: #121212;
+    padding: 40rpx 0 20rpx;
+    font-weight: bold;
+  }
 }
 .product-list {
   padding: 0 20rpx;
@@ -330,8 +406,8 @@ export default {
     // border: 1px solid #eee;
     border-radius: 5px;
     box-shadow: 4rpx 4rpx 26rpx 2rpx rgba(17, 18, 29, 0.08);
-    &:nth-child(2n){
-        margin-left: 3%;
+    &:nth-child(2n) {
+      margin-left: 3%;
     }
   }
 

src/pages/notice/detail.vue

@@ -0,0 +1,69 @@
+<template>
+  <view class="container">
+    <!-- 公告详情 -->
+    <view class="title">{{noticeDetail.title}}</view>
+    <view class="time" v-if="noticeDetail">{{ $day(noticeDetail.add_time * 1000).format('YYYY-MM-DD HH:mm:ss') }}</view>
+    <jyf-parser :html="noticeDetail.content" class="mar_t50"></jyf-parser>
+    <!-- 公告详情-end -->
+  </view>
+</template>
+
+<script>
+let app = getApp();
+// let reqApi = new ReqApi();
+var appEv = app.$vm.$options;
+import { post } from "@/request/api.js";
+import jyfParser from "@/components/jyf-parser/jyf-parser.vue";
+// import { ReqApi } from "@/utils/reqTools.js";
+export default {
+  data() {
+    return {
+      content: "",
+      noticeDetail: undefined,
+    };
+  },
+  onLoad(option) {
+    this.noticeDetail = JSON.parse(decodeURIComponent(option.detail));
+    console.log(this.noticeDetail, "qqqq");
+    // this.loadData()
+  },
+  methods: {
+    loadData() {
+      let data = {
+        type: 2,
+      };
+      post("/my/article", data).then((res) => {
+        if (res.code == 0) {
+          this.content = res.data.data.content;
+          console.log(this.content);
+          // this.BannerImg = res.list;
+        }
+      });
+    },
+  },
+  components: {
+    jyfParser,
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+// 用户须知
+.container {
+  border-top: 20rpx solid #f5f5f5;
+  padding: 0 20rpx;
+  box-sizing: border-box;
+  .title{
+    margin-top: 20rpx;
+    font-size: 48rpx;
+    font-weight: bold;
+  }
+  
+  .time{
+    margin-top: 10rpx;
+    font-size: 30rpx;
+    color: #666363;
+  }
+}
+// 用户须知-end
+</style>