原型改动,同步更改

mixin/index.js

@@ -58,7 +58,7 @@ module.exports = {
     return {
       globalImgUrls:globalImgUrls,// 图片资源
       globalBgMusic:uni.getBackgroundAudioManager(),
-      globalRecorder:uni.getRecorderManager()
+      globalRecorder:uni.getRecorderManager(),//录音
     };
   },
   onLoad(options) {

mixin/questionMixin.js

@@ -0,0 +1,84 @@
+/* 问答社区 音频播放公共逻辑 */
+export default {
+    data() {
+        return {
+            currentAudioMsg: {
+                id: '',
+                audioCurrentTime: 0, //音频播放实时时间
+                audioTime: 0, //当前音频时间
+                audioCurrentUrl: '', //当前音频地址
+            }, //当前正在播放音频的一些信息
+        }
+    },
+    onLoad() {
+        this.initAudio()
+    },
+    onUnload() {
+        this.destroyAudio()
+    },
+    methods: {
+        //初始化audio
+        initAudio() {
+            this.innerAudio = uni.createInnerAudioContext()
+            this.handleAudioFun()
+        },
+        //销毁audio
+        destroyAudio() {
+            if (this.innerAudio) {
+                this.innerAudio.destroy()
+            }
+        },
+        //audio事件
+        handleAudioFun() {
+            this.innerAudio.onPlay(() => {
+                console.log('开始了')
+            })
+            this.innerAudio.onTimeUpdate(() => {
+                //console.log('时间更新')
+                this.currentAudioMsg.audioCurrentTime = moment(this.innerAudio.currentTime * 1000).format('mm:ss')
+                //console.log('duration',this.innerAudio.duration)
+            })
+            this.innerAudio.onEnded(() => {
+                console.log('音频播放完毕')
+                const {
+                    id
+                } = this.currentAudioMsg
+                this.quesionList.map(i => {
+                    if (i.id === id) {
+                        i.answer.isplay = false
+                        i.answer.ispause = false
+                    }
+                })
+                this.changeCurrentAudio({
+                    id: '',
+                    answer: {
+                        source: '',
+                        audioTime: 0
+                    }
+                })
+            })
+        },
+        //播放音频
+        handleAudioPlay() {
+            this.innerAudio.onCanplay(() => {
+                this.innerAudio.play()
+            })
+        },
+        //切换当前播放音频
+        changeCurrentAudio(item) {
+            const {
+                id
+            } = item
+            const {
+                source,
+                audioTime
+            } = item.answer
+            this.currentAudioMsg = {
+                id: id,
+                audioCurrentTime: 0,
+                audioTime: audioTime,
+                audioCurrentUrl: source
+            }
+        },
+    }
+}

pages-question/answerDetail.vue

@@ -40,8 +40,9 @@ export default {
     onLoad() {
 		this.initAudio()
 	},
-	ononUnload(){
-		this.destoryAudio()
+	onUnload(){
+		//this.destoryAudio()
+        //uni.reLaunch({ url: '/pages/question/question' })
 	},
     methods: {
         //初始化audio
@@ -75,9 +76,9 @@ export default {
                 this.innerAudio.src = res.tempFilePath
                 this.cleanTime()
             })
-            /* this.globalRecorder.onFrameRecorded((res)=>{
+            this.globalRecorder.onFrameRecorded((res)=>{
                 console.log('?',res)
-            }) */
+            })
         },
         handleAudio(type) {
             //根据questionItem.status

pages-question/answerList.vue

@@ -1,43 +1,253 @@
 <template>
-    <view class="answer-page">
-        <view class="answer-bar">
-            <view>待回答</view>
-            <view>已回答</view>
-            <view>全部</view>
+  <view class="answer-page">
+    <view class="answer-bar">
+      <view
+        class="bar-item"
+        :class="{ active: item.key === selectKey }"
+        @click="changeBar(item)"
+        v-for="item in barList"
+        :key="item.key"
+        >{{ item.label + "(" + item.num + ")" }}</view
+      >
+    </view>
+    <view class="answer-list">
+      <view class="answer-item" v-for="item in questionList" :key="item.id">
+        <view style="display: flex">
+          <text class="item-label" v-if="vistor.type===1||item.status===2">{{ item.label }}</text>
+          <text class="item-title">{{ item.text }}</text>
         </view>
-        <view class="answer-list">
-            <view class="answer-item" v-for="item in questionList" :key="item.id">
-                <text class="item-title">{{item.text}}</text>
-                <view>
-                    <text class="item-time">
-                        提问时间:{{item.time}}
-                    </text>
-                    <view class="item-type" @click="toDetail(item)">
-                        {{item.type===1?'去回答':'查看'}}
-                    </view>
-                </view>
+        <text class="item-time"> 提问时间:{{ item.time }} </text>
+        <view class="item-answer">
+          <template v-if="item.status === 2">
+            <view class="answer" @click="handleAudio(item)">
+              <text>{{ item.answer.isplay ? "暂停" : "播放" }}</text>
+              <template v-if="item.answer.isplay || item.answer.ispause">
+                <text
+                  >{{ currentAudioMsg.audioCurrentTime }}/{{
+                    item.answer.audioTime
+                  }}</text
+                >
+              </template>
+              <template v-else>
+                <text>{{ item.answer.audioTime }}</text>
+              </template>
+            </view>
+          </template>
+          <template v-else>
+            <view class="noanswer">
+              <!-- 提问者 -->
+              <text v-if="vistor.type === 2"
+                >暂无回复，研究员正在快马加鞭的赶来</text
+              >
+              <!-- 回答者 -->
+              <view v-else
+                >暂无回复，<text class="url" @click="toDetail(item)">立即回复</text></view>
             </view>
+          </template>
         </view>
+       <!--  <view class="item-type" @click="toDetail(item)">
+                        {{item.type===1?'去回答':'查看'}}
+        </view> -->
+      </view>
     </view>
+  </view>
 </template>
 <script>
-    export default{
-        data(){
-            return{
-                questionList:[
-                    {
-                        id:1,//问题id
-                        text:'疫情下全球苯乙烯市场有什么动荡和影响?',//问题描述
-                        time:'2022.5.23 14:40',//提问时间
-                        type:1,//问题状态:1待回答,2已回答
-                    }
-                ]
-            }
+import mixin from "../mixin/questionMixin";
+const moment = require("@/utils/moment-with-locales.min");
+moment.locale("zh-cn");
+export default {
+  mixins: [mixin],
+  data() {
+    return {
+      questionList: [],
+      mockwaitList: [
+        {
+          id: 1, //问题id
+          text: "疫情下全球苯乙烯市场有什么动荡和影响?", //问题描述
+          time: "2022.5.23 14:40", //提问时间
+          status: 1, //问题状态:1待回答,2已回答
+          answer: {
+            source: "", // 回答音频
+            time: "", //回答时间
+            audioTime: 0, //音频长度,单位秒
+            isplay: false,
+            ispause: false,
+          },
+          label: "苯乙烯", // 问题分类
+        },
+      ], //待回答的问题
+      mockrepliedList: [
+        {
+          id: 1, //问题id
+          text: "疫情下全球苯乙烯市场有什么动荡和影响?", //问题描述
+          time: "2022.5.23 14:40", //提问时间
+          status: 2, //问题状态:1待回答,2已回答
+          answer: {
+            source:
+              "https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3", // 回答音频
+            time: "2022.5.23 15:40", //回答时间
+            audioTime: moment(21 * 1000).format("mm:ss"), //音频长度,单位秒
+            isplay: false,
+            ispause: false,
+          },
+          label: "苯乙烯", // 问题分类
         },
-        methods:{
-            toDetail(item){
-                uni.navigateTo({url:'/pages-question/answerDetail'})
+      ], //已回答的问题
+      barList: [
+        {
+          label: "待回答",
+          key: "Wait",
+          num: 1,
+        },
+        {
+          label: "已回答",
+          key: "Replied",
+          num: 1,
+        },
+        {
+          label: "全部",
+          key: "Total",
+          num: 2,
+        },
+      ],
+      selectKey: "Wait",
+      Wait: 1,
+      Replied: 1,
+      Total: 2,
+      vistor: {
+        type: 1, //1研究员,2客户
+      },
+    };
+  },
+  onLoad() {
+    this.getQuestionData();
+  },
+  methods: {
+    toDetail(item) {
+      uni.navigateTo({ url: "/pages-question/answerDetail" });
+    },
+    //点击bar
+    changeBar({ key }) {
+      if (key === this.selectKey) return;
+      this.selectKey = key;
+      this.getQuestionData();
+    },
+    getQuestionData() {
+      if (this.selectKey === "Wait") {
+        this.questionList = this.mockwaitList;
+      } else if (this.selectKey === "Replied") {
+        this.questionList = this.mockrepliedList;
+      } else {
+        this.questionList = this.mockwaitList.concat(this.mockrepliedList);
+      }
+    },
+    //点击某条音频
+    handleAudio(item) {
+      const { source, isplay } = item.answer;
+      if (isplay) {
+        //说明是播放->暂停
+        this.innerAudio.pause();
+      } else if (item.id === this.currentAudioMsg.id) {
+        //说明是暂停->播放
+        this.innerAudio.play();
+      } else {
+        console.log("aaa", source, this.innerAudio.src);
+        //说明是第一次播放或点击其他播放项
+        this.changeCurrentAudio(item);
+        this.innerAudio.stop();
+        this.innerAudio.src = source;
+        /* this.innerAudio.play() */
+        this.handleAudioPlay();
+      }
+      this.quesionList.map((i) => {
+        if (i.id === item.id) {
+          if (i.answer.isplay) {
+            i.answer.ispause = true;
+          }
+          i.answer.isplay = !i.answer.isplay;
+        } else {
+          i.answer.isplay = false;
+          i.answer.ispause = false;
+        }
+      });
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.answer-page {
+  padding: 35rpx;
+  .answer-bar {
+    display: flex;
+    justify-content: space-between;
+    .bar-item {
+      width: 206rpx;
+      color: #666666;
+      background-color: #f5f5f5;
+      height: 70rpx;
+      line-height: 70rpx;
+      text-align: center;
+      &.active {
+        background-color: #fdf8f2;
+        color: #e3b377;
+      }
+    }
+  }
+  .answer-list {
+    margin-top: 20rpx;
+    .answer-item {
+      margin-bottom: 20rpx;
+      .item-label {
+        width: 90rpx;
+        height: 41rpx;
+        font-size: 24rpx;
+        text-align: center;
+        line-height: 41rpx;
+        background-color: #333333;
+        color: #e4b478;
+      }
+      .item-title {
+        display: block;
+        font-size: 32rpx;
+        color: #333333;
+      }
+      .item-time {
+        color: #999999;
+        font-size: 24rpx;
+        margin: 20rpx 0;
+        display: block;
+      }
+      .item-answer {
+        display: flex;
+        width: 100%;
+        box-sizing: border-box;
+        padding: 20rpx;
+        align-items: center;
+        .answer {
+          width: 340rpx;
+          height: 74rpx;
+          box-sizing: border-box;
+          padding: 20rpx 30rpx;
+          border-radius: 37rpx;
+          background: linear-gradient(253deg, #e3b377 0%, #fbca8e 100%);
+          display: flex;
+          justify-content: space-between;
+          color: #ffffff;
+        }
+        .noanswer{
+            width:100%;
+            height:145rpx;
+            text-align: center;
+            line-height: 145rpx;
+            background-color: #F5F5F5;
+            color: #666666;
+            .url{
+                color: #E3B377;
             }
         }
+      }
     }
-</script>
+  }
+}
+</style>

pages-question/hasQuestion.vue

@@ -5,9 +5,12 @@
       v-model="text"
       placeholder="请输入问题描述"
       placeholder-class="textarea-placeholder"
+      :maxlength="maxlength"
+      @input="calcWord"
     />
+    <text style="float:right;color:grey;">剩余可输入字数:<text :style="{color:(maxlength-textlength<=10)?'red':'grey'}">{{maxlength-textlength}}</text>字</text>
     <view class="btn-wrap">
-      <view class="btn" @click="handleClick">完成</view> 
+      <view class="btn" @click="handleClick">发布提问</view> 
     </view>
   </view>
 </template>
@@ -16,15 +19,18 @@
 export default {
   data() {
     return {
-      text:''
+      text:'',
+      textlength:0,
+      maxlength:100,
     };
   },
   methods: {
     handleClick(){
-      const pages = getCurrentPages()
-      console.log(pages)
-      pages[pages.length-2].data.changeSelect('me')
       uni.navigateBack({delta:1})
+    },
+    //计算字数
+    calcWord(e){
+      this.textlength = e.detail.value.length
     }
   },
 };

pages/question/mock.js

@@ -97,6 +97,7 @@ const questionData = [
             isplay: false,
             ispause:false,
         },
+        loading:false,
         label: '苯乙烯',// 问题分类
     },
     {
@@ -115,6 +116,7 @@ const questionData = [
             isplay: false,
             ispause:false,
         },
+        loading:false,
         label: '苯乙烯',// 问题分类
     },
     {
@@ -133,6 +135,7 @@ const questionData = [
             isplay: false,
             ispause:false,
         },
+        loading:false,
         label: '苯乙烯',// 问题分类
     },
     {
@@ -151,6 +154,7 @@ const questionData = [
             isplay: false,
             ispause:false,
         },
+        loading:false,
         label: '苯乙烯',// 问题分类
     },
     {
@@ -169,6 +173,7 @@ const questionData = [
             isplay: false,
             ispause:false,
         },
+        loading:false,
         label: '苯乙烯',// 问题分类
     },
     {
@@ -187,6 +192,7 @@ const questionData = [
             isplay: false,
             ispause:false,
         },
+        loading:false,
         label: '苯乙烯',// 问题分类
     }
 ]

pages/question/question.vue

@@ -1,62 +1,54 @@
 <template>
 	<view class="question-wrap">
 		<view class="question-top">
-			<text class="text" :class="{'active':selectType==='all'}" @click="changeSelect('all')">热门问答</text>		
-			<view class="text" :class="{'active':selectType==='me'}" @click="changeSelect('me')">我的{{ vistor.type === 1 ? '回答' : '提问' }}</view>
 			<template>
 			<image src="../../static/chart/menu.png" mode="widthFix" class="menu-icon"
 				@click="showPopup" />
 			筛选	
-			</template>
-			
-			<van-popup :show="isPopupShow" position="bottom"  round  :close-on-click-overlay="false"
-				@close="isPopupShow = false" :style="{ height: '30%' }">
+			</template>	
+			<van-popup :show="isPopupShow" position="left"  :close-on-click-overlay="true"
+				@close="isPopupShow = false"
+				custom-style="height: 100%;width:50%;"
+				@touchmove.stop.prevent>
 				<view class="pop-wrap">
-					<view class="pop-top">
-						<text>全部筛选</text>
-						<text @click="isPopupShow=false">取消</text>
-					</view>	
 					<view class="pop-option-list">
 						<van-collapse :value="activeName" @change="changeSelecOption" accordion :border="false">
 							<van-collapse-item :border="false" :title="item.title" :name="index" v-for="(item, index) in optionList"
 								:key="index">
 								<view class="option-btn-wrap">
-									<view class="option-btn" @click="selectName=i.name" :class="{'active':selectName===i.name}" v-for="(i, _index) in item.btnList" :key="_index">
+									<view class="option-btn" @click="()=>{selectName=i.name;isPopupShow = false}" :class="{'active':selectName===i.name,'full':i.name.length>4}" v-for="(i, _index) in item.btnList" :key="_index">
 										{{ i.name }}
 									</view>
 								</view>
 							</van-collapse-item>
 						</van-collapse>
 					</view>
-					<view class="pop-btn" @click="changeSelect('name')">完成</view>
 				</view>	
-			</van-popup>
+			</van-popup>		
 		</view>
 		<view class="question-list">
 			<view class="question-item" v-for="item in quesionList" :key="item.id">
-				<text class="item-title">{{ item.question.text }}</text>
+				<view style="display:flex;">
+					<text class="item-label">{{item.label}}</text>
+					<text class="item-title">{{ item.question.text }}</text>
+				</view>
 				<text class="item-time">提问时间:{{ item.question.time }}</text>
 				<view class="item-answer">
-					<view class="answer-img"></view>
-					<view class="answer-other">
-						<view class="answer-info">
-							<text class="name">{{ item.answer.name }}</text>
-							<text class="group">弘则{{ item.answer.group }}组研究员</text>
-							<text class="label">{{ item.label }}</text>
-						</view>
 						<view class="answer" @click="handleAudio(item)">
-							<text>{{ item.answer.isplay ? '暂停' : '播放' }}</text>
-							<template v-if="item.answer.isplay || item.answer.ispause">
-								<text>{{ currentAudioMsg.audioCurrentTime }}/{{ item.answer.audioTime }}</text>
+							<template v-if="!item.loading">
+								<text>{{ item.answer.isplay ? '暂停' : '播放' }}</text>
+								<template v-if="item.answer.isplay || item.answer.ispause">
+									<text>{{ currentAudioMsg.audioCurrentTime }}/{{ item.answer.audioTime }}</text>
+								</template>
+								<template v-else>
+									<text>{{ item.answer.audioTime }}</text>
+								</template>
 							</template>
 							<template v-else>
-								<text>{{ item.answer.audioTime }}</text>
+								<image class="load-img" src="../../static/loading.png" mode="aspectFill" />
 							</template>
-
 						</view>
-					</view>
 				</view>
-				<text class="item-time">回答时间:{{ item.answer.time }}</text>
 			</view>
 		</view>
 		<view class="topage-btn" @click="toPage(vistor)">
@@ -121,15 +113,22 @@ export default {
 			selectName:'宏观'
 		}
 	},
+	watch:{
+		selectName(){
+			this.getQuestionList()
+		}
+	},
 	onLoad() {
 		this.initAudio()
 		this.getVistor()
+		this.getOptionList()
+		this.getQuestionList()
 	},
 	onShow() {
 		
 	},
-	ononUnload() {
-		this.destoryAudio()
+	onUnload() {
+		this.destroyAudio()
 	},
 	methods: {
 		//初始化audio
@@ -138,9 +137,9 @@ export default {
 			this.handleAudioFun()
 		},
 		//销毁audio
-		destoryAudio() {
+		destroyAudio() {
 			if (this.innerAudio) {
-				this.innerAudio.destory()
+				this.innerAudio.destroy()
 			}
 		},
 		//获取访客信息:研究员/客户
@@ -155,11 +154,24 @@ export default {
 					canPlay: true,//是否能够播放音频
 				}
 			}
+		},
+		//获取筛选列表
+		getOptionList(){
+		},
+		//获取问题列表
+		getQuestionList(){
+
 		},
 		//audio事件
 		handleAudioFun() {
 			this.innerAudio.onPlay(() => {
 				console.log('开始了')
+				this.quesionList.map(i=>{
+				if(i.id===this.currentAudioMsg.id){
+					i.loading = false
+					/* uni.hideLoading(); */
+				}
+			})
 			})
 			this.innerAudio.onTimeUpdate(() => {
 				//console.log('时间更新')
@@ -238,10 +250,18 @@ export default {
 			const { source, audioTime } = item.answer
 			this.currentAudioMsg = {
 				id: id,
-				audioCurrentTime: 0,
+				audioCurrentTime: moment(0 * 1000).format('mm:ss'),
 				audioTime: audioTime,
 				audioCurrentUrl: source
 			}
+			this.quesionList.map(i=>{
+				if(i.id===item.id){
+					i.loading = true
+					/* uni.showLoading({
+						title: '加载中'
+					}); */
+				}
+			})
 		},
 		//点击'热门回答'/'只看我的'/筛选弹窗的按钮
 		changeSelect(type) {
@@ -295,6 +315,7 @@ export default {
 				} else {
 					i.answer.isplay = false
 					i.answer.ispause = false
+					i.loading = false
 				}
 			})
 		},
@@ -346,7 +367,8 @@ page {
 	background-color: #FFFFFF;
 	.question-top {
 		display: flex;
-		justify-content: space-between;
+		flex: auto;
+		justify-content: flex-end;
 		align-items: center;
 		height: 100rpx;
 		background-color: white;
@@ -375,38 +397,29 @@ page {
 			width: 40rpx;
 		}
 		.pop-wrap{
-			padding: 50rpx 34rpx 0 34rpx;
-			.pop-top {
-				display: flex;
-				justify-content: space-between;
-				text{
-					font-size: 32rpx;
-					&:first-child{	
-						color: #000000;
-					}
-					&:last-child{
-						color: #E3B377;
-					}
-				}
-			}
-
+			height: 100%;
+			padding: 50rpx 34rpx;
 			.pop-option-list {
 				.option-btn-wrap {
 					display: flex;
+					justify-content: space-between;
 					flex-wrap: wrap;
 					margin-bottom: 20rpx;
 					.option-btn {
-						width: 215rpx;
+						min-width: 145rpx;
 						height:76rpx;
 						line-height: 76rpx;
 						text-align: center;
 						color: black;
 						background-color: #F6F6F6;
 						border-radius: 4rpx;
-						margin: 10rpx 10rpx 0 0;
+						margin-top: 10rpx;
 						&.active{
 							background-color: #FAEEDE;
 						}
+						&.full{
+							width:100%;
+						}
 					}
 				}
 			}
@@ -437,6 +450,15 @@ page {
 					background-color: #FFFFFF;
 				}
 			}
+			.item-label{
+				width: 90rpx;
+				height:41rpx;
+				font-size: 24rpx;
+				text-align: center;
+				line-height: 41rpx;
+				background-color: #333333;
+				color: #E4B478;			
+			}
 			.item-title {
 				display: block;
 				font-size: 32rpx;
@@ -453,19 +475,19 @@ page {
 			.item-answer {
 				display: flex;
 				width:100%;
-				height: 213rpx;
-				background-color: #FDF8F2;
+				/* height: 213rpx;
+				background-color: #FDF8F2; */
 				box-sizing: border-box;
 				padding:20rpx;
 				align-items: center;
 				position:relative;
-				.answer-img {
+				/* .answer-img {
 					width: 146rpx;
 					height: 146rpx;
 					border: 4rpx solid #FFFFFF;
 					border-radius: 50%;
 					margin-right: 20rpx;
-				}
+				} */
 
 				.answer-other {
 					display: flex;
@@ -497,9 +519,8 @@ page {
 						}
 					}
 				}
-
 				.answer {
-					margin-top: 20rpx;
+					/* margin-top: 20rpx; */
 					width: 340rpx;
 					height: 74rpx;
 					box-sizing: border-box;
@@ -509,6 +530,19 @@ page {
 					display: flex;
 					justify-content: space-between;
 					color: #FFFFFF;
+					 .load-img{
+            			width: 44rpx;
+            			height: 44rpx;
+            			animation: circle 1s linear infinite;
+        			}
+        			@keyframes circle {
+						0%{
+							transform: rotateZ(0);
+						}
+						100%{
+							transform: rotateZ(360deg);
+						}
+        			}
 				}
 			}
 		}
@@ -516,12 +550,14 @@ page {
 
 	.topage-btn {
 		position: fixed;
-		left:0;
-		right:0;
-		bottom: 0;
+		left:50%;
+		margin-left: -257rpx;
+		bottom: 215rpx;
+		width:514rpx;
 		height: 80rpx;
 		text-align: center;
 		line-height: 80rpx;
+		border-radius: 40rpx;
 		background-color: #333333;
 		box-shadow: 0px 4px 20px 1px rgba(160, 126, 84, 0.25);
 		color: #E3B377;

pages/report/report.vue

@@ -100,9 +100,9 @@ export default {
         height:0,
         top:0,
         stickyHeight:0
-      },
+      },//movable的活动范围
       x:0,
-      y:245,
+      y:245,//movable的初始值位置
       authData:{
         show:false,
         isBuy:false,//是否为已购客户

pages/user/user.vue

@@ -51,6 +51,15 @@
 				<text class="label">服务截止日期</text>
 				<text class="right-text" v-if="!(userInfo.status=='冻结'||(userInfo.status=='试用'&&userInfo.is_suspend==1))">{{lastTime}}</text>
 			</view>
+			<view class="flex item-card">
+				<image src="../../static/calendar.png" mode="widthFix" />
+				<text class="label">我的问答</text>
+				<text class="hint">1</text>
+				<view class="right-text look" @click="handleToQuestionPage">
+					<text>查看</text>
+					<van-icon name="arrow"></van-icon>
+				</view>
+			</view>
 		</view>
 
 
@@ -141,7 +150,9 @@
 				if(this.userInfo.permission_list.length==0) return
 				uni.navigateTo({ url: '/pages-user/permissionList' })
 			},
-
+			handleToQuestionPage(){
+				uni.navigateTo({url:'/pages-question/answerList'})
+			},
 			handleContact(){
 				apiApplyPermission({
                     company_name:this.userInfo.company_name,
@@ -234,6 +245,16 @@
 				text-align: right;
 				line-height: 100rpx;
 			}
+			.hint{
+				width:30rpx;
+				height:30rpx;
+				background-color: red;
+				color:#fff;
+				text-align: center;
+				line-height: 30rpx;
+				border-radius: 50%;
+				align-self: center;
+			}
 		}
 		.item-card:last-child{
 			border: none;