pages/common/call/call.vue

@@ -1,69 +1,72 @@
 <template>
-  <view class="call-box" @click.stop="sayHi">
-    <view class="call-icon">
-      <image class="call-img" src="/static/img/circle/Group-100243@2x.png" mode="aspectFill"></image>
-    </view>
-    <view class="call-text sys-weight-600 sys-color-black">打招呼</view>
-  </view>
+	<view class="call-box" @click.stop="sayHi">
+		<view class="call-icon">
+			<image class="call-img" src="/static/img/circle/Group-100243@2x.png" mode="aspectFill"></image>
+		</view>
+		<view class="call-text sys-weight-600 sys-color-black">打招呼</view>
+	</view>
 </template>
 
 <script>
-import {sayHi} from "@/api/utility";
-import tools from "@/service/tools";
+	import {
+		sayHi
+	} from "@/api/utility";
+	import tools from "@/service/tools";
 
-export default {
-  name: "call",
-  components: {},
-  props: {
-    userId:{
-      default:''
-    }
-  },
-  data() {
-    return {
-      isAjax:false
-    }
-  },
-  watch: {},
-  mounted() {
+	export default {
+		name: "call",
+		components: {},
+		props: {
+			userId: {
+				default: ''
+			}
+		},
+		data() {
+			return {
+				isAjax: false
+			}
+		},
+		watch: {},
+		mounted() {
 
-  },
-  methods: {
-    sayHi(){
-      if(this.isAjax){
-        return false
-      }
-      this.isAjax=true
-      sayHi(this.userId).then((res)=>{
-        this.isAjax=false
-        if(res.code===0){
-          tools.success('打招呼成功')
-        }else {
-          tools.error(res.msg)
-        }
-      })
-    }
-  }
-}
+		},
+		methods: {
+			sayHi() {
+				if (this.isAjax) {
+					return false
+				}
+				this.isAjax = true
+				sayHi(this.userId).then((res) => {
+					this.isAjax = false
+					if (res.code === 0) {
+						tools.success('打招呼成功')
+					} else {
+						tools.error(res.msg)
+					}
+				})
+			}
+		}
+	}
 </script>
 
 <style scoped lang="scss">
-.call-box{
-  height: 40rpx;
-  border-radius: 200rpx;
-  border: 2rpx solid #141414;
-  padding: 4rpx 16rpx;
-  display: flex;
-  justify-content: space-between;
-  .call-img{
-    width: 40rpx;
-    height: 40rpx;
-    margin-right: 8rpx;
-  }
-  .call-text{
-    font-size: 28rpx;
-    line-height: 40rpx;
-  }
-}
+	.call-box {
+		height: 40rpx;
+		border-radius: 200rpx;
+		border: 2rpx solid #141414;
+		padding: 4rpx 16rpx;
+		display: flex;
+		justify-content: space-between;
 
-</style>
+		.call-img {
+			width: 40rpx;
+			height: 40rpx;
+			margin-right: 8rpx;
+		}
+
+		.call-text {
+			font-size: 28rpx;
+			line-height: 40rpx;
+		}
+	}
+</style>

pages/index/model/screen-item.vue

@@ -6,8 +6,10 @@
 				<view class="age-name sys-size-32 sys-color-white">
 					距离 {{fromData.distance}}
 				</view>
-				<slider :value="fromData.distance" @changing="sliderChange" min="0" max="500" activeColor="#727272"
-					backgroundColor="#727272" block-size="6" block-color="#FFC107" />
+				<view class="slider-box">
+					<slider :value="fromData.distance" @changing="sliderChange" min="0" max="500" activeColor="#727272"
+						backgroundColor="#727272" block-size="6" block-color="#FFC107" />
+				</view>
 				<view class="num-section sys-size-28 sys-color-5B ">
 					<view class="">
 						okm
@@ -19,8 +21,10 @@
 				<view class="age-name sys-size-32 sys-color-white">
 					年龄 {{`${fromData.age[0]} - ${fromData.age[1]}`}}
 				</view>
-				<cjSliderTwo v-model="fromData.age" :min="18" :max="35" :step="1" :blockWidth="18" @moving="blockMoving"
-					activeColor="#727272" inactiveColor="#727272" blockColor="#FFC107" />
+				<view class="slider-box">
+					<cjSliderTwo v-model="fromData.age" :min="18" :max="35" :step="1" :blockWidth="18" @moving="blockMoving"
+						activeColor="#727272" inactiveColor="#727272" blockColor="#FFC107" />
+				</view>
 				<view class="num-section sys-size-28 sys-color-5B">
 					<view class="">
 						18
@@ -42,33 +46,33 @@
 					</view>
 					<view class="view-user-right">
 						<view class="view-user-right-name sys-color-5B sys-size-28">
-              {{purposeName?purposeName:'未设置'}}
+							{{purposeName?purposeName:'未设置'}}
 						</view>
 						<uni-icons type="forward" size="20" color="#5B5B5B"></uni-icons>
 					</view>
 				</view>
-				<view class="view-user"  @click="setPicker(2)">
+				<view class="view-user" @click="setPicker(2)">
 					<view class="view-user-left sys-color-white sys-size-32">
 						速配星座
 					</view>
 					<view class="view-user-right">
 						<view class="view-user-right-name sys-color-5B sys-size-28">
-              {{constellationName?constellationName:'未设置'}}
+							{{constellationName?constellationName:'未设置'}}
+						</view>
+						<uni-icons type="forward" size="20" color="#5B5B5B"></uni-icons>
+					</view>
+				</view>
+				<view class="view-user" @click="setPicker(3)">
+					<view class="view-user-left sys-color-white sys-size-32">
+						兴趣爱好
+					</view>
+					<view class="view-user-right">
+						<view class="view-user-right-name sys-color-5B sys-size-28">
+							{{hobbyName?hobbyName:'未设置'}}
 						</view>
 						<uni-icons type="forward" size="20" color="#5B5B5B"></uni-icons>
 					</view>
 				</view>
-        <view class="view-user"  @click="setPicker(3)">
-          <view class="view-user-left sys-color-white sys-size-32">
-            兴趣爱好
-          </view>
-          <view class="view-user-right">
-            <view class="view-user-right-name sys-color-5B sys-size-28">
-              {{hobbyName?hobbyName:'未设置'}}
-            </view>
-            <uni-icons type="forward" size="20" color="#5B5B5B"></uni-icons>
-          </view>
-        </view>
 				<view class="placeholder-box" v-if="false"></view>
 				<view class="aim-box" v-if="false">
 					<view class="aim-title">
@@ -90,22 +94,25 @@
 						</view>
 					</view>
 				</view>
-        <view class="sys-selected-but sys-background-FFC107 sys-color-black" @click="setFilter">保存</view>
+				<view class="sys-selected-but sys-background-FFC107 sys-color-black" @click="setFilter">保存</view>
 			</view>
 		</scroll-view>
-    <uni-data-picker :popup-title="'选择'+label" :localdata="localData" ref="pickerObj" v-show="showPicker"
-                     @change="pickerChange" :border="false" :clear-icon="false" @popupclosed="setPopupClosed">
-    </uni-data-picker>
+		<uni-data-picker :popup-title="'选择'+label" :localdata="localData" ref="pickerObj" v-show="showPicker"
+			@change="pickerChange" :border="false" :clear-icon="false" @popupclosed="setPopupClosed">
+		</uni-data-picker>
 	</view>
 </template>
 
 <script>
 	import cjSliderTwo from '@/components/jxs-slider/jxs-slider.vue'
-  import {
-    getFilter, setFilter
-  } from "@/api/discovery";
-  import {getScreenDict} from "@/api/utility";
-  import tools from "@/service/tools";
+	import {
+		getFilter,
+		setFilter
+	} from "@/api/discovery";
+	import {
+		getScreenDict
+	} from "@/api/utility";
+	import tools from "@/service/tools";
 	export default {
 		components: {
 			cjSliderTwo
@@ -113,18 +120,18 @@
 		data() {
 			return {
 
-        fromData:{
-          distance: 50,
-          id: '',
-          userId: '',
-          ageMax: '',
-          ageMin: '',
-          gender: '',
-          prefer: '',
-          constellation: '',
-          interest: '',
-          age: [18, 30],
-        },
+				fromData: {
+					distance: 50,
+					id: '',
+					userId: '',
+					ageMax: '',
+					ageMin: '',
+					gender: '',
+					prefer: '',
+					constellation: '',
+					interest: '',
+					age: [18, 30],
+				},
 				sex: [{
 					'name': '男生',
 					'id': 0
@@ -136,16 +143,16 @@
 					'id': 2
 				}],
 				sexId: 0,
-        label: 0,
-        localData: [],
-        showPicker: false,
-        pickerType: 1,
-        purposeArr: [],
-        purposeName:'',
-        constellationArr: [],
-        constellationName:'',
-        hobbyArr: [],
-        hobbyName:'',
+				label: 0,
+				localData: [],
+				showPicker: false,
+				pickerType: 1,
+				purposeArr: [],
+				purposeName: '',
+				constellationArr: [],
+				constellationName: '',
+				hobbyArr: [],
+				hobbyName: '',
 			};
 		},
 		mounted() {
@@ -153,95 +160,104 @@
 			this.getScreenDict()
 		},
 		methods: {
-      setPopupClosed(){
-        this.$refs.pickerObj.clear();
-        this.showPicker = false;
-      },
-      setFilter(){
-        this.fromData.ageMin=this.fromData.age[0]+''
-        this.fromData.ageMax=this.fromData.age[1]+''
-        setFilter(this.fromData).then((res)=>{
-          if(res.code===0){
-            tools.success('保存成功')
-            setTimeout(()=>{
-              tools.leftClick()
-            },1000)
-          }else {
-            tools.error(res.msg)
-          }
-        })
-      },
-      setPicker(pickerType){
-        this.pickerType=pickerType
-        if(pickerType===1){
-          this.label='用户类型'
-          this.localData =this.purposeArr
-        }else if(pickerType===2){
-          this.label='速配星座'
-          this.localData =this.constellationArr
-        }else {
-          this.label='兴趣爱好'
-          this.localData =this.hobbyArr
-        }
-        this.$refs.pickerObj.show();
-        this.showPicker = true;
-      },
-      pickerChange(data) {
-        if(data.detail.value.length>0){
-          if(this.pickerType===1){
-            this.purposeName =data.detail.value[0].text;
-            this.fromData.prefer =data.detail.value[0].value;
-          }else if(this.pickerType===2){
-            this.constellationName =data.detail.value[0].text;
-            this.fromData.constellation =data.detail.value[0].value;
-          }else {
-            this.hobbyName =data.detail.value[0].text;
-            this.fromData.interest =data.detail.value[0].value;
-          }
-        }
-        this.$refs.pickerObj.clear();
-        this.showPicker = false;
-      },
-      getScreenDict(){
-        getFilter('app_user_filter_hobby,app_user_filter_constellation,app_user_filter_purpose').then((res)=>{
-          console.log(res)
-          if(res.code===0){
-              if(res.data.app_user_filter_purpose){
-                res.data.app_user_filter_purpose.forEach((item)=>{
-                  this.purposeArr.push({'text':item.label,'value':item.value})
-                })
-              }
-            if(res.data.app_user_filter_constellation){
-              res.data.app_user_filter_constellation.forEach((item)=>{
-                this.constellationArr.push({'text':item.label,'value':item.value})
-              })
-            }
-            if(res.data.app_user_filter_hobby){
-              res.data.app_user_filter_hobby.forEach((item)=>{
-                this.hobbyArr.push({'text':item.label,'value':item.value})
-              })
-            }
-          }else {
-            tools.leftClick()
-          }
-        })
-      },
+			setPopupClosed() {
+				this.$refs.pickerObj.clear();
+				this.showPicker = false;
+			},
+			setFilter() {
+				this.fromData.ageMin = this.fromData.age[0] + ''
+				this.fromData.ageMax = this.fromData.age[1] + ''
+				setFilter(this.fromData).then((res) => {
+					if (res.code === 0) {
+						tools.success('保存成功')
+						setTimeout(() => {
+							tools.leftClick()
+						}, 1000)
+					} else {
+						tools.error(res.msg)
+					}
+				})
+			},
+			setPicker(pickerType) {
+				this.pickerType = pickerType
+				if (pickerType === 1) {
+					this.label = '用户类型'
+					this.localData = this.purposeArr
+				} else if (pickerType === 2) {
+					this.label = '速配星座'
+					this.localData = this.constellationArr
+				} else {
+					this.label = '兴趣爱好'
+					this.localData = this.hobbyArr
+				}
+				this.$refs.pickerObj.show();
+				this.showPicker = true;
+			},
+			pickerChange(data) {
+				if (data.detail.value.length > 0) {
+					if (this.pickerType === 1) {
+						this.purposeName = data.detail.value[0].text;
+						this.fromData.prefer = data.detail.value[0].value;
+					} else if (this.pickerType === 2) {
+						this.constellationName = data.detail.value[0].text;
+						this.fromData.constellation = data.detail.value[0].value;
+					} else {
+						this.hobbyName = data.detail.value[0].text;
+						this.fromData.interest = data.detail.value[0].value;
+					}
+				}
+				this.$refs.pickerObj.clear();
+				this.showPicker = false;
+			},
+			getScreenDict() {
+				getFilter('app_user_filter_hobby,app_user_filter_constellation,app_user_filter_purpose').then((res) => {
+					console.log(res)
+					if (res.code === 0) {
+						if (res.data.app_user_filter_purpose) {
+							res.data.app_user_filter_purpose.forEach((item) => {
+								this.purposeArr.push({
+									'text': item.label,
+									'value': item.value
+								})
+							})
+						}
+						if (res.data.app_user_filter_constellation) {
+							res.data.app_user_filter_constellation.forEach((item) => {
+								this.constellationArr.push({
+									'text': item.label,
+									'value': item.value
+								})
+							})
+						}
+						if (res.data.app_user_filter_hobby) {
+							res.data.app_user_filter_hobby.forEach((item) => {
+								this.hobbyArr.push({
+									'text': item.label,
+									'value': item.value
+								})
+							})
+						}
+					} else {
+						tools.leftClick()
+					}
+				})
+			},
 			getFilter() {
 				getFilter().then((res) => {
-          if(res.code===0){
-            this.fromData.distance=res.data.distance
-            this.fromData.id=res.data.id
-            this.fromData.userId=res.data.userId
-            this.fromData.ageMax=res.data.ageMax
-            this.fromData.ageMin=res.data.ageMin
-            this.fromData.gender=res.data.gender
-            this.fromData.prefer=res.data.prefer
-            this.fromData.constellation=res.data.constellation
-            this.fromData.interest=res.data.interest
-            this.fromData.age=[res.data.ageMin*1,res.data.ageMax*1]
-          }else {
-            tools.leftClick()
-          }
+					if (res.code === 0) {
+						this.fromData.distance = res.data.distance
+						this.fromData.id = res.data.id
+						this.fromData.userId = res.data.userId
+						this.fromData.ageMax = res.data.ageMax
+						this.fromData.ageMin = res.data.ageMin
+						this.fromData.gender = res.data.gender
+						this.fromData.prefer = res.data.prefer
+						this.fromData.constellation = res.data.constellation
+						this.fromData.interest = res.data.interest
+						this.fromData.age = [res.data.ageMin * 1, res.data.ageMax * 1]
+					} else {
+						tools.leftClick()
+					}
 				})
 			},
 			scroll() {},
@@ -269,9 +285,11 @@
 	.screen-item {
 		width: 100%;
 		flex: 1;
-    .sys-selected-but{
-      margin-top: 100rpx;
-    }
+
+		.sys-selected-but {
+			margin-top: 100rpx;
+		}
+
 		.list-scroll {
 			width: 100%;
 			flex: 1;
@@ -287,6 +305,11 @@
 					margin: 0 0 20rpx 0;
 				}
 
+				.slider-box {
+					padding: 0 10rpx;
+					box-sizing: border-box;
+				}
+
 				.num-section {
 					padding: 8rpx 0 0 0;
 					width: 100%;
@@ -387,4 +410,4 @@
 			}
 		}
 	}
-</style>
+</style>

pages/msg/index.vue

@@ -1,22 +1,199 @@
 <template>
-  <view>
+	<view class="msg-box">
+		<view class="nav-box">
+			<view class="nav-left sys-background-F2F2F2 sys-radius-200">
+				<image class="nav-left-img" src="@/static/img/msg/yl.png" mode=""></image>
+				<view class="nav-left-name sys-size-28 sys-weight-600 sys-color-black-3">
+					有料
+				</view>
+			</view>
+			<view class="nav-text sys-size-36 sys-weight-600 sys-color-black-3">
+				消息
+			</view>
+			<image class="nav-right" src="@/static/img/msg/tx.png" mode=""></image>
+		</view>
+		<view class="msg-content">
+			<view class="xpy-title sys-size-32 sys-weight-600 sys-color-black">
+				新朋友
+			</view>
+			<view class="xpy-list">
+				<view class="xpy-list-left">
+					<scroll-view class="scroll-view-x" scroll-x="true">
+						<view class="xpy-list-left-item sys-radius-12" v-for="(item,index) in 4">
 
-  </view>
+						</view>
+					</scroll-view>
+				</view>
+				<view class="xpy-list-right sys-background-F2F2F2 sys-radius-12">
+					<image class="xpy-list-right-img" src="@/static/img/msg/qbpd.png" mode=""></image>
+					<view class="sys-size-28 sys-color-gray-9">
+						全部配对
+					</view>
+				</view>
+			</view>
+			<view class="xx-box">
+				<view class="sys-size-32 sys-weight-600 sys-color-black">
+					消息
+				</view>
+				<image class="xx-box-img" src="@/static/img/msg/sx.png" mode=""></image>
+			</view>
+			<view class="msg-list">
+				<image src="../../static/img/my/bg.png" class="msg-list-img sys-radius-round" mode=""></image>
+				<view class="msg-list-item">
+					<view class="msg-list-item-one">
+						<view class="sys-size-32 sys-weight-600 sys-color-black">
+							系统消息
+						</view>
+						<view class="sys-size-24 sys-color-gray-9">
+							11.50
+						</view>
+					</view>
+					<view class="msg-list-item-two sys-size-28 sys-color-gray-9">
+						刚刚左滑掉喜欢你的人，速去查看~
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
 </template>
 
 <script>
-export default {
-  data() {
-    return {
+	export default {
+		data() {
+			return {
 
-    }
-  },
-  methods: {
+			}
+		},
+		methods: {
 
-  }
-}
+		}
+	}
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+	.msg-box {
+		width: 100%;
+		height: auto;
 
-</style>
+		.nav-box {
+			padding: 16rpx 32rpx;
+			box-sizing: border-box;
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			position: relative;
+
+			.nav-left {
+				display: flex;
+				align-items: center;
+				padding: 6rpx 24rpx;
+
+				.nav-left-img {
+					width: 40rpx;
+					height: 40rpx;
+					margin: 0 8rpx 0 0;
+				}
+			}
+
+			.nav-text {
+				position: absolute;
+				left: calc((100% - 72rpx) / 2);
+				top: 22rpx;
+			}
+
+			.nav-right {
+				width: 52rpx;
+				height: 52rpx;
+			}
+		}
+
+		.msg-content {
+			padding: 40rpx 32rpx;
+			box-sizing: border-box;
+
+			.xpy-title {
+				margin: 0 0 18rpx 0;
+			}
+
+			.xpy-list {
+				display: flex;
+				align-items: center;
+				margin: 0 0 60rpx 0;
+
+				.xpy-list-left {
+					display: flex;
+					align-items: center;
+					max-width: calc(100% - 32rpx);
+					overflow: hidden;
+
+					.scroll-view-x {
+						white-space: nowrap;
+						width: 100%;
+
+						.xpy-list-left-item {
+							display: inline-block;
+							width: 160rpx;
+							height: 212rpx;
+							margin: 0 16rpx 0 0;
+							padding: 0 0 8rpx 8rpx;
+							background: rgba(0, 0, 0, .3);
+						}
+					}
+				}
+
+				.xpy-list-right {
+					width: 32rpx;
+					padding: 16rpx 30rpx;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					margin: 0 0 0 12rpx;
+					flex-shrink: 0;
+
+					.xpy-list-right-img {
+						width: 32rpx;
+						height: 32rpx;
+						margin: 0 0 14rpx 0;
+					}
+				}
+			}
+
+			.xx-box {
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				margin: 0 0 32rpx 0;
+
+				.xx-box-img {
+					width: 36rpx;
+					height: 26rpx;
+				}
+			}
+
+			.msg-list {
+				display: flex;
+				align-items: center;
+
+				.msg-list-img {
+					width: 112rpx;
+					height: 112rpx;
+					margin: 0 20rpx 0 0;
+					flex-shrink: 0;
+				}
+
+				.msg-list-item {
+					width: 100%;
+
+					.msg-list-item-one {
+						display: flex;
+						align-items: center;
+						justify-content: space-between;
+						margin: 0 0 4rpx 0;
+					}
+
+					.msg-list-item-two {}
+				}
+			}
+		}
+	}
+</style>

pages/my/model/my-praise.vue

@@ -1,7 +1,7 @@
 <template>
-  <view class="my-praise-box">
+	<view class="my-praise-box">
 		<view class="" v-show="false">
-				<view class="publish-box" v-show="publishBoxOff">
+			<view class="publish-box" v-show="publishBoxOff">
 				<image class="publish-img sys-radius-12" src="/static/img/circle/1.png" mode=""></image>
 				<view class="publish-text">
 					<view class="publish-title sys-color-black-0 sys-weight-400 sys-size-34">
@@ -21,398 +21,446 @@
 		</view>
 
 		<scroll-view class="recommended-box" scroll-x="true" v-show="false">
-		 <view class="recommended-list" v-for="(item,i) in listTwo" :key="i" @click="goRecommended">
-		 	<image class="recommended-list-img sys-radius-16" :src="item.img" mode=""></image>
-		 	<view class="recommended-list-name">
-		 		<image class="list-name-img" src="/static/dgex-tantan/like.png" mode=""></image>
-		 		<view class="sys-color-white sys-size-28">
-		 			{{item.text}}
-		 		</view>
-		 	</view>
-		 	<view class="recommended-list-text">
-		 		<view class="recommended-list-text-left">
-		 			<!-- <image v-for="imgs in item.icon" class="list-text-left-img sys-radius-8" :src="imgs" mode=""></image> -->
-					<image v-for="imgs in item.icon" class="list-text-left-img sys-radius-8" src="/static/img/temporary/1.png" mode=""></image>
-		 		</view>
-				<view class="recommended-list-text-right">
-					<view class="sys-size-24 sys-color-white">
-						{{item.num}}人在这里
+			<view class="recommended-list" v-for="(item,i) in listTwo" :key="i" @click="goRecommended">
+				<image class="recommended-list-img sys-radius-16" :src="item.img" mode=""></image>
+				<view class="recommended-list-name">
+					<image class="list-name-img" src="/static/dgex-tantan/like.png" mode=""></image>
+					<view class="sys-color-white sys-size-28">
+						{{item.text}}
 					</view>
-					<uni-icons type="forward" size="12" color="#fff"></uni-icons>
 				</view>
-		 	</view>
-		 </view>
+				<view class="recommended-list-text">
+					<view class="recommended-list-text-left">
+						<!-- <image v-for="imgs in item.icon" class="list-text-left-img sys-radius-8" :src="imgs" mode=""></image> -->
+						<image v-for="imgs in item.icon" class="list-text-left-img sys-radius-8" src="/static/img/temporary/1.png"
+							mode=""></image>
+					</view>
+					<view class="recommended-list-text-right">
+						<view class="sys-size-24 sys-color-white">
+							{{item.num}}人在这里
+						</view>
+						<uni-icons type="forward" size="12" color="#fff"></uni-icons>
+					</view>
+				</view>
+			</view>
 		</scroll-view>
 
-    <view class="praise-item" @click="goToDetails" v-for="(item,itemIndex) in list">
-      <view class="praise-left">
-        <image class="praise-head" :src="item.avatar" mode="aspectFill"></image>
-      </view>
-      <view class="praise-right">
-        <view class="praise-top-data">
-          <view class="praise-top-left">
-            <view class="praise-top-left-title">
-              <view class="left-title-text sys-height-44 sys-color-black sys-weight-600">{{item.nickname}}</view>
-              <view class="left-title-vip">
-                <image class="left-title-vip-img" src="/static/img/my/vip.png" mode="heightFix"></image>
-              </view>
-
-            </view>
-            <view class="left-title-time sys-color-gray-9">{{item.createdAt}}发布</view>
-          </view>
-          <view class="praise-top-right">
-           <call :user-id="item.userId"></call>
-          </view>
-        </view>
-
-        <view class="right-text sys-color-black sys-weight-400">
-          {{item.content}}
-        </view>
-        <view class="right-img">
-          <view class="one-img" v-if="item.galleryUrls.length===1">
-            <img-one :file-list="item.galleryUrls"></img-one>
-          </view>
-          <view class="two-img" v-else-if="item.galleryUrls.length===2 || item.galleryUrls.length===4">
-            <img-two :file-list="item.galleryUrls"></img-two>
-          </view>
-          <view class="three-img" v-else>
-            <img-three :type="2" :file-list="item.galleryUrls"></img-three>
-          </view>
-        </view>
-        <view class="right-tag-list"  v-if="false"	>
-          <dynamic-tag :list="item.tag" :tag-bg="tagBg" :tag-color="tagColor"></dynamic-tag>
-        </view>
-        <view class="right-operation-list">
-          <view class="operation-share">
-            <view class="operation-item">
-              <view class="operation-icon"><text class="iconfont"  :style="{'color':operateColor}">&#xe624;</text></view>
-              <view class="operation-text sys-weight-400" :style="{'color':operateColor}">分享</view>
-            </view>
-          </view>
-          <view class="operation-items">
-            <view class="operation-item">
-              <view class="operation-icon" @click="setLike(itemIndex)">
-                <text class="iconfont icon-dianzan" v-if="!item.liked"  :style="{'color':operateColor}"> &#xe8ad;</text>
-                <text class="iconfont icon-dianzan1" v-else  :style="{'color':'#ED301D'}"> &#xe8c3;</text>
-              </view>
-              <view class="operation-text sys-weight-400" :style="{'color':operateColor}">{{item.likeCount>0?item.likeCount:'点赞'}}</view>
-            </view>
-            <view class="operation-item">
-              <view class="operation-icon"><text class="iconfont icon-pinglun"  :style="{'color':operateColor}">&#xe891;</text></view>
-              <view class="operation-text sys-weight-400" :style="{'color':operateColor}">{{item.commentCount>0?item.commentCount:'评论'}}</view>
-            </view>
-          </view>
-
-        </view>
-
-      </view>
-    </view>
-
-  </view>
+		<view class="praise-item" @click="goToDetails" v-for="(item,itemIndex) in list">
+			<view class="praise-left">
+				<image class="praise-head" :src="item.avatar" mode="aspectFill"></image>
+			</view>
+			<view class="praise-right">
+				<view class="praise-top-data">
+					<view class="praise-top-left">
+						<view class="praise-top-left-title">
+							<view class="left-title-text sys-height-44 sys-color-black sys-weight-600">{{item.nickname}}</view>
+							<view class="left-title-vip">
+								<image class="left-title-vip-img" src="/static/img/my/vip.png" mode="heightFix"></image>
+							</view>
+
+						</view>
+						<view class="left-title-time sys-color-gray-9">{{item.createdAt}}发布</view>
+					</view>
+					<view class="praise-top-right">
+						<call :user-id="item.userId"></call>
+					</view>
+				</view>
+
+				<view class="right-text sys-color-black sys-weight-400">
+					{{item.content}}
+				</view>
+				<view class="right-img">
+					<view class="one-img" v-if="item.galleryUrls.length===1">
+						<img-one :file-list="item.galleryUrls"></img-one>
+					</view>
+					<view class="two-img" v-else-if="item.galleryUrls.length===2 || item.galleryUrls.length===4">
+						<img-two :file-list="item.galleryUrls"></img-two>
+					</view>
+					<view class="three-img" v-else>
+						<img-three :type="2" :file-list="item.galleryUrls"></img-three>
+					</view>
+				</view>
+				<view class="right-tag-list" v-if="false">
+					<dynamic-tag :list="item.tag" :tag-bg="tagBg" :tag-color="tagColor"></dynamic-tag>
+				</view>
+				<view class="right-operation-list">
+					<view class="operation-share">
+						<view class="operation-item">
+							<view class="operation-icon"><text class="iconfont" :style="{'color':operateColor}">&#xe624;</text></view>
+							<view class="operation-text sys-weight-400" :style="{'color':operateColor}">分享</view>
+						</view>
+					</view>
+					<view class="operation-items">
+						<view class="operation-item">
+							<view class="operation-icon" @click="setLike(itemIndex)">
+								<text class="iconfont icon-dianzan" v-if="!item.liked" :style="{'color':operateColor}"> &#xe8ad;</text>
+								<text class="iconfont icon-dianzan1" v-else :style="{'color':'#ED301D'}"> &#xe8c3;</text>
+							</view>
+							<view class="operation-text sys-weight-400" :style="{'color':operateColor}">
+								{{item.likeCount>0?item.likeCount:'点赞'}}</view>
+						</view>
+						<view class="operation-item">
+							<view class="operation-icon"><text class="iconfont icon-pinglun"
+									:style="{'color':operateColor}">&#xe891;</text></view>
+							<view class="operation-text sys-weight-400" :style="{'color':operateColor}">
+								{{item.commentCount>0?item.commentCount:'评论'}}</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+
+	</view>
 </template>
 
 <script>
-import ImgOne from "@/pages/common/img/img-one";
-import ImgTwo from "@/pages/common/img/img-two";
-import ImgThree from "@/pages/common/img/img-three";
-import DynamicTag from "@/pages/common/tag/dynamic-tag";
-import Call from "@/pages/common/call/call";
-import {setLike, setUnLike} from "@/api/community";
-import {getMyLikeMoments, getMyMoments} from "@/api/my";
-import tools from "@/service/tools";
-export default {
-  name: "my-praise",
-  components: {Call, DynamicTag, ImgThree, ImgTwo, ImgOne},
-  props: {
-		tagNum:{},
-	},
-  data() {
-    return {
-      tagBg:'#F2F2F2',
-      tagColor:'#999999',
-      operateColor:'#999999',
-      list:[
-
-      ],
-			listTwo:[
-
-			],
-			publishBoxOff:true,
-      isAjax:false,
-      total:undefined,
-      page:1,
-    }
-  },
-  watch: {},
-  mounted() {
-    this.startList()
-  },
-  methods: {
-    startList(){
-      if(this.userId<=0){
-        // return false
-      }
-      this.list=[]
-      this.isAjax=false
-      this.total=undefined
-      this.page=1
-      this.getMyLikeMoments()
-
-    },
-    getMyLikeMoments(){
-      if(this.isAjax){
-        return
-      }
-      this.isAjax=true
-      let that=this
-      getMyLikeMoments({'userId':this.userId,'pageNo':this.page,'pageSize':20}).then((res)=>{
-        this.isAjax=false
-        if(res.code===0){
-          res.data.data.forEach((item)=>{
-            item.dateArr=tools.getDateArr(item.createdAt)
-            that.list.push(item )
-          })
-          ++that.page
-          that.total=res.data.total
-        }
-      })
-    },
-    setLike(index){
-      this.list[index].liked=!this.list[index].liked
-      if(this.list[index].liked){
-        ++this.list[index].likeCount
-        setLike( this.list[index].id).then((res)=>{})
-      }else {
-        --this.list[index].likeCount
-        setUnLike( this.list[index].id).then((res)=>{})
-      }
-    },
-    goToDetails(){
-      uni.navigateTo({
-        'url':'/pages/circle/circle'
-      })
-    },
-		goRecommended(){
-			uni.navigateTo({
-			  'url':'/pages/circle/recommended'
-			})
+	import ImgOne from "@/pages/common/img/img-one";
+	import ImgTwo from "@/pages/common/img/img-two";
+	import ImgThree from "@/pages/common/img/img-three";
+	import DynamicTag from "@/pages/common/tag/dynamic-tag";
+	import Call from "@/pages/common/call/call";
+	import {
+		setLike,
+		setUnLike
+	} from "@/api/community";
+	import {
+		getMyLikeMoments,
+		getMyMoments
+	} from "@/api/my";
+	import tools from "@/service/tools";
+	export default {
+		name: "my-praise",
+		components: {
+			Call,
+			DynamicTag,
+			ImgThree,
+			ImgTwo,
+			ImgOne
 		},
-		publishOff(){
-			this.publishBoxOff = false
-			console.log(this.publishBoxOff);
+		props: {
+			tagNum: {},
 		},
-  }
-}
-</script>
+		data() {
+			return {
+				tagBg: '#F2F2F2',
+				tagColor: '#999999',
+				operateColor: '#999999',
+				list: [
 
-<style scoped lang="scss">
-.my-praise-box{
-	.publish-box {
-		width: 100%;
-		// height: 100%;
-		display: flex;
-		border-top: 20rpx solid #FAFAFA;
-		border-bottom: 20rpx solid #FAFAFA;
-		padding: 32rpx;
-		justify-content: space-between;
-		position: relative;
-		align-items: center;
-		box-sizing: border-box;
-
-		.publish-img {
-			width: 120rpx;
-			height: 120rpx;
-			flex-shrink: 0;
-		}
+				],
+				listTwo: [
 
-		.publish-text {
-			.publish-title {
-				margin: 0 0 8rpx 0;
+				],
+				publishBoxOff: true,
+				isAjax: false,
+				total: undefined,
+				page: 1,
 			}
-		}
+		},
+		watch: {},
+		mounted() {
+			this.startList()
+		},
+		methods: {
+			startList() {
+				if (this.userId <= 0) {
+					// return false
+				}
+				this.list = []
+				this.isAjax = false
+				this.total = undefined
+				this.page = 1
+				this.getMyLikeMoments()
 
-		.publish-button {
-			flex-shrink: 0;
-			padding: 6rpx 32rpx;
+			},
+			getMyLikeMoments() {
+				if (this.isAjax) {
+					return
+				}
+				this.isAjax = true
+				let that = this
+				getMyLikeMoments({
+					'userId': this.userId,
+					'pageNo': this.page,
+					'pageSize': 20
+				}).then((res) => {
+					this.isAjax = false
+					if (res.code === 0) {
+						res.data.data.forEach((item) => {
+								item.dateArr = tools.getDateArr(item.createdAt)
+								that.list.push(item)
+							})
+							++that.page
+						that.total = res.data.total
+					}
+				})
+			},
+			setLike(index) {
+				this.list[index].liked = !this.list[index].liked
+				if (this.list[index].liked) {
+					++this.list[index].likeCount
+					setLike(this.list[index].id).then((res) => {})
+				} else {
+					--this.list[index].likeCount
+					setUnLike(this.list[index].id).then((res) => {})
+				}
+			},
+			goToDetails() {
+				uni.navigateTo({
+					'url': '/pages/circle/circle'
+				})
+			},
+			goRecommended() {
+				uni.navigateTo({
+					'url': '/pages/circle/recommended'
+				})
+			},
+			publishOff() {
+				this.publishBoxOff = false
+				console.log(this.publishBoxOff);
+			},
 		}
+	}
+</script>
 
-		.off-button {
-			position: absolute;
-			right: 0;
-			top: 0;
-			padding: 0rpx 2rpx 6rpx 12rpx;
+<style scoped lang="scss">
+	.my-praise-box {
+		.publish-box {
+			width: 100%;
+			// height: 100%;
+			display: flex;
+			border-top: 20rpx solid #FAFAFA;
+			border-bottom: 20rpx solid #FAFAFA;
+			padding: 32rpx;
+			justify-content: space-between;
+			position: relative;
+			align-items: center;
+			box-sizing: border-box;
 
-			.off-img {
-				width: 24rpx;
-				height: 24rpx;
+			.publish-img {
+				width: 120rpx;
+				height: 120rpx;
+				flex-shrink: 0;
 			}
-		}
-	}
-	.recommended-box{
-		box-sizing: border-box;
-		width: 100%;
-		padding: 0 24rpx;
-		display: flex;
-		align-items: center;
-		white-space: nowrap;
-		.recommended-list{
-			display: inline-block;
-			width: 320rpx;
-			height: 160rpx;
-			margin: 0 8rpx;
-			padding: 16rpx 4rpx 16rpx 12rpx;
-			box-sizing: border-box;
-			position: relative;
-			// flex-shrink: 0;
-			.recommended-list-img{
-				width: 100%;
-				height: 100%;
+
+			.publish-text {
+				.publish-title {
+					margin: 0 0 8rpx 0;
+				}
+			}
+
+			.publish-button {
+				flex-shrink: 0;
+				padding: 6rpx 32rpx;
+			}
+
+			.off-button {
 				position: absolute;
-				left: 0;
+				right: 0;
 				top: 0;
-				z-index: -1;
-			}
-			.recommended-list-name{
-				display: flex;
-				align-items: center;
-				.list-name-img{
-					width: 28rpx;
-					height: 28rpx;
-					margin: 0 10rpx 0 0;
+				padding: 0rpx 2rpx 6rpx 12rpx;
+
+				.off-img {
+					width: 24rpx;
+					height: 24rpx;
 				}
 			}
-			.recommended-list-text{
-				width: 100%;
-				padding: 0 4rpx 0 16rpx;
+		}
+
+		.recommended-box {
+			box-sizing: border-box;
+			width: 100%;
+			padding: 0 24rpx;
+			display: flex;
+			align-items: center;
+			white-space: nowrap;
+
+			.recommended-list {
+				display: inline-block;
+				width: 320rpx;
+				height: 160rpx;
+				margin: 0 8rpx;
+				padding: 16rpx 4rpx 16rpx 12rpx;
 				box-sizing: border-box;
-				position: absolute;
-				bottom: 16rpx;
-				left: 0;
-				display: flex;
-				align-items: center;
-				justify-content: space-between;
-				.recommended-list-text-left{
+				position: relative;
+
+				// flex-shrink: 0;
+				.recommended-list-img {
+					width: 100%;
+					height: 100%;
+					position: absolute;
+					left: 0;
+					top: 0;
+					z-index: -1;
+				}
+
+				.recommended-list-name {
 					display: flex;
 					align-items: center;
-					.list-text-left-img{
-						width: 40rpx;
-						height: 40rpx;
-						margin: 0 4rpx 0 0;
+
+					.list-name-img {
+						width: 28rpx;
+						height: 28rpx;
+						margin: 0 10rpx 0 0;
 					}
 				}
-				.recommended-list-text-right{
+
+				.recommended-list-text {
+					width: 100%;
+					padding: 0 4rpx 0 16rpx;
+					box-sizing: border-box;
+					position: absolute;
+					bottom: 16rpx;
+					left: 0;
 					display: flex;
 					align-items: center;
+					justify-content: space-between;
+
+					.recommended-list-text-left {
+						display: flex;
+						align-items: center;
+
+						.list-text-left-img {
+							width: 40rpx;
+							height: 40rpx;
+							margin: 0 4rpx 0 0;
+						}
+					}
+
+					.recommended-list-text-right {
+						display: flex;
+						align-items: center;
+					}
+				}
+			}
+		}
+
+		.praise-item {
+			padding: 0 32rpx;
+			margin: 40rpx 0 4rpx 0;
+			border-bottom: 1rpx solid #F2F2F2;
+			display: flex;
+			justify-content: space-between;
+
+			.praise-left {
+				width: 80rpx;
+
+				.praise-head {
+					width: 80rpx;
+					height: 80rpx;
+					border-radius: 60rpx;
+				}
+			}
+
+			.praise-right {
+				width: calc(100% - 80rpx);
+				padding-left: 22rpx;
+
+				.praise-top-data {
+					display: flex;
+					justify-content: space-between;
+
+					.praise-top-left {
+						.praise-top-left-title {
+							display: flex;
+							justify-content: flex-start;
+							align-items: center;
+
+							.left-title-text {
+								font-size: 32rpx;
+								margin-right: 8rpx;
+								flex-shrink: 0;
+							}
+
+							.left-title-vip-img {
+								height: 28rpx;
+							}
+						}
+
+						.left-title-time {
+							margin-top: 8rpx;
+							line-height: 34rpx;
+							font-size: 24rpx;
+						}
+					}
+
+				}
+
+				.right-text {
+					margin-top: 24rpx;
+					font-size: 28rpx;
+					height: 40rpx;
+					line-height: 40rpx;
+				}
+
+				.right-img {
+					margin-top: 16rpx;
+				}
+
+				.right-tag-list {
+					margin-top: 8rpx;
+				}
+
+				.right-operation-list {
+					margin-top: 44rpx;
+					padding-bottom: 42rpx;
+					display: flex;
+					justify-content: space-between;
+
+					.operation-share {
+						.operation-item:first-child {
+							.operation-icon {
+								text {
+									font-size: 30rpx;
+								}
+							}
+						}
+					}
+
+					.operation-items {
+						display: flex;
+						justify-content: flex-start;
+
+						.operation-item:first-child {
+							.operation-text {
+								width: 100rpx;
+							}
+						}
+
+						.operation-item:last-child {
+							.operation-text {
+								width: 80rpx;
+							}
+						}
+
+					}
+
+					.operation-item {
+						display: flex;
+						justify-content: flex-start;
+
+						.operation-icon {
+							width: 40rpx;
+							height: 40rpx;
+							margin-right: 8rpx;
+
+							text {
+								font-size: 40rpx;
+								line-height: 40rpx;
+							}
+						}
+
+						.operation-text {
+							height: 40rpx;
+							line-height: 41rpx;
+							font-size: 26rpx;
+
+						}
+					}
+
 				}
 			}
+
 		}
 	}
-  .praise-item{
-		padding: 0 	32rpx;
-    margin : 40rpx 0 4rpx 0;
-    border-bottom: 1rpx solid #F2F2F2;
-    display: flex;
-    justify-content: space-between;
-    .praise-left{
-      width: 80rpx;
-      .praise-head{
-        width: 80rpx;
-        height: 80rpx;
-        border-radius: 60rpx;
-      }
-    }
-    .praise-right{
-      width: calc(100% - 80rpx);
-      padding-left: 22rpx;
-      .praise-top-data{
-        display: flex;
-        justify-content: space-between;
-        .praise-top-left{
-          .praise-top-left-title{
-            display: flex;
-            justify-content: flex-start;
-            align-items: center;
-            .left-title-text{
-              font-size: 32rpx;
-              margin-right: 8rpx;
-            }
-            .left-title-vip-img{
-              height: 28rpx;
-            }
-          }
-          .left-title-time{
-            margin-top: 8rpx;
-            line-height: 34rpx;
-            font-size: 24rpx;
-          }
-        }
-
-      }
-      .right-text{
-        margin-top: 24rpx;
-        font-size: 28rpx;
-        height: 40rpx;
-        line-height: 40rpx;
-      }
-      .right-img{
-        margin-top: 16rpx;
-      }
-      .right-tag-list{
-        margin-top: 8rpx;
-      }
-      .right-operation-list{
-        margin-top: 44rpx;
-        padding-bottom: 42rpx;
-        display: flex;
-        justify-content: space-between;
-        .operation-share{
-          .operation-item:first-child{
-            .operation-icon{
-              text{
-                font-size: 30rpx;
-              }
-            }
-          }
-        }
-        .operation-items{
-          display: flex;
-          justify-content: flex-start;
-          .operation-item:first-child{
-            .operation-text{
-              width: 100rpx;
-            }
-          }
-          .operation-item:last-child{
-            .operation-text{
-              width: 80rpx;
-            }
-          }
-
-        }
-        .operation-item{
-          display: flex;
-          justify-content: flex-start;
-          .operation-icon{
-            width: 40rpx;
-            height: 40rpx;
-            margin-right: 8rpx;
-            text{
-              font-size: 40rpx;
-              line-height: 40rpx;
-            }
-          }
-          .operation-text{
-            height: 40rpx;
-            line-height: 41rpx;
-            font-size: 26rpx;
-
-          }
-        }
-
-      }
-    }
-
-  }
-}
-
-</style>
+</style>

pages/my/set/blacklist.vue

@@ -1,166 +1,181 @@
 <template>
-  <view class="blacklist-box">
-    <en-nav title="黑名单" :title-color="'#333'"   @navHeight="setNavHeight"></en-nav>
-    <scroll-view  class="blacklist-list" :scroll-y="true"  :scroll-x="true" :style="{'height':'calc(100% - '+navHeight+'rpx)'}">
-      <view class="blacklist-item" v-for="(item,i) in list">
-        <view class="blacklist-left">
-          <image class="blacklist-img" src="/static/img/temporary/4.png" mode="aspectFill"></image>
-        </view>
-        <view class="blacklist-right">
-          <view class="blacklist-title">
-            <view class="title-text sys-color-black sys-weight-600 sys-height-44">江小明</view>
-            <view class="title-icon" @click.stop="showDel(item,i)">
-              <text class="iconfont sys-height-44 sys-color-black">&#xe74b;</text>
-            </view>
-          </view>
-          <view class="blacklist-text">
-            <view class="text-item sys-color-gray-9">女/24/天瓶座</view>
-            <view class="text-item sys-color-gray-9">2023/04/24</view>
-          </view>
-        </view>
-      </view>
-    </scroll-view>
-    <en-blank v-if="list<=0"></en-blank>
-    <uni-popup ref="alertDialog" type="dialog">
-      <uni-popup-dialog type="center" cancelText="取消"
-                        confirmText="确定" title="移除黑名单" content="是否移除黑名单"
-                        @confirm="delBlackItem()"
-                        @close="close()"></uni-popup-dialog>
-    </uni-popup>
-  </view>
+	<view class="blacklist-box">
+		<en-nav title="黑名单" :title-color="'#333'" @navHeight="setNavHeight"></en-nav>
+		<scroll-view class="blacklist-list" :scroll-y="true" :scroll-x="true"
+			:style="{'height':'calc(100% - '+navHeight+'rpx)'}">
+			<view class="blacklist-item" v-for="(item,i) in list">
+				<view class="blacklist-left">
+					<image class="blacklist-img" src="/static/img/temporary/4.png" mode="aspectFill"></image>
+				</view>
+				<view class="blacklist-right">
+					<view class="blacklist-title">
+						<view class="title-text sys-color-black sys-weight-600 sys-height-44">{{item.nickName}}</view>
+						<view class="title-icon" @click.stop="showDel(item,i)">
+							<text class="iconfont sys-height-44 sys-color-black">&#xe74b;</text>
+						</view>
+					</view>
+					<view class="blacklist-text">
+						<view class="text-item sys-color-gray-9">{{item.gender}}/24/{{item.constellation}}</view>
+						<view class="text-item sys-color-gray-9">{{item.date}}</view>
+					</view>
+				</view>
+			</view>
+		</scroll-view>
+		<en-blank v-if="list<=0"></en-blank>
+		<uni-popup ref="alertDialog" type="dialog">
+			<uni-popup-dialog type="center" cancelText="取消" confirmText="确定" title="移除黑名单" content="是否移除黑名单"
+				@confirm="delBlackItem()" @close="close()"></uni-popup-dialog>
+		</uni-popup>
+	</view>
 </template>
 
 <script>
-import EnNav from "@/components/en-utils/en-nav/en-nav";
-import {delBlackItem, getBlackList} from "@/api/my";
-import tools from "@/service/tools";
-import EnBlank from "@/components/en-utils/en-blank/en-blank";
-export default {
-  components: {EnBlank, EnNav},
-  data() {
-    return {
-      navHeight:0,
-      list:[],
-      isAjax:false,
-      total:undefined,
-      page:1,
-      selectItem:{},
-      selectIndex:0,
-    }
-  },
-  mounted() {
-    this.startList()
-  },
-  methods: {
-    setNavHeight(navHeight){
-      this.navHeight=navHeight
-    },
-    close(){
-      this.isPop = false;
-      this.$refs.alertDialog.close()
-    },
-    showDel(selectItem,selectIndex){
-      this.selectItem=selectItem
-      this.selectIndex=selectIndex
-      this.$refs.alertDialog.open()
-    },
-    delBlackItem(){
-      delBlackItem(this.selectItem.id).then((res)=>{
-        if(res.code===1){
-          tools.success('取消成功')
-          this.close()
-          this.list.splice(this.selectIndex,1)
-
-        }else {
-          tools.error(res.msg)
-        }
-      })
-    },
-    startList(){
-      if(this.userId<=0){
-        // return false
-      }
-      this.list=[]
-      this.isAjax=false
-      this.total=undefined
-      this.page=1
-      this.getBlackList()
-
-
-    },
-    getBlackList(){
-      if(this.isAjax){
-        return
-      }
-      this.isAjax=true
-      let that=this
-      getBlackList({'pageNo':this.page,'pageSize':'20'}).then((res)=>{
-        this.isAjax=false
-        if(res.code===0){
-          res.data.data.forEach((item)=>{
-            that.list.push(item )
-          })
-          ++that.page
-          that.total=res.data.total
-        }
-      })
-    },
-
-  }
-}
+	import EnNav from "@/components/en-utils/en-nav/en-nav";
+	import {
+		delBlackItem,
+		getBlackList
+	} from "@/api/my";
+	import tools from "@/service/tools";
+	import EnBlank from "@/components/en-utils/en-blank/en-blank";
+	export default {
+		components: {
+			EnBlank,
+			EnNav
+		},
+		data() {
+			return {
+				navHeight: 0,
+				list: [],
+				isAjax: false,
+				total: undefined,
+				page: 1,
+				selectItem: {},
+				selectIndex: 0,
+			}
+		},
+		mounted() {
+			this.startList()
+		},
+		methods: {
+			setNavHeight(navHeight) {
+				this.navHeight = navHeight
+			},
+			close() {
+				this.isPop = false;
+				this.$refs.alertDialog.close()
+			},
+			showDel(selectItem, selectIndex) {
+				this.selectItem = selectItem
+				this.selectIndex = selectIndex
+				this.$refs.alertDialog.open()
+			},
+			delBlackItem() {
+				delBlackItem(this.selectItem.id).then((res) => {
+					if (res.code === 1) {
+						tools.success('取消成功')
+						this.close()
+						this.list.splice(this.selectIndex, 1)
+
+					} else {
+						tools.error(res.msg)
+					}
+				})
+			},
+			startList() {
+				if (this.userId <= 0) {
+					// return false
+				}
+				this.list = []
+				this.isAjax = false
+				this.total = undefined
+				this.page = 1
+				this.getBlackList()
+
+
+			},
+			getBlackList() {
+				if (this.isAjax) {
+					return
+				}
+				this.isAjax = true
+				let that = this
+				getBlackList({
+					'pageNo': this.page,
+					'pageSize': '20'
+				}).then((res) => {
+					this.isAjax = false
+					if (res.code === 0) {
+						res.data.data.forEach((item) => {
+								that.list.push(item)
+							})
+							++that.page
+						that.total = res.data.total
+					}
+				})
+			},
+
+		}
+	}
 </script>
 
 <style scoped lang="scss">
-.blacklist-box{
-  height: 100vh;
-  padding: 0 32rpx;
-  overflow-x: auto;
-  .blacklist-list{
-    width: calc(100vw - 64rpx);
-  }
-
-  .blacklist-item{
-    width: calc(100vw - 64rpx);
-    display: flex;
-    justify-content: space-between;
-
-    .blacklist-left{
-      padding: 32rpx 0;
-      margin-right: 28rpx;
-      .blacklist-img{
-        border-radius: 50%;
-        width: 96rpx;
-        height: 96rpx;
-      }
-    }
-    .blacklist-right{
-
-      padding: 32rpx 0;
-      width: calc(100% - 124rpx);
-      border-bottom: 1rpx solid #F2F2F2;
-      .blacklist-title{
-        display: flex;
-        justify-content: space-between;
-        height: 44rpx;
-        .title-text{
-          font-size: 32rpx;
-        }
-        .title-icon{
-          .iconfont{
-            font-size:  24rpx;
-          }
-        }
-      }
-      .blacklist-text{
-        display: flex;
-        justify-content: space-between;
-        margin-top: 4rpx;
-        .text-item{
-          font-size: 28rpx;
-        }
-      }
-    }
-  }
-}
-
-</style>
+	.blacklist-box {
+		height: 100vh;
+		padding: 0 32rpx;
+		overflow-x: auto;
+
+		.blacklist-list {
+			width: calc(100vw - 64rpx);
+		}
+
+		.blacklist-item {
+			width: calc(100vw - 64rpx);
+			display: flex;
+			justify-content: space-between;
+
+			.blacklist-left {
+				padding: 32rpx 0;
+				margin-right: 28rpx;
+
+				.blacklist-img {
+					border-radius: 50%;
+					width: 96rpx;
+					height: 96rpx;
+				}
+			}
+
+			.blacklist-right {
+
+				padding: 32rpx 0;
+				width: calc(100% - 124rpx);
+				border-bottom: 1rpx solid #F2F2F2;
+
+				.blacklist-title {
+					display: flex;
+					justify-content: space-between;
+					height: 44rpx;
+
+					.title-text {
+						font-size: 32rpx;
+					}
+
+					.title-icon {
+						.iconfont {
+							font-size: 24rpx;
+						}
+					}
+				}
+
+				.blacklist-text {
+					display: flex;
+					justify-content: space-between;
+					margin-top: 4rpx;
+
+					.text-item {
+						font-size: 28rpx;
+					}
+				}
+			}
+		}
+	}
+</style>