完成发布供需页面 完成我的供需页面 调整页面样式

App.vue

@@ -5,7 +5,15 @@ export default {
     shareUrl: "https://kiq.xazhima.com/",
     globalTimestamp: Date.now().toString(),
     secret: "AirQK_weichat_app_zhima",
-    selectedIndex:0
+    selectedIndex:0,
+	user_id: '',
+	open_id:'',
+	user_status:'',
+	user_name:'',
+	user_phone:'',
+	user_headUrl:'',
+	isAuth:false,
+	session_key: '',
   },
   onLaunch: function () {
     console.log("App Launch");

components/footer-share/footer-share.vue

@@ -56,7 +56,7 @@ export default {
   height: 50rpx;
   position: fixed;
   bottom: 0;
-  width: 100%;
+  width: 98%;
   border-radius: 10rpx;
   box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.1);
   padding: 20rpx;

components/uni-popup/config.json

@@ -0,0 +1,9 @@
+{
+	"id":"329",
+	"name":"PopUp",
+	"desc":"弹出层",
+	"url":"popup",
+	"edition":"1.1.2",
+	"path":"https://ext.dcloud.net.cn/plugin?id=329",
+	"update_log":"- 新增 显示弹窗属性\n- 修复 h5 取消导航栏，顶部空白问题"
+}

components/uni-popup/readme.md

@@ -0,0 +1,83 @@
+## Popup 弹出层
+
+弹出层组件，为了解决遮罩弹层的问题。组件名：``uni-popup``，代码块： uPopup。
+
+
+**使用方式：**
+
+在 ``script`` 中引用组件 
+
+```javascript
+import uniPopup from "@/components/uni-popup/uni-popup.vue"
+export default {
+    components: {uniPopup}
+}
+```
+
+**基本用法**
+
+```html
+<uni-popup ref="popup" type="bottom">底部弹出 Popup</uni-popup>
+```
+
+**属性说明：**
+
+|  属性名	|    类型	| 默认值| 说明															|
+| ---		| ---		| ---	| ---															|
+| animation	| Boolean	|true	| 是否开启动画													|
+| type		| String	|center	| 弹出方式，可选值：top（顶部），center（居中），bottom（底部）	|
+| show		| Boolean	|false	| 显示弹窗	|
+| custom	| Boolean	|false	| 是否自定义内容												|
+| maskClick	| Boolean	|true	| 蒙版点击是否关闭弹窗											|
+
+
+**方法说明：**
+通过 `ref` 获取组件方法
+
+|事件称名	|说明		|
+|---		|----		|
+|open		|打开弹出层	|
+|close		|关闭弹出层	|
+
+```html
+<view>
+	<button @click="openPopup">打开弹出层</button>
+	<uni-popup ref="popup" type="center">
+		弹出层示例
+		<button @click="closePopup">关闭弹出层</button>
+	</uni-popup>
+</view>
+```
+
+```javascript
+export default {
+	methods:{
+		openPopup(){
+			this.$refs.popup.open()
+		},
+		closePopup(){
+			this.$refs.popup.close()
+		}
+	}
+}
+```
+
+Tips 
+- show 的作用与 open() 效果一致 ，在使用中显示弹窗二者只能选择其一。如果使用 show 显示弹窗，那么关闭弹窗时，应将 show 置为 false
+
+### 更新日志
+
+**1.1.2**
+- 新增 显示弹窗属性
+- 修复 h5 取消导航栏，顶部空白问题
+
+**1.1.1**
+- 修复 图片不显示的问题
+
+**1.1.0**
+- 新增 动画效果
+- 修复 示例底部弹出样式错乱的 bug
+- 优化 代码重构 可完全自定义内容
+
+**1.0.0**
+- 初始化项目

components/uni-popup/uni-popup.vue

@@ -0,0 +1,206 @@
+<template>
+  <view
+    v-if="showPopup"
+    class="uni-popup">
+    <view
+      :class="[ani, animation ? 'ani' : '', !custom ? 'uni-custom' : '']"
+      class="uni-popup__mask"
+      @click="close(true)" />
+    <view
+      :class="[type, ani, animation ? 'ani' : '', !custom ? 'uni-custom' : '']"
+      class="uni-popup__wrapper"
+      @click="close(true)">
+      <view
+        class="uni-popup__wrapper-box"
+        @click.stop="clear">
+        <slot />
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'UniPopup',
+  props: {
+    // 开启动画
+    animation: {
+      type: Boolean,
+      default: true
+    },
+    // 弹出层类型，可选值，top: 顶部弹出层；bottom：底部弹出层；center：全屏弹出层
+    type: {
+      type: String,
+      default: 'center'
+    },
+    // 是否开启自定义
+    custom: {
+      type: Boolean,
+      default: false
+    },
+    // maskClick
+    maskClick: {
+      type: Boolean,
+      default: false
+    },
+    show: {
+      type: Boolean,
+      default: true
+    }
+  },
+  data () {
+    return {
+      ani: '',
+      showPopup: false
+    }
+  },
+  watch: {
+    show (newValue) {
+      if (newValue) {
+        this.open()
+      } else {
+        this.close()
+      }
+    }
+  },
+  created () {},
+  methods: {
+    clear() {},
+    open() {
+      this.$emit('change', {
+        show: true
+      })
+      this.showPopup = true
+      this.$nextTick(() => {
+        setTimeout(() => {
+          this.ani = 'uni-' + this.type
+        }, 30)
+      })
+    },
+    close(type) {
+      if (!this.maskClick && type) return
+      this.$emit('change', {
+        show: false
+      })
+      this.ani = ''
+      this.$nextTick(() => {
+        setTimeout(() => {
+          this.showPopup = false
+        }, 300)
+      })
+    }
+  }
+}
+</script>
+<style lang="scss">
+.uni-popup {
+  position: fixed;
+  /*  #ifdef  H5  */
+  top: 0px;
+  // top: 50px;
+  /*  #endif  */
+  /*  #ifndef  H5  */
+  top: 0px;
+  /*  #endif  */
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 99999;
+  overflow: hidden;
+  &__mask {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    z-index: 998;
+    background: rgba(0, 0, 0, 0.4);
+    opacity: 0;
+
+    &.ani {
+      transition: all 0.3s;
+    }
+
+    &.uni-top,
+    &.uni-bottom,
+    &.uni-center {
+      opacity: 1;
+    }
+  }
+
+  &__wrapper {
+    position: absolute;
+    z-index: 999;
+    box-sizing: border-box;
+
+    &.ani {
+      transition: all 0.3s;
+    }
+
+    &.top {
+      top: 0;
+      left: 0;
+      width: 100%;
+      transform: translateY(-100%);
+    }
+
+    &.bottom {
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      transform: translateY(100%);
+    }
+
+    &.center {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      transform: scale(1.2);
+      opacity: 0;
+    }
+
+    &-box {
+      position: relative;
+      box-sizing: border-box;
+    }
+
+    &.uni-custom {
+      & .uni-popup__wrapper-box {
+       // padding: 30upx;
+        background: #fff;
+      }
+
+      &.center {
+        & .uni-popup__wrapper-box {
+          position: relative;
+          // max-width: 80%;
+          // max-height: 80%;
+          overflow-y: scroll;
+		  border-radius: 10rpx;
+        }
+      }
+
+      &.top,
+      &.bottom {
+        & .uni-popup__wrapper-box {
+          width: 100%;
+          // max-height: 500px;
+          overflow-y: scroll;
+        }
+      }
+    }
+
+    &.uni-top,
+    &.uni-bottom {
+      transform: translateY(0);
+    }
+
+    &.uni-center {
+      transform: scale(1);
+      opacity: 1;
+    }
+  }
+}
+</style>

pages.json

@@ -18,7 +18,8 @@
 		{
 			"path": "pages/selfCenter/index",
 			"style": {
-				"navigationBarTitleText": "我的"
+				"navigationBarTitleText": "我的",
+				 "navigationStyle":"custom"  
 			}
 		},
 		{
@@ -128,6 +129,12 @@
 			"style": {
 				"navigationBarTitleText": "找服务"
 			}
+		},
+		{
+			"path": "pages/auth/index",
+			"style": {
+				"navigationBarTitleText": "授权"
+			}
 		}
 	],
 	"globalStyle": {

pages/appeal/appealCard.vue

@@ -4,12 +4,12 @@
       {{ otherAppeal.title }}
     </div>
     <img
-      src="/static/appeal/waited.png"
+      src="/static/appeal/waited.svg"
       class="state"
       v-if="otherAppeal.state === 1"
     />
     <img
-      src="/static/appeal/waiting.png"
+      src="/static/appeal/waiting.svg"
       class="state"
       v-if="otherAppeal.state === 0"
     />

pages/auth/index.vue

@@ -0,0 +1,256 @@
+<template>
+	<view class="auth">
+		
+		<image src="/static/logo.png" mode="aspectFill"></image>
+		
+		<text class="margin-top-3 auth-title">欢迎使用空i企小程序</text>
+		
+		<text class="margin-top-3 auth-content">此页面是微信授权页面,授权之后你可以获取更优质的服务,您的隐私将会受到保护</text>
+		
+		<view class="margin-top-3">
+			<button type='default' class="refuse" @click="refuseBtn">暂不授权</button>
+			<button type='primary' class="allow" @click="getUserInfo()" v-if="!isAuth">登录授权</button>
+			<button type="primary" class="allow"  open-type="getPhoneNumber"  style="font-size: 12px;"
+			@getphonenumber="getPhoneNumber" v-if="isAuth && !isNeedPhone">手机号码授权</button> 
+		</view>
+		
+	</view>
+</template>
+
+<script>
+	import md5 from '@/common/md5.js';
+	export default {
+		data(){
+			return {
+				iv:'',
+				encryptedData:'',
+				isNeedPhone:getApp().globalData.user_phone,
+			    isAuth:getApp().globalData.isAuth
+			}
+		},
+		onLoad() {
+			this.loginLoad()
+		},
+		methods:{
+			loginLoad(){
+				let that = this;
+				uni.login({
+					success(res) {
+						that.loginRequest(res.code)
+					}
+				})
+			},
+			loginRequest(codeRes){
+				let md5Sign = md5("method="+'user'+"&timestamp="+getApp().globalData.globalTimestamp+"&secret="+getApp().globalData.secret)
+				let url = getApp().globalData.shareUrl+'api/api.php'+'?method=user&source=user&action=login&timestamp='+getApp().globalData.globalTimestamp +'&sign='+md5Sign
+				uni.request({
+					url:url,
+					method: 'POST',
+					header: {
+						'content-type': 'application/x-www-form-urlencoded'
+					},
+					data: {
+						code:codeRes
+					},
+					success: (res) => {
+						console.log(res)
+						if(res.data.code === 200){
+						}
+					},
+					fail: () => {
+						console.log("连接失败");
+					}
+				});
+			},
+			getUserInfo() {
+				uni.getUserProfile({
+					desc:'登录',
+					success:(res)=> {
+						getApp().globalData.user_headUrl = res.userInfo.avatarUrl;
+						getApp().globalData.user_name = res.userInfo.nickName;
+						this.iv = res.iv;
+						this.encryptedData = res.encryptedData;
+						this.isAuth = true;
+						getApp().globalData.isAuth = true;
+						//this.loginUserInfo()
+					},
+					fail:(err)=> {
+						getApp().globalData.isAuth = false;
+					}
+				})
+				// if (e.detail.errMsg == "getUserInfo:ok") {
+				// 	getApp().globalData.user_headUrl = e.detail.userInfo.avatarUrl;
+				// 	getApp().globalData.user_name = e.detail.userInfo.nickName;
+				// 	this.iv = e.detail.iv;
+				// 	this.encryptedData = e.detail.encryptedData;
+				// 	console.log(e.detail)
+				// 	//this.loginUserInfo()
+				// } else {
+				// 	console.log("用户信息授权失败");
+				// 	getApp().globalData.isAuth = false;
+				// }
+			},
+			getPhoneNumber(e){
+				let that = this;
+				 if (e.detail.errMsg == 'getPhoneNumber:ok') { //允许授权执行跳转
+				  that.phoneRequest(e.detail.iv, e.detail.encryptedData, getApp().globalData.session_key)
+				} else { //
+				      that.isNeedPhone = false;
+				}
+			},
+			phoneRequest(myIv,myEncryptedData,sKey){
+				let that = this;
+				let md5Sign = md5("method="+'user'+"&timestamp="+getApp().globalData.globalTimestamp+"&secret="+getApp().globalData.secret)
+				let url = getApp().globalData.shareUrl+'api/api.php'+'?method=user&source=user&action=phone&timestamp='+getApp().globalData.globalTimestamp +'&sign='+md5Sign
+				uni.request({
+					url:url,
+					method: 'POST',
+					header: {
+						'content-type': 'application/x-www-form-urlencoded'
+					},
+					data: {
+						iv:myIv,
+						sessionKey:sKey ||'MlkY744GF9fmIqXzS4YEkw==',
+						encryptedData:myEncryptedData,
+					},
+					success: (res) => {
+						console.log(res)
+						if(res.data.code === 200){
+							getApp().globalData.user_phone = res.data.phoneNumber;
+							that.refuseBtn();
+						}
+					},
+					fail: () => {
+						console.log("连接失败");
+					}
+				});
+			},
+			refuseBtn(){
+				uni.navigateBack({
+				});
+			},
+			loginUserInfo(){
+				let that = this;
+				uni.request({
+					url:getApp().globalData.shareUrl, //需要设置为全局
+					method: 'POST',
+					header: {
+						'content-type': 'application/x-www-form-urlencoded'
+					},
+					data: {
+						method: 'auth',
+						timestamp: getApp().globalData.globalTimestamp, //Date.now()
+						id:getApp().globalData.user_id,
+						sign: md5('auth' + getApp().globalData.globalTimestamp),
+						nickname:getApp().globalData.user_name,
+						headimg:getApp().globalData.user_headUrl,
+						auth_status:1,
+					},
+					success: res => {
+						if(res.data.code === 200){
+							getApp().globalData.user_id = res.data.msg.id;
+							getApp().globalData.open_id = res.data.msg.openid;
+							getApp().globalData.isAuth = true;
+							getApp().globalData.user_headUrl = res.data.msg.headimg;
+							getApp().globalData.user_name = res.data.msg.name;
+							getApp().globalData.user_status = res.data.msg.status;
+							getApp().globalData.user_phone = res.data.msg.phone;
+							that.isNeedPhone = res.data.msg.phone;
+							that.isAuth = getApp().globalData.isAuth;
+						}
+						else {
+							uni.showToast({
+								title: res.data.msg,
+								icon: 'none',
+								duration:2000
+							});
+						}
+						
+						// uni.navigateBack({
+						// });
+					} 
+				});
+			},
+		}
+	}
+</script>
+
+<style>
+   .auth{
+	   margin-top: 0;
+	   text-align: center;
+	   display: flex;
+	   flex-direction: column;
+	   justify-content: center;
+	   align-items: center;
+	   padding: 100upx;
+	   vertical-align: middle;
+   }
+   .auth image{
+	   width: 200upx;
+	   height: 200upx;
+   }
+   .auth view {
+	   display: flex;
+	   width: 490upx;
+	   justify-content: space-between;
+   }
+   .auth-title {
+	   font-size: 32upx;
+   }
+   .auth-content {
+   	   font-size: 26upx;
+	   color: #a7aaa9;
+   }
+   .allow {
+	   background-color: #27BCEF;
+	   margin: 20rpx 0 200rpx;
+	   text-align: center;
+	   vertical-align: middle;
+	   touch-action: manipulation;
+	   cursor: pointer;
+	   background-image: none;
+	   white-space: nowrap;
+	   user-select: none;
+	   font-size: 14px;
+	   border: 0 !important;
+	   position: relative;
+	   text-decoration: none;
+	   height: 44px;
+	   width: 250rpx;
+	   line-height: 44px;
+	   box-shadow: inset 0 0 0 1px #27BCEF;
+	   background: #fff !important;
+	   color: #27BCEF !important;
+	   display: inline-block;
+	   border-radius: 10rpx;
+
+   }
+   .refuse {
+	   background-color: #19be6b;
+	   margin: 20rpx 20rpx 200rpx 20rpx;
+	   text-align: center;
+	   vertical-align: middle;
+	   touch-action: manipulation;
+	   cursor: pointer;
+	   background-image: none;
+	   white-space: nowrap;
+	   user-select: none;
+	   font-size: 14px;
+	   border: 0 !important;
+	   position: relative;
+	   text-decoration: none;
+	   height: 44px;
+	   width: 250rpx;
+	   line-height: 44px;
+	   box-shadow: inset 0 0 0 1px #8a8a8a;
+	   background: #fff !important;
+	   color: #8a8a8a !important;
+	   display: inline-block;
+	   border-radius: 10rpx;
+
+   }
+   .margin-top-3{
+	   margin-top: 10%;
+   }
+</style>

pages/index/index.vue

@@ -11,6 +11,7 @@
 		 			<image :src="item.pic_path" mode="aspectFill" style="width: 100%;height: 100%;"></image>
 		 		</swiper-item>
 		 	</swiper>
+			<image src="../../static/Intersect.svg" class="groove-img"></image>
 			<view class="rowDot">
 				 <view v-for="(item,index) in swiperList" :key="index" class="dots">
 					 <view :class="['dot',index === swiperCurrent ? 'active' : '']"></view>
@@ -265,6 +266,7 @@
 		onLoad() {
            this.getSwiperList();
 		   this.getPark();
+		//   this.loginLoad();
 		},
 		methods: {
 			swiperChange(e){
@@ -360,11 +362,17 @@
 		font-size: 36rpx;
 		color: #8f8f94;
 	}
+	.groove-img {
+		width: 100%;
+		height: 100rpx;
+		bottom: -22rpx;
+		position: absolute;
+	}
 	.rowDot {
 		display: flex;
 		position: absolute;
-		top: 135px;
-		left: 40px;
+		top: 270rpx;
+		left: 80rpx;
 	}
 	.dots {
 		flex-direction: row;
@@ -384,7 +392,7 @@
 		background: #ff4e54;
 	}
 	.swiper-content {
-		border-radius: 0 0 10% 10%; 
+		/* border-radius: 0 0 10% 10%; */
 	}
 	.page-nav-box {
 		width: 80%;

pages/park/index.vue

@@ -3,6 +3,10 @@
 		
 		<view class="display-flex-start map-header-box">
 			<uni-easyinput prefixIcon="search" v-model="headerVal" placeholder="请输入园区名称搜索" @iconClick="headerSerach()" class="map-search-box"></uni-easyinput>
+			<!-- <view class="input-box">
+			  <image src="/static/policy/u377.png" alt="search" @click="headerSerach()"/>
+			  <input type="text" placeholder="请输入园区名称搜索" v-model="headerVal"/>
+			</view> -->
 			<navigator url="/pages/park/map_search"><button type="default" class="map-search-btn">地图查找</button></navigator>
 		</view>
 		
@@ -127,8 +131,7 @@
 				let typeList = this.filterList.filter((item)=>{return item.isSelected})
 				typeList.forEach((item)=>{typeStr.push(item.typeId)})
 				typeStr = typeStr.join(',')
-				console.log(typeStr)
-				//this.getPark(typeStr)
+				this.getPark(this.headerVal,typeStr)
 				this.filterBoxFlag = false;
 			},
 			showFilterBox(){
@@ -145,7 +148,7 @@
 				let postData = {
 					order_by:"weight desc",
 				}
-				if(searchVal){
+				if(searchVal && !typeList){
 					postData = {
 						order_by:"weight desc",
 						ss_name:searchVal
@@ -154,7 +157,7 @@
 				if(typeList){
 					postData = {
 						order_by:"weight desc",
-						ss_name:searchVal || '',
+						ss_name:searchVal,
 						park_type:typeList
 					}
 				}
@@ -212,7 +215,7 @@
 	}
 	.map-header-box {
 		background-color: #02A7F0;
-		padding: 20rpx 0rpx 30rpx 0rpx;
+		padding: 20rpx 0rpx 20rpx 0rpx;
 		width: 100%;
 	}
 	.map-search-box {
@@ -222,6 +225,29 @@
 		border-radius: 10rpx;
 		width: 70%;
 	}
+/* 	.input-box {
+	  width: 75%;
+	  display: flex;
+	  justify-content: center;
+	  align-items: center;
+	  position: relative;
+	}
+	.input-box image {
+	    position: absolute;
+		left: 60rpx;
+		width: 30rpx; 
+		height: 30rpx;
+	  }
+	 .input-box input {
+	    background-color: #ffffff;
+	    width: 90%;
+	    height: 70rpx;
+	    border-radius: 10rpx;
+	    padding: 3rpx;
+	    font-size: 24rpx;
+	    padding-left: 80rpx;
+	    box-sizing: border-box;
+	} */
 	.map-search-btn {
 		height: 66rpx;
 		font-size: 26rpx;

pages/park/park_deatil.vue

@@ -69,43 +69,43 @@
 			<view class="display-around-column content-font">
 				<view class="display-flex-start items-center margin-bottom-20">
 					<view class="width-30 margin-left-60 color-cf">运营机构</view>
-					<view>{{detailObj.manager || '-'}}</view>
+					<view class="width-70">{{detailObj.manager || '-'}}</view>
 				</view>
 				<view class="display-flex-start items-center margin-bottom-20">
 					<view class="width-30 margin-left-60 color-cf">产业定位</view>
-					<view>{{detailObj.target || '-'}}</view>
+					<view class="width-70">{{detailObj.target || '-'}}</view>
 				</view>
 				<view class="display-flex-start items-center margin-bottom-20">
 					<view class="width-30 margin-left-60 color-cf">园区类型</view>
-					<view>{{detailObj.building_types || '-'}}</view>
+					<view class="width-70">{{detailObj.building_types || '-'}}</view>
 				</view>
 				<view class="display-flex-start items-center margin-bottom-20">
 					<view class="width-30 margin-left-60 color-cf">物业费</view>
-					<view>{{detailObj.service_price || '-'}}<text style="font-size: 16rpx;">元/㎡/月</text></view>
+					<view class="width-70">{{detailObj.service_price || '-'}}<text style="font-size: 16rpx;">元/㎡/月</text></view>
 				</view>
 				<view class="display-flex-start items-center margin-bottom-20">
 					<view class="width-30 margin-left-60 color-cf">电费</view>
-					<view>{{detailObj.power_price || '-'}}<text style="font-size: 16rpx;">KW·h</text></view>
+					<view class="width-70">{{detailObj.power_price || '-'}}<text style="font-size: 16rpx;">KW·h</text></view>
 				</view>
 				<view class="display-flex-start items-center margin-bottom-20">
 					<view class="width-30 margin-left-60 color-cf">水费</view>
-					<view>{{detailObj.water_price || '-'}}<text style="font-size: 16rpx;">m³</text></view>
+					<view class="width-70">{{detailObj.water_price || '-'}}<text style="font-size: 16rpx;">m³</text></view>
 				</view>
 				<view class="display-flex-start items-center margin-bottom-20">
 					<view class="width-30 margin-left-60 color-cf">一层楼高</view>
-					<view>{{detailObj.max_height || '-'}}<text style="font-size: 16rpx;">m</text></view>
+					<view  class="width-70">{{detailObj.max_height || '-'}}<text style="font-size: 16rpx;">m</text></view>
 				</view>
 				<view  class="display-flex-start items-center margin-bottom-20">
 					<view class="width-30 margin-left-60 color-cf">最大承重</view>
-					<view>{{detailObj.max_weight || '-'}}<text style="font-size: 16rpx;">kg</text></view>
+					<view  class="width-70">{{detailObj.max_weight || '-'}}<text style="font-size: 16rpx;">kg</text></view>
 				</view>
 				<view class="display-flex-start items-center margin-bottom-20">
 					<view class="width-30 margin-left-60 color-cf">联系电话</view>
-					<view @click="makeCall(detailObj.tel)" style="color: #007AFF;">{{detailObj.phone}}</view>
+					<view  class="width-70"  @click="makeCall(detailObj.tel)" style="color: #007AFF;">{{detailObj.phone}}</view>
 				</view>
 				<view class="display-flex-start items-center">
 					<view class="width-30 margin-left-60 color-cf">详细地址</view>
-					<view>{{detailObj.address || '-'}}</view>
+					<view class="width-70">{{detailObj.address || '-'}}</view>
 				</view>
 			</view>
 	    	
@@ -125,7 +125,6 @@
 			  </view>
 			</view>
 		</view>
-	   
 		<footer-share style="width: 100%;" :isCollection="false" @collectionPages="collectionPage" @sharePages="sharePage"></footer-share>
 	</view> 
 	</view>
@@ -134,6 +133,8 @@
 <script>
 	import md5 from '@/common/md5.js';
 	export default {
+		components: {
+		},
 		data() {
 			return {
 			    swiperList:[
@@ -335,6 +336,9 @@
 	.width-30 {
 		width: 30%;
 	}
+	.width-70 {
+		width: 70%;
+	}
 	.content-font {
 		font-size: 20rpx;
 	}

pages/selfCenter/index.vue

@@ -2,15 +2,15 @@
   <view class="content">
     <foot-tabs></foot-tabs>
     <div class="self-inf">
-      <div class="img-name-box">
-        <img src="/static/logo.png" alt="" class="heade-img" />
-        <p src="" alt="" class="nickname">微信昵称2233</p>
+	   <view class="img-name-box" v-if="!isAuth">
+		   <button  @click="goAuthPage()" class="auth-btn">点击去授权</button>
+	   </view>
+      <div class="img-name-box" v-if="isAuth">
+        <image :src="userHeadImg" alt="" class="heade-img" mode="aspectFill"></image>
+        <p  class="nickname">{{userNickName}}</p>
       </div>
-      <img
-        class="bg-img"
-        src="https://kiq.xazhima.com//upload/main_page/202109/202109231407288075.jpeg"
-        alt=""
-      />
+      <image class="bg-img" :src="swiperBackground" mode="aspectFill"></image>
+	  <image src="../../static/Intersect.svg" class="groove-img"></image>
     </div>
     <div class="options">
       <div v-for="(item, idx) in list" :key="idx" class="options-item">
@@ -29,20 +29,63 @@
 </template>
 
 <script>
+import md5 from '@/common/md5.js';
 export default {
   data() {
     return {
       message: "我的",
+	  isAuth:getApp().globalData.isAuth,
+	  userHeadImg:getApp().globalData.user_headUrl,
+	  userNickName:getApp().globalData.user_name,
       list: [
-        { icoin: "/static/logo.png", name: "我的建议" },
-        { icoin: "/static/logo.png", name: "我的报名" },
-        { icoin: "/static/logo.png", name: "我的收藏" },
-        { icoin: "/static/logo.png", name: "退出登录" },
+        { icoin: "/static/selfCenter/suggest.png", name: "我的建议" },
+        { icoin: "/static/selfCenter/sign.png", name: "我的报名" },
+        { icoin: "/static/selfCenter/collection.png", name: "我的收藏" },
+        { icoin: "/static/selfCenter/back.png", name: "退出登录" },
       ],
+	  swiperBackground:'',
     };
   },
-  onLoad() {},
-  methods: {},
+  onLoad() {
+	  this.getSwiperList();
+  },
+  onShow() {
+  	 this.isAuth = getApp().globalData.isAuth;
+	 if(this.isAuth){
+		 this.userHeadImg = getApp().globalData.user_headUrl;
+		 this.userNickName = getApp().globalData.user_name;
+	 }
+  },
+  methods: {
+	  goAuthPage(){
+		  uni.navigateTo({
+		  	url:'../auth/index'
+		  })
+	  },
+	  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
+	  	uni.request({
+	  		url:url,
+	  		method: 'POST',
+	  		header: {
+	  			'content-type': 'application/x-www-form-urlencoded'
+	  		},
+	  		data: {
+	  			order_by:"weight desc",
+	  			s_status:1,
+	  		},
+	  		success: (res) => {
+	  			if(res.data.code === 200){
+	  				this.swiperBackground = getApp().globalData.shareUrl + res.data.data.list[0].pic_path
+	  			}
+	  		},
+	  		fail: () => {
+	  			console.log("连接失败");
+	  		}
+	  	});
+	  },
+  },
 };
 </script>
 
@@ -53,22 +96,29 @@ export default {
 
   .self-inf {
     position: relative;
-    height: 400rpx;
+    height: 440rpx;
     width: 100%;
     display: flex;
     margin-bottom: 80rpx;
     border-radius: 0rpx 0rpx 100% 100%;
     .img-name-box {
       height: 150rpx;
-      margin-top: 80rpx;
+      margin-top: 70rpx;
       display: flex;
       align-items: center;
+	  .auth-btn {
+		  margin-left: 80rpx;
+		  margin-top: 50rpx;
+		  font-size: 28rpx;
+		  background-color: #02A7F0;
+		  color: #fff;
+	  } 
       .heade-img {
         z-index: 1;
         width: 100rpx;
         height: 100rpx;
         border-radius: 50%;
-        margin-left: 100rpx;
+        margin-left: 80rpx;
       }
     }
 
@@ -77,22 +127,28 @@ export default {
       position: absolute;
       width: 100%;
       height: 100%;
-      border-radius: 0rpx 0rpx 70rpx 70rpx;
+      // border-radius: 0rpx 0rpx 70rpx 70rpx;
     }
+	.groove-img {
+		width: 100%;
+		height: 100rpx;
+		bottom: -22rpx;
+		position: absolute;
+	}
     .nickname {
       font-weight: 600;
-      font-size: 35rpx;
-      margin-left: 40rpx;
-			color: #ffffff;
-			letter-spacing: 1rpx;
+	  font-size: 28rpx;
+	  margin-left: 30rpx;
+	  margin-top: 20rpx;
+	  color: #ffffff;
+	  letter-spacing: 1rpx;
     }
   }
   .options {
     padding: 70rpx;
-
     z-index: 99;
     position: relative;
-    top: -230rpx;
+    top: -270rpx;
     .options-item {
       background-color: #fff;
       display: flex;
@@ -104,14 +160,15 @@ export default {
       .img-box {
         margin-left: 40rpx;
         .options-item-img {
-          width: 60rpx;
-          height: 60rpx;
+          width: 56rpx;
+          height: 56rpx;
         }
       }
       .options-item-name {
-        margin-left: 40rpx;
-        font-weight: 600;
-        font-size: 35rpx;
+			margin-left: 40rpx;
+			font-weight: 600;
+			font-size: 30rpx;
+			margin-bottom: 10rpx;
       }
     }
   }

static/Intersect.svg

@@ -0,0 +1,3 @@
+<svg width="375" height="31" viewBox="0 0 375 31" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0.459839L0 31H375V0.459841C315.799 19.0046 252.817 29 187.5 29C122.183 29 59.2013 19.0046 0 0.459839Z" fill="white"/>
+</svg>