Merge branch 'master' of http://121.40.40.223:3000/zizhong.wang/konggang-city-miniprogram

components/footer-share/footer-share.vue

@@ -1,59 +1,77 @@
 <template>
-	<view class="footer-share-box display-around">
-		<button class="display-flex-start items-center share-font" :style="{'border-right': isCollection ? '1px solid #d8d8d8' : 'none'}" open-type="share" @click="sharePage()">
-			<view style="margin-right:15rpx;font-size: 26rpx;">分享</view>
-			<image src="../../static/share_icon.png" mode="aspectFill" style="width: 30rpx;height: 30rpx;"></image>
-		</button> 
-		<view class="display-flex-start items-center share-font" v-if='isCollection' @click="collectionPage()">
-			<view style="margin-right:15rpx;font-size: 26rpx;">收藏</view>
-			<image src="../../static/collection.png" mode="aspectFill" style="width: 40rpx;height: 40rpx;"></image>
-		</view>
-	</view>
+  <view class="footer-share-box display-around">
+    <button
+      class="display-flex-start items-center share-font"
+      :style="{ 'border-right': isCollection ? '1px solid #d8d8d8' : 'none' }"
+      open-type="share"
+      @click="sharePage()"
+    >
+      <view style="margin-right: 15rpx; font-size: 26rpx">分享</view>
+      <image
+        src="../../static/share_icon.png"
+        mode="aspectFill"
+        style="width: 30rpx; height: 30rpx"
+      ></image>
+    </button>
+    <view
+      class="display-flex-start items-center share-font"
+      v-if="isCollection"
+      @click="collectionPage()"
+    >
+      <view style="margin-right: 15rpx; font-size: 26rpx">收藏</view>
+      <image
+        src="../../static/collection.png"
+        mode="aspectFill"
+        style="width: 40rpx; height: 40rpx"
+      ></image>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		name:"footer-share",
-		props:{
-			isCollection: {
-			  type: Boolean,
-			  default:false
-			}
-		},
-		data() {
-			return {
-				
-			};
-		},
-		methods:{
-			sharePage() {
-			    this.$emit('sharePages')
-			},
-			collectionPage() {
-			    this.$emit('collectionPages')
-			},
-		}
-	}
+export default {
+  name: "footer-share",
+  props: {
+    isCollection: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {};
+  },
+  methods: {
+    sharePage() {
+      this.$emit("sharePages");
+    },
+    collectionPage() {
+      this.$emit("collectionPages");
+    },
+  },
+};
 </script>
 
 <style>
-   .footer-share-box {
-	   height: 50rpx;
-	   position: fixed;
-	   bottom: 0;
-	   width: 100%;
-	   border-radius: 10rpx;
-	   box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.1);
-	   padding: 20rpx;
-	   background: #fff;
-   }
-   .share-font {
-	   width: 45%;
-	   justify-content: center;
-   }
-   .footer-share-box button {
-	   background-color: #fff;
-	   border-radius:0;
-   }
-  .footer-share-box button::after{ border: none;} 
+.footer-share-box {
+  height: 50rpx;
+  position: fixed;
+  bottom: 0;
+  width: 100%;
+  border-radius: 10rpx;
+  box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.1);
+  padding: 20rpx;
+  background: #fff;
+  margin-left: -20rpx;
+}
+.share-font {
+  width: 45%;
+  justify-content: center;
+}
+.footer-share-box button {
+  background-color: #fff;
+  border-radius: 0;
+}
+.footer-share-box button::after {
+  border: none;
+}
 </style>

pages.json

@@ -1,5 +1,5 @@
 {
-	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
+	"pages": [ 
 		{
 			"path": "pages/index/index",
 			"style": {
@@ -24,7 +24,8 @@
 		{
 			"path": "pages/appeal/index",
 			"style": {
-				"navigationBarTitleText": "提建议",				"navigationBarBackgroundColor": "#02A7F0",
+				"navigationBarTitleText": "提建议",	
+				"navigationBarBackgroundColor": "#02A7F0",
 				"navigationBarTextStyle":"white"
 			}
 		},
@@ -56,6 +57,12 @@
 			}
 		},
 		{
+			"path": "pages/policy/policy_deatil",
+			"style": {
+				"navigationBarTitleText": "政策详情"
+			}
+		},
+		{
 			"path": "pages/park/index",
 			"style": {
 				"navigationBarTitleText": "园区专区",

pages/index/index.vue

@@ -1,15 +1,21 @@
 <template>
 	<view class="content">
-		<view class="page-section-spacing" style="width: 100%;">
+		<view class="page-section-spacing" style="width: 100%;position: relative;">
 		 	<swiper class="swiper" 
-		 		indicator-dots="true" 
+		 		 indicator-dots="false" 
 				 autoplay="true" 
 		 		 duration="500"	
-				 style="height:400rpx">
-		 		<swiper-item v-for="(item , index) in swiperList" :key="index">
+				 style="height:400rpx"
+				 @change="swiperChange">
+		 		<swiper-item v-for="(item , index) in swiperList" :key="index" class="swiper-content">
 		 			<image :src="item.pic_path" mode="aspectFill" style="width: 100%;height: 100%;"></image>
 		 		</swiper-item>
 		 	</swiper>
+			<view class="rowDot">
+				 <view v-for="(item,index) in swiperList" :key="index" class="dots">
+					 <view :class="['dot',index === swiperCurrent ? 'active' : '']"></view>
+				 </view>
+			</view>
 		 </view>
 		 
 		 <view class="page-nav-box">	
@@ -138,6 +144,7 @@
 						img:'/static/swiper/swiper2.jpg'
 					},
 				],
+				swiperCurrent:0,
 			    navList:[
 					{
 						url:'/static/navList/appeal.png',
@@ -259,6 +266,9 @@
            this.getSwiperList()
 		},
 		methods: {
+			swiperChange(e){
+				this.swiperCurrent = e.detail.current
+			},
 			getSwiperList(){
 				let md5Sign = md5("method="+'common'+"&timestamp="+getApp().globalData.globalTimestamp+"&secret="+getApp().globalData.secret)
 				let url = getApp().globalData.shareUrl+'api/api.php'+'?method=common&source=main_pics&action=list&timestamp='+getApp().globalData.globalTimestamp +'&sign='+md5Sign
@@ -316,7 +326,32 @@
 		font-size: 36rpx;
 		color: #8f8f94;
 	}
-	
+	.rowDot {
+		display: flex;
+		position: absolute;
+		top: 135px;
+		left: 40px;
+	}
+	.dots {
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		align-content: center;
+	}
+	.dot {
+		margin-right: 8rpx;
+		width: 40rpx;
+		height: 8rpx;
+		opacity: 1;
+		border-radius: 6rpx;
+		background: #fff5f9;
+	}
+	.dot.active {
+		background: #ff4e54;
+	}
+	.swiper-content {
+		border-radius: 0 0 10% 10%; 
+	}
 	.page-nav-box {
 		width: 80%;
 		/* height: 320rpx; */

pages/park/park_deatil.vue

@@ -126,7 +126,7 @@
 			</view>
 		</view>
 	   
-		<footer-share style="width: 100%;" :isCollection="false" @collectionPages="collectionPage" @sharePages="sharePage"></footer-share>
+		<footer-share style="width: 100%;" :isCollection="true" @collectionPages="collectionPage" @sharePages="sharePage"></footer-share>
 	</view> 
 	</view>
 </template>

pages/policy/index.vue

@@ -1,6 +1,6 @@
 <template>
   <view class="content">
-    <div class="swiper-box" style="width: 100%">
+    <view class="swiper-box" style="width: 100%">
       <swiper
         class="swiper"
         indicator-dots="true"
@@ -16,15 +16,15 @@
           ></image>
         </swiper-item>
       </swiper>
-    </div>
-    <div class="input-box">
+    </view>
+    <view class="input-box">
       <image src="/static/policy/u377.png" alt="" />
       <input type="text" placeholder="请输入政策关键词搜索" />
-    </div>
-    <div class="policy-box">
-      <div class="policy-title"><p>最新政策</p></div>
-      <div class="policy-item-box">
-        <div
+    </view>
+    <view class="policy-box">
+      <view class="policy-title"><p>最新政策</p></view>
+      <view class="policy-item-box">
+        <view
           v-for="(item, idx) in policyList"
           :key="idx"
           :class="{ active: active === idx }"
@@ -32,28 +32,29 @@
           @click="active = idx"
         >
           {{ item }}
-        </div>
-      </div>
-      <div class="policy-content">
-        <div
+        </view>
+      </view>
+      <view class="policy-content">
+        <view
           class="policy-content-item"
           v-for="(item, idx) in policyData"
           :key="idx"
+          @click="enterPolicyDeatil(item)"
         >
-          <div class="policy-content-item-left">
+          <view class="policy-content-item-left">
             <p class="policy-content-item-left-title">{{ item.title }}</p>
-            <div class="policy-content-item-left-time">
+            <view class="policy-content-item-left-time">
               <p class="moment">{{ item.moment }}</p>
               <p class="maxMony">{{ item.maxMony }}</p>
               <p class="leftDay">{{ item.leftDay }}</p>
-            </div>
-          </div>
-          <div class="policy-content-item-img">
+            </view>
+          </view>
+          <view class="policy-content-item-img">
             <image :src="item.img" alt="" />
-          </div>
-        </div>
-      </div>
-    </div>
+          </view>
+        </view>
+      </view>
+    </view>
   </view>
 </template>
 
@@ -82,7 +83,17 @@ export default {
     };
   },
   onLoad() {},
-  methods: {},
+  methods: {
+    enterPolicyDeatil(data) {
+      let id = { data };
+      if (!id) {
+        id = "ILoveYou";
+      }
+      uni.navigateTo({
+        url: "/pages/policy/policy_deatil?id=" + id,
+      });
+    },
+  },
 };
 </script>
 
@@ -131,7 +142,7 @@ export default {
         height: 70rpx;
         color: #ffffff;
         border-radius: 0 40rpx 40rpx 0rpx;
-        font-size: 30rpx;
+        font-size: 28rpx;
         display: flex;
         justify-content: center;
         align-items: center;
@@ -145,6 +156,7 @@ export default {
 
       .policy-item-name {
         padding-bottom: 10rpx;
+        font-size: 27rpx;
       }
       .active {
         font-weight: 600;
@@ -154,15 +166,16 @@ export default {
     .policy-content {
       width: 100%;
       display: flex;
-
       box-sizing: border-box;
       flex-direction: column;
       .policy-content-item {
         margin: 0 20rpx;
         display: flex;
-        border-bottom: 1px solid #c1c1c1;
+        box-shadow: 0px 4rpx 32rpx rgba(0, 0, 0, 0.1);
+        border-radius: 32rpx;
         padding-bottom: 10rpx;
         margin-top: 20rpx;
+        padding: 30rpx;
         justify-content: space-between;
         .policy-content-item-left {
           display: flex;
@@ -176,7 +189,7 @@ export default {
             -webkit-line-clamp: 2;
             line-clamp: 2;
             -webkit-box-orient: vertical;
-            font-size: 28rpx;
+            font-size: 25rpx;
             margin-bottom: 10rpx;
           }
           .policy-content-item-left-time {
@@ -194,6 +207,7 @@ export default {
               border: 1px solid #00bfbf;
               padding: 10rpx;
               margin-right: 20rpx;
+              border-radius: 12rpx;
             }
             .leftDay {
               font-size: 20rpx;
@@ -201,6 +215,7 @@ export default {
               color: #e32579;
               padding: 10rpx;
               border: 1px solid #f7bbc3;
+              border-radius: 12rpx;
             }
           }
         }
@@ -208,6 +223,7 @@ export default {
           image {
             width: 180rpx;
             height: 120rpx;
+            border-radius: 12rpx;
           }
         }
       }

pages/policy/policy_deatil.vue

@@ -0,0 +1,264 @@
+<template>
+  <div class="content">
+    <div class="title-box">
+      <div class="title">【工信部】关于推动民营经济高质量发展的若干意见</div>
+      <div class="title-time">
+        <p class="time">2021-05-07 10:15</p>
+        <p class="read-count">阅读量 488</p>
+      </div>
+    </div>
+    <div class="video-box">
+      <image src="/static/policy/u575.png"></image>
+    </div>
+    <!-- 企业研发投入补贴 -->
+    <div class="card-input-content">
+      <div class="card-input">
+        <div class="card-title">企业研发投入补贴</div>
+        <div class="table">
+          <p class="table-item">
+            <span>项目金额:</span>
+            <span>最高500.00万</span>
+          </p>
+          <p class="table-item">
+            <span>申报时间:</span>
+            <span>2021-08-20 至 2021-09-20</span>
+          </p>
+          <p class="table-item">
+            <span>申报状态:</span>
+            <span>剩5天</span>
+          </p>
+        </div>
+      </div>
+    </div>
+    <!-- 项目概况 -->
+    <div class="card-situation">
+      <div class="card-title">项目概况</div>
+      <p>
+        为贯彻落实《加强信息共享 促进产融合作行动方案》 （工信部联财 [2014]
+        83号）、和《推进工业化文化发展实施方案（2021-2025年）》工信部联政法（
+        [2021]
+        54号）等文件精神，壮大工旅文融合发展格局，助力制造强国和网络强国建设，现组织开展2021年度工业文化产业项目征集工作。
+      </p>
+    </div>
+    <div class="card-group" v-for="(item, idx) in model" :key="idx">
+      <policy-deatil-card
+        :model="item"
+        :isMar="idx == model.length - 1"
+      ></policy-deatil-card>
+    </div>
+    <!-- <div class="share-collection">
+      <div class="share">
+        <span>分享</span>
+        <image src="/static/policy/u2091.png" />
+      </div>
+      <div class="collection">
+        <span>收藏</span>
+        <image src="/static/policy/u2096.png" />
+      </div>
+    </div> -->
+    <div style="width: 100%">
+      <footer-share
+        style="width: 100%"
+        :isCollection="true"
+        @collectionPages="collectionPage"
+        @sharePages="sharePage"
+      ></footer-share>
+    </div>
+  </div>
+</template>
+
+<script>
+import policy_deatil_card from "./policy_deatil_card";
+export default {
+  components: {
+    policyDeatilCard: policy_deatil_card,
+  },
+  data() {
+    return {
+      model: [
+        {
+          title: "基本信息",
+          item: [
+            {
+              name: "项目名称",
+              value: ["企业研发投入补贴"],
+            },
+            {
+              name: "受理部门",
+              value: ["区科技创新局"],
+            },
+            {
+              name: "政策层级",
+              value: ["西咸新区"],
+            },
+            {
+              name: "信息提供日期",
+              value: ["2021-08-20"],
+            },
+          ],
+        },
+        {
+          title: "支持力度",
+          item: [
+            {
+              name: "支持金额",
+              value: ["最高500.00万"],
+            },
+            {
+              name: "支持金额",
+              value: [
+                "1. 对研发投入达到1000万元的企业，给予20万元研发投入补贴；",
+                "2. 研发超过1000万的部分，每增长1000万追加奖励5万元；",
+                "3. 本项目受企业纳税额限制。",
+              ],
+            },
+          ],
+        },
+      ],
+      id: "",
+    };
+  },
+  onLoad(option) {
+    let id = option.id;
+  },
+  methods: {
+    collectionPage() {
+      console.log("已收藏");
+    },
+    sharePage() {
+      console.log("分享");
+      uni.showShareMenu({
+        title: "园区XXX",
+        path: "pages/park/park_detail",
+        success(res) {
+          console.log(res);
+        },
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+* {
+  box-sizing: border-box;
+}
+.footer-share-box{
+  margin-left: -20rpx;
+}
+.content {
+  margin-top: 20rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 20rpx;
+  .title-box {
+    display: flex;
+    flex-direction: column;
+
+    padding-bottom: 10rpx;
+    .title {
+      letter-spacing: 5rpx;
+      font-size: 35rpx;
+      font-weight: 500;
+    }
+    .title-time {
+      display: flex;
+      font-size: 20rpx;
+      color: $uni-text-color-grey;
+      margin-top: 20rpx;
+      .time {
+        margin-left: 20rpx;
+        margin-right: 100rpx;
+      }
+    }
+  }
+  .video-box {
+    width: 100%;
+    image {
+      width: 100%;
+      height: 400rpx;
+      border-radius: 32rpx;
+    }
+  }
+  .card-input-content {
+    width: 100%;
+    margin-top: 20rpx;
+    .card-input {
+      padding: 30rpx 30rpx;
+      box-shadow: 0px 4rpx 32rpx rgba(0, 0, 0, 0.1);
+      border-radius: 32rpx;
+      .card-title {
+        font-weight: 600;
+        padding: 20rpx 20rpx 0rpx 20rpx;
+      }
+      .table {
+        border-radius: 32rpx;
+        background-color: #f2f2f2;
+        margin-top: 20rpx;
+        display: flex;
+        padding: 0 20rpx;
+        flex-direction: column;
+        .table-item {
+          box-sizing: border-box;
+          width: 100%;
+          margin: 20rpx 0;
+          font-size: 27rpx;
+          font-weight: 300;
+          display: flex;
+          justify-content: space-between;
+        }
+      }
+    }
+  }
+
+  .card-situation {
+    margin-top: 20rpx;
+    padding: 20rpx;
+    border-top: 8rpx solid #f2f2f2;
+    box-shadow: 0px 4rpx 32rpx rgba(0, 0, 0, 0.1);
+    border-radius: 32rpx;
+    .card-title {
+      font-weight: 600;
+      padding: 20rpx 20rpx 0rpx 20rpx;
+    }
+    p {
+      padding: 20rpx;
+      margin-top: 20rpx;
+      font-size: 27rpx;
+      letter-spacing: 1rpx;
+      line-height: 50rpx;
+    }
+  }
+  .card-group {
+    width: 100%;
+  }
+  .share-collection {
+    background-color: #ffffff;
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    height: 80rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    .share,
+    .collection {
+      width: 50%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      height: 100%;
+    }
+    .share {
+      border-right: 1px solid $uni-border-color;
+    }
+    image {
+      width: 50rpx;
+      height: 50rpx;
+      margin-left: 40rpx;
+    }
+  }
+}
+</style>

pages/policy/policy_deatil_card.vue

@@ -0,0 +1,72 @@
+<template>
+  <div class="content" :class="{ 'margin-bottom-80': isMar }">
+    <div class="card-title">{{ model.title }}</div>
+    <div class="item-list">
+      <div v-for="(item, idx) in model.item" :key="idx" class="term">
+        <div class="term-name">{{ item.name }}:</div>
+        <div class="term-value-group">
+          <p
+            v-for="(value, idx) in item.value"
+            :key="idx"
+            class="term-value-item"
+          >
+            {{ value }}
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: ["model", "isMar"],
+};
+</script>
+
+<style lang="scss" scoped>
+.content {
+  box-sizing: border-box;
+  margin-top: 20rpx;
+  padding: 20rpx;
+  box-shadow: 0px 4rpx 32rpx rgba(0, 0, 0, 0.1);
+  border-radius: 32rpx;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  // margin-bottom: 80rpx;
+  .card-title {
+    padding: 20rpx 20rpx 0rpx 20rpx;
+    font-weight: 600;
+  }
+  .item-list {
+    margin-left: 20rpx;
+    display: flex;
+    flex-direction: column;
+
+    .term {
+      display: flex;
+      padding: 20rpx;
+      .term-name {
+        font-size: 27rpx;
+        width: 30%;
+        display: flex;
+        margin: 20rpx;
+        color: #7f7f7f;
+      }
+      .term-value-group {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        font-size: 27rpx;
+        .term-value-item {
+          margin: 20rpx;
+        }
+      }
+    }
+  }
+}
+.margin-bottom-80 {
+  margin-bottom: 80rpx;
+}
+</style>