丰都积分
							
								
								
									
										137
									
								
								src/project/pingchang/AppPointsApply/AppPointsApply.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,137 @@ | ||||
| <template> | ||||
|   <div class="AppPointsApply"> | ||||
|     <div class="points_img" @click="toAdd"> | ||||
|       <img src="./imgs/points.png" alt=""> | ||||
|     </div> | ||||
|     <h3>申请记录</h3> | ||||
|     <div v-if="list.length"> | ||||
|       <div class="card" v-for="(item,index) in list" :key="index" > | ||||
|         <div class="top"> | ||||
|           <div class="top_title">{{ item.applyItem }}</div> | ||||
|           <div><span class="top_status" :class="item.status==0? 'status0' : item.status==1? 'status1': 'status2'">{{ $dict.getLabel('integralDeclareStatus',item.status) }}</span></div> | ||||
|         </div> | ||||
|         <div class="bottom"> | ||||
|           <div class="bottom_points">积分+{{ item.applyIntegral }}</div> | ||||
|           <div class="bottom_time">{{ item.createTime }}</div> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|     <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: 'AppPointsApply', | ||||
|   appName: '积分申请', | ||||
|   data() { | ||||
|     return { | ||||
|       current: 1, | ||||
|       list: [], | ||||
|     } | ||||
|   }, | ||||
|   onShow() { | ||||
|     this.$dict.load('integralDeclareStatus').then(() => { | ||||
|       this.getPointsList() | ||||
|     }) | ||||
|   }, | ||||
|   methods: { | ||||
|     toAdd() { | ||||
|       uni.navigateTo({url: './addPoints'}) | ||||
|     },  | ||||
|     getPointsList() { | ||||
|       this.$http.post(`/app/appintegralmemberapply/listByGirdMember`, null, { | ||||
|         params: { | ||||
|           current: this.current, | ||||
|         } | ||||
|       }).then(res=> { | ||||
|         if(res?.data) { | ||||
|           this.list = this.current > 1 ? [...this.list, ...res.data.records]: res.data.records | ||||
|         } | ||||
|       }) | ||||
|     } | ||||
|   }, | ||||
|   onReachBottom() { | ||||
|     this.current ++ | ||||
|     this.getPointsList() | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .AppPointsApply { | ||||
|   padding: 250px 32px 32px; | ||||
|   box-sizing: border-box; | ||||
|  | ||||
|   .points_img { | ||||
|     padding: 16px 32px; | ||||
|     box-sizing: border-box; | ||||
|     position: fixed; | ||||
|     top: 0; | ||||
|     left: 0; | ||||
|     width: 100%; | ||||
|     background: #F5F5F5; | ||||
|     z-index: 9; | ||||
|     img { | ||||
|       width: 100%; | ||||
|     } | ||||
|   } | ||||
|   h3 { | ||||
|     margin-top: 48px; | ||||
|   } | ||||
|   .card { | ||||
|     margin-top: 24px; | ||||
|     padding: 24px; | ||||
|     box-sizing: border-box; | ||||
|     background: #FFFFFF; | ||||
|     box-shadow: 0 8px 16px 0 rgba(0,0,0,0.02); | ||||
|     border-radius: 16px; | ||||
|     .top { | ||||
|       display: flex; | ||||
|       justify-content: space-between; | ||||
|       .top_title { | ||||
|         width: 450px; | ||||
|         overflow: hidden;  | ||||
|         text-overflow: ellipsis; | ||||
|         display: -webkit-box; | ||||
|         -webkit-box-orient: vertical; | ||||
|         -webkit-line-clamp: 2; | ||||
|         color: #333333; | ||||
|         font-weight: 500; | ||||
|       } | ||||
|       .top_status { | ||||
|         padding: 6px 16px; | ||||
|         box-sizing: border-box; | ||||
|         border-radius: 8px; | ||||
|         text-align: right; | ||||
|         width: calc(100% - 450px); | ||||
|       } | ||||
|       .status0 { | ||||
|         background: #FFEDE2; | ||||
|         color: #FF883C; | ||||
|       } | ||||
|  | ||||
|       .status1 { | ||||
|         background: #E2F6E1; | ||||
|         color: #3BBC37; | ||||
|       } | ||||
|  | ||||
|       .status2 { | ||||
|         background: #FAE2E2; | ||||
|         color: #E23C3C; | ||||
|       } | ||||
|     } | ||||
|     .bottom { | ||||
|       display: flex; | ||||
|       justify-content: space-between; | ||||
|       margin-top: 24px; | ||||
|       .bottom_points { | ||||
|         color: #FF6900; | ||||
|       } | ||||
|       .bottom_time { | ||||
|         color: #999999; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										173
									
								
								src/project/pingchang/AppPointsApply/addPoints.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,173 @@ | ||||
| <template> | ||||
|   <div class="addPoints"> | ||||
|     <div class="item"> | ||||
|       <div class="item_left"><span class="red">*</span><span class="color-666">事件类型</span></div> | ||||
|       <AiSelect dict="integralApplyEventType" v-model="form.eventType"/> | ||||
|     </div> | ||||
|     <div class="item"> | ||||
|       <div class="item_left"><span class="red">*</span><span class="color-666">申请事项</span></div> | ||||
|       <div class="input"><u-input v-model="form.applyItem" type="text" placeholder="请输入" /></div> | ||||
|     </div> | ||||
|  | ||||
|     <div class="item"> | ||||
|       <div class="item_left"><span class="red">*</span><span class="color-666">积分数量</span></div> | ||||
|       <div class="input"><u-input v-model="form.applyIntegral" type="number" disabled placeholder="请输入"/></div> | ||||
|     </div> | ||||
|  | ||||
|     <div class="items"> | ||||
|       <div><span class="red">*</span><span class="color-666">上传图片</span></div> | ||||
|       <AiUploader style="margin-top: 12px;" :def.sync="form.files" :limit="1" action="/admin/file/add2"></AiUploader> | ||||
|     </div> | ||||
|  | ||||
|     <div class="btn"> | ||||
|       <div class="subBtn" @click="submit">提交</div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: 'addPoints', | ||||
|   data() { | ||||
|     return { | ||||
|       value: '', | ||||
|       form: { | ||||
|         eventType: '', | ||||
|         applyItem: '', | ||||
|         applyIntegral: '', | ||||
|         voucherImageUrl: '', | ||||
|         files: [] | ||||
|       }, | ||||
|       flag: false, | ||||
|     } | ||||
|   }, | ||||
|   onLoad(opt) { | ||||
|     document.title = '积分申请' | ||||
|     if(opt) { | ||||
|       this.getDetail(opt.id) | ||||
|     } | ||||
|     this.$dict.load('integralApplyEventType') | ||||
|   }, | ||||
|   watch: { | ||||
|     'form.eventType'(val) { | ||||
|       if(val==0 || val == 1 || val == 5) { | ||||
|         this.form.applyIntegral = 2 | ||||
|       } else if(val == 2 || val == 3 || val == 4) { | ||||
|         this.form.applyIntegral = 5 | ||||
|       } | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     getDetail(id) { | ||||
|       this.$http.post(`/app/appintegralmemberapply/queryDetailById?id=${id}`).then(res=> { | ||||
|         if(res?.data) { | ||||
|           this.form = res.data | ||||
|           this.form.files = [{url:res.data.voucherImageUrl}] | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     submit() { | ||||
|       if(this.flag) return | ||||
|  | ||||
|       if(!this.form.eventType) { | ||||
|         return this.$u.toast('请选择事件类型') | ||||
|       } | ||||
|  | ||||
|       if(!this.form.applyItem) { | ||||
|         return this.$u.toast('请输入申请事项') | ||||
|       } | ||||
|  | ||||
|       if(!this.form.applyIntegral) { | ||||
|         return this.$u.toast('请输入积分数量') | ||||
|       } | ||||
|  | ||||
|       if(this.form.files.length) { | ||||
|         this.form.voucherImageUrl = this.form.files[0].url | ||||
|       } | ||||
|  | ||||
|       this.flag = true | ||||
|       this.$http.post(`/app/appintegralmemberapply/addOrUpdate`,{...this.form}).then(res=> { | ||||
|         if(res.code == 0) { | ||||
|           this.$u.toast('提交成功') | ||||
|           setTimeout(() => { | ||||
|             uni.navigateBack() | ||||
|           }, 400) | ||||
|         } | ||||
|       }).catch(err=> { | ||||
|         this.$u.toast(err.message) | ||||
|       }) | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .addPoints { | ||||
|   padding: 0 16px 120px; | ||||
|   box-sizing: border-box; | ||||
|   font-size: 32px; | ||||
|   .item { | ||||
|     display: flex; | ||||
|     justify-content: space-between; | ||||
|     align-items: center; | ||||
|     margin-top: 24px; | ||||
|     background: #FFF; | ||||
|     box-shadow: inset 0 0 0 0 #EEEEEE; | ||||
|     border-radius: 32px; | ||||
|     padding: 16px 32px; | ||||
|     box-sizing: border-box; | ||||
|     .item_left { | ||||
|       font-size: 32px; | ||||
|       .red { | ||||
|         color: #E64A4A; | ||||
|       } | ||||
|       .color-666 { | ||||
|         color: #666666; | ||||
|       } | ||||
|     } | ||||
|     .input { | ||||
|       width: calc(100% - 200px); | ||||
|     } | ||||
|     ::v-deep .uni-input-input,  | ||||
|     .uni-input-placeholder { | ||||
|       text-align: right; | ||||
|        | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .items { | ||||
|     margin-top: 24px; | ||||
|     background: #FFF; | ||||
|     box-shadow: inset 0 0 0 0 #EEEEEE; | ||||
|     border-radius: 32px; | ||||
|     padding: 16px 32px; | ||||
|     box-sizing: border-box; | ||||
|     .red { | ||||
|       color: #E64A4A; | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .btn { | ||||
|     position: fixed; | ||||
|     bottom: 0; | ||||
|     left: 0; | ||||
|     width: 100%; | ||||
|     background: #F5F5F5; | ||||
|     padding: 16px 32px; | ||||
|     box-sizing: border-box; | ||||
|     height: 120px; | ||||
|     line-height: 120px; | ||||
|     .subBtn { | ||||
|       text-align: center; | ||||
|       color: #FFF; | ||||
|       background: #3975C6; | ||||
|       border-radius: 44px; | ||||
|       width: 100%; | ||||
|       height: 88px; | ||||
|       line-height: 88px; | ||||
|       font-style: 34px; | ||||
|     } | ||||
|   } | ||||
|  | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										
											BIN
										
									
								
								src/project/pingchang/AppPointsApply/imgs/points.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 548 KiB | 
| @@ -0,0 +1,379 @@ | ||||
| <template> | ||||
|   <div class="AppRedemptionPoints"> | ||||
|     <div class="fixed-top"> | ||||
|       <div class="header"> | ||||
|         <div class="num"> | ||||
|           <p>积分余额</p> | ||||
|           <h3>{{total}}</h3> | ||||
|         </div> | ||||
|         <div class="btn" @click="toMyOrder">我的订单</div> | ||||
|       </div> | ||||
|       <div class="search"> | ||||
|         <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="76" font-size="28" bg-color="#fff" inactive-color="#8891A1"  | ||||
|           active-color="#1D2229 " :bar-style="barStyle" @change="changeTab" ></u-tabs> | ||||
|         <div class="type-select"> | ||||
|           <div :class="currentType == index ? 'item active' : 'item'" v-for="(item, index) in typeList" :key="index" @click="typeClick(index)"> | ||||
|             {{item}} | ||||
|             <span v-if="index == 1" class="down-icon">⏷</span> | ||||
|           </div> | ||||
|         </div> | ||||
|         <div class="point-select" v-if="currentType == 1"> | ||||
|           <u-tabs :list="pointTypeList" :is-scroll="true" :current="currentPoint" height="80" font-size="24" bg-color="#fff" inactive-color="#666666"  | ||||
|           active-color="#4181FF" bar-width="0" :bold="false" @change="pointClick" ></u-tabs> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="list-content"> | ||||
|       <div class="left-list"> | ||||
|         <div class="list-info" v-for="(item, index) in leftList" :key="index" v-if="goodsList.length"> | ||||
|           <div class="item" @click="toProductDetail(item)"> | ||||
|             <img :src="item.picUrl" alt=""> | ||||
|             <div class="type" :class="`type`+item.type">{{ $dict.getLabel('integralSGType', item.type) }}</div> | ||||
|             <div class="content"> | ||||
|               <p class="text">{{item.title}}</p> | ||||
|               <div class="item-money"> | ||||
|                 <h3>{{item.integralPrice}}积分</h3> | ||||
|                 <p v-if="item.type == 1">+¥{{item.payMoney}}</p> | ||||
|                 <span v-if="item.type == 1">兑换后再付</span> | ||||
|               </div> | ||||
|               <div v-if="item.shopStatus == 1"> | ||||
|                 <div class="btn" :class="total >= item.integralPrice ? 'btn1' : 'btn0'" @click.stop="toOrder(item)" v-if="item.stock > 0">{{total >= item.integralPrice ? '去兑换' : '积分不足'}}</div> | ||||
|                 <div class="btn btn0" v-else>商品缺货</div> | ||||
|               </div> | ||||
|               <div v-else> | ||||
|                 <div class="btn btn0">店铺停用</div> | ||||
|               </div> | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|       <div class="right-list"> | ||||
|         <div class="list-info" v-for="(item, index) in rightList" :key="index" v-if="goodsList.length"> | ||||
|           <div class="item" @click="toProductDetail(item)"> | ||||
|             <img :src="item.picUrl" alt=""> | ||||
|             <div class="type" :class="`type`+item.type">{{ $dict.getLabel('integralSGType', item.type) }}</div> | ||||
|             <div class="content"> | ||||
|               <p class="text">{{item.title}}</p> | ||||
|               <div class="item-money"> | ||||
|                 <h3>{{item.integralPrice}}积分</h3> | ||||
|                 <p v-if="item.type == 1">+¥{{item.payMoney}}</p> | ||||
|                 <span v-if="item.type == 1">兑换后再付</span> | ||||
|               </div> | ||||
|               <div v-if="item.shopStatus == 1"> | ||||
|                 <div class="btn" :class="total >= item.integralPrice ? 'btn1' : 'btn0'" @click.stop="toOrder(item)" v-if="item.stock > 0">{{total >= item.integralPrice ? '去兑换' : '积分不足'}}</div> | ||||
|                 <div class="btn btn0" v-else>商品缺货</div> | ||||
|               </div> | ||||
|               <div v-else> | ||||
|                 <div class="btn btn0">店铺停用</div> | ||||
|               </div> | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|       <AiEmpty v-if="!goodsList.length"></AiEmpty> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from "vuex"; | ||||
|  | ||||
| export default { | ||||
|   name: 'AppRedemptionPoints', | ||||
|   appName: '积分兑换', | ||||
|   data() { | ||||
|     return { | ||||
|       tabList: [{name: '全部'}, {name: '免费兑'}, {name: '京东低价商品'}], | ||||
|       currentTabs: 0, | ||||
|       barStyle: { | ||||
|         'width': '20px', | ||||
|         'height': '3px', | ||||
|         'border-radius': '2px', | ||||
|         'bottom': '-3px', | ||||
|         'background': '#2D7DFF' | ||||
|       }, | ||||
|       typeList: ['最新上架', '积分', '我可兑换的'], | ||||
|       currentType: 0, | ||||
|       pointTypeList: [{name: '全部'}, {name: '50分以下'},  {name: '100分以下'},  {name: '200分以下'},  {name: '5000分以下'}], | ||||
|       currentPoint: 0, | ||||
|       goodsList: [], | ||||
|       leftList: [], | ||||
|       rightList: [], | ||||
|       total: 0, | ||||
|       current: 1, | ||||
|       openId: '', | ||||
|       integralUserId: '', | ||||
|       userId: '' | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     this.openId = option.openId | ||||
|     this.userId = option.userId | ||||
|     this.integralUserId = option.integralUserId | ||||
|     this.getTotal() | ||||
|     this.$dict.load(['integralSGType']).then(() => { | ||||
|       this.getList() | ||||
|     }) | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '积分代兑换' | ||||
|     this.getTotal() | ||||
|   }, | ||||
|   methods: { | ||||
|     getTotal() { | ||||
|       this.$http.post(`/app/appintegraluser/integralUserInfoFD`).then(res => { | ||||
|         if (res?.data) { | ||||
|           this.total = res.data.integral || 0 | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     getListInit() { | ||||
|       this.goodsList = [] | ||||
|       this.leftList = [] | ||||
|       this.rightList = [] | ||||
|       this.current = 1 | ||||
|       this.getList() | ||||
|     }, | ||||
|     getList() { | ||||
|       this.$http.post(`/app/appintegralsupermarketshop/goodsListWXCP`, null, { | ||||
|         params: { | ||||
|           goodsType: this.currentTabs,  //商品类型,0:全部、1:免费兑、2:京东低价商品,默认0 | ||||
|           orderType: this.currentType == 0 ? 1 : 0,  //排序类型,0:积分升序、1:上架时间倒序,默认0 | ||||
|           filterIntegral: this.currentType == 2 ? true : false,  //过滤我可兑换的,默认false | ||||
|           integralRange: this.currentType == 1 ? this.currentPoint : '',  //积分区间类型,0:全部、1:50分以下、2:100分以下、3:200分以下、4:5000分以下默认0 | ||||
|           current: this.current, | ||||
|           userId: this.userId, | ||||
|           openId: this.openId | ||||
|         } | ||||
|       }).then(res => { | ||||
|         if (res.code === 0) { | ||||
|           this.goodsList = this.current == 1 ? res.data.records : [...this.goodsList, ...res.data.records] | ||||
|           res.data.records.map((item, index) => { | ||||
|             if(index%2 ==0) { | ||||
|               this.leftList.push(item) | ||||
|             }else { | ||||
|               this.rightList.push(item) | ||||
|             } | ||||
|           }) | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     changeTab(index) { | ||||
|       this.currentTabs = index | ||||
|       this.getListInit() | ||||
|     }, | ||||
|     typeClick(index) { | ||||
|       this.currentType = index | ||||
|       this.getListInit() | ||||
|     }, | ||||
|     pointClick(index) { | ||||
|       this.currentPoint = index | ||||
|       this.getListInit() | ||||
|     }, | ||||
|     toProductDetail(item) { | ||||
|       uni.navigateTo({url: `./productDetails?shopGoodsId=${item.shopGoodsId}&total=${this.total}&userId=${this.userId}`}) | ||||
|     }, | ||||
|     toMyOrder() { | ||||
|       uni.navigateTo({url: `./myOrderList?userId=${this.userId}`}) | ||||
|     }, | ||||
|     toOrder(item) { | ||||
|       if(this.total >= item.integralPrice && item.stock > 0) { | ||||
|         uni.navigateTo({url: `./placeOrder?shopGoodsId=${item.shopGoodsId}&total=${this.total}&backLevel=3&userId=${this.userId}`}) | ||||
|       } | ||||
|     }, | ||||
|   }, | ||||
|   onReachBottom() { | ||||
|     this.current ++ | ||||
|     this.getList() | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .AppRedemptionPoints { | ||||
|   .fixed-top { | ||||
|     background-color: #f3f6f9; | ||||
|     position: fixed; | ||||
|     top: 0; | ||||
|     left: 0; | ||||
|     z-index: 2; | ||||
|   } | ||||
|   .header { | ||||
|     display: flex; | ||||
|     justify-content: space-between; | ||||
|     padding: 32px 24px; | ||||
|     background-color: #fff; | ||||
|     margin-bottom: 24px; | ||||
|     .num { | ||||
|       p { | ||||
|         font-family: PingFangSC-Regular; | ||||
|         font-weight: 400; | ||||
|         font-size: 24px; | ||||
|         color: #999; | ||||
|         line-height: 34px; | ||||
|       } | ||||
|       h3 { | ||||
|         font-family: PingFangSC-SNaNpxibold; | ||||
|         font-weight: 600; | ||||
|         font-size: 66px; | ||||
|         color: #FF6900; | ||||
|         line-height: 92px; | ||||
|       } | ||||
|     } | ||||
|     .btn { | ||||
|       width: 168px; | ||||
|       height: 64px; | ||||
|       border: 1px solid #4181FF; | ||||
|       line-height: 62px; | ||||
|       border-radius: 44px; | ||||
|       box-sizing: border-box; | ||||
|       text-align: center; | ||||
|       font-family: PingFangSC-Medium; | ||||
|       font-weight: 500; | ||||
|       font-size: 26px; | ||||
|       color: #4181FF; | ||||
|       margin-top: 28px; | ||||
|     } | ||||
|   } | ||||
|   .search { | ||||
|     background-color: #fff; | ||||
|     .type-select { | ||||
|       display: flex;  | ||||
|       border-top: 1px solid #D8D8D8; | ||||
|       line-height: 84px; | ||||
|       .item { | ||||
|         flex: 1; | ||||
|         text-align: center; | ||||
|         font-family: PingFangSC-Regular; | ||||
|         font-size: 26px; | ||||
|         color: #8891A1; | ||||
|         .down-icon { | ||||
|           display: inline-block; | ||||
|           margin-left: 8px; | ||||
|           transition: all 0.3s ease-in-out; | ||||
|           transform: rotate(0deg); | ||||
|         } | ||||
|       } | ||||
|       .active { | ||||
|         color: #4181FF; | ||||
|         .down-icon { | ||||
|           transform: rotate(180deg); | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   .list-content { | ||||
|     padding: 396px 0 24px 24px; | ||||
|     background-color: #f3f6f9; | ||||
|     overflow: hidden; | ||||
|     .left-list, | ||||
|     .right-list { | ||||
|       width: 50%; | ||||
|       float: left; | ||||
|     } | ||||
|     .list-info { | ||||
|       width: 100%; | ||||
|     } | ||||
|     .item { | ||||
|       width: calc(100% - 24px); | ||||
|       background-color: #fff; | ||||
|       border-radius: 20px; | ||||
|       position: relative; | ||||
|       margin-bottom: 24px; | ||||
|       img { | ||||
|         width: 100%; | ||||
|         height: 340px; | ||||
|         border-top-left-radius: 20px; | ||||
|         border-top-right-radius: 20px; | ||||
|       } | ||||
|       .type { | ||||
|         padding: 8px 16px; | ||||
|         font-family: PingFangSC-Regular; | ||||
|         font-size: 20px; | ||||
|         line-height: 28px; | ||||
|         color: #FFF; | ||||
|         border-top-right-radius: 20px; | ||||
|         border-bottom-left-radius: 20px; | ||||
|         position: absolute; | ||||
|         top: 0; | ||||
|         right: 0; | ||||
|       } | ||||
|       .type1 { | ||||
|         background-color: #E64E39; | ||||
|       } | ||||
|       .type0 { | ||||
|         background-color: #FF6900; | ||||
|       } | ||||
|       .content { | ||||
|         padding: 16px 16px 24px; | ||||
|         position: relative; | ||||
|         background-color: #fff; | ||||
|         .text { | ||||
|           font-family: PingFangSC-SNaNpxibold; | ||||
|           font-weight: 600; | ||||
|           font-size: 26px; | ||||
|           color: #222; | ||||
|           line-height: 38px; | ||||
|           text-overflow: -o-ellipsis-lastline; | ||||
|           overflow: hidden; | ||||
|           text-overflow: ellipsis; | ||||
|           display: -webkit-box; | ||||
|           -webkit-line-clamp: 2; | ||||
|           line-clamp: 2;					 | ||||
|           -webkit-box-orient: vertical; | ||||
|           margin-bottom: 12px; | ||||
|         } | ||||
|         .item-money { | ||||
|           width: calc(100% - 160px); | ||||
|           h3 { | ||||
|             font-family: PingFangSC-SNaNpxibold; | ||||
|             font-weight: 600; | ||||
|             font-size: 34px; | ||||
|             color: #FF6900; | ||||
|             line-height: 48px; | ||||
|           } | ||||
|           p { | ||||
|             font-family: PingFangSC; | ||||
|             font-weight: 600; | ||||
|             font-size: 26px; | ||||
|             color: #4181FF; | ||||
|           } | ||||
|           span { | ||||
|             display: inline-block; | ||||
|             font-family: PingFangSC-Regular; | ||||
|             font-weight: 400; | ||||
|             font-size: 20px; | ||||
|             color: #4181FF; | ||||
|             line-height: 22px; | ||||
|           } | ||||
|         } | ||||
|         .btn { | ||||
|           padding: 14px 32px; | ||||
|           font-family: PingFangSC-Medium; | ||||
|           font-weight: 500; | ||||
|           font-size: 22px; | ||||
|           line-height: 28px; | ||||
|           border-radius: 44px; | ||||
|           position: absolute; | ||||
|           bottom: 24px; | ||||
|           right: 16px; | ||||
|         } | ||||
|         .btn1 { | ||||
|           background-color: #2D7DFF; | ||||
|           color: #FFF; | ||||
|         } | ||||
|         .btn0 { | ||||
|           background-color: #E2E2E2; | ||||
|           color: #666; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|     .item:nth-of-type(2n-1) { | ||||
|       margin-right: 22px; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										
											BIN
										
									
								
								src/project/pingchang/AppRedemptionPoints/img/success.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 19 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/project/pingchang/AppRedemptionPoints/img/user-img.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 2.4 KiB | 
							
								
								
									
										20
									
								
								src/project/pingchang/AppRedemptionPoints/jdH5.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,20 @@ | ||||
| <template> | ||||
|   <div class="jdH5"> | ||||
|     <web-view :src="goodsJdUrl"></web-view> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
|  | ||||
| export default { | ||||
|   name: 'jdH5', | ||||
|   data() { | ||||
|     return { | ||||
|       goodsJdUrl: '' | ||||
|     } | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     this.goodsJdUrl = option.goodsJdUrl | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
							
								
								
									
										306
									
								
								src/project/pingchang/AppRedemptionPoints/myOrderList.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,306 @@ | ||||
| <template> | ||||
|   <div class="myOrderList"> | ||||
|     <div class="fixed-top"> | ||||
|       <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="90" font-size="28" bg-color="#fff" inactive-color="#8891A1"  | ||||
|           active-color="#1D2229 " :bar-style="barStyle" @change="changeTab" ></u-tabs> | ||||
|     </div> | ||||
|     <div class="list-content" v-if="list.length"> | ||||
|       <div class="item" v-for="(item, index) in list" :key="index"> | ||||
|         <div class="time-flex"> | ||||
|           <p>{{item.createTime.substring(0, 16)}}</p> | ||||
|           <div :class="`status`+item.status">{{ $dict.getLabel('integralSGOStatus', item.status) }}</div> | ||||
|         </div> | ||||
|         <div class="flex"> | ||||
|           <img :src="item.goodsPicUrl" alt=""> | ||||
|           <div class="type" :class="`type`+item.goodsType">{{ $dict.getLabel('integralSGType', item.goodsType) }}</div> | ||||
|           <div class="flex-right"> | ||||
|             <p>{{item.goodsTitle}}</p> | ||||
|             <div class="num-flex"> | ||||
|               <h3>{{item.usedIntegral}}积分<span v-if="item.goodsType == 1">+{{item.payMoney}}元</span></h3> | ||||
|               <div>x {{item.quantity}}</div> | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|         <p class="tips" v-if="item.goodsType == 1"><span>兑换成功后,点击「去购买」前往京东低价购买</span></p> | ||||
|          <p class="tips" v-else>免费兑换商品,可到固定的兑换点进行「核销兑换」</p> | ||||
|         <p class="remark" v-if="item.remarks">备注:{{item.remarks}}</p> | ||||
|         <div class="flex-btn" v-if="item.goodsType == 1 && item.status != 2"> | ||||
|           <p></p> | ||||
|           <div class="btn confirm" @click="openJd(item)">去购买</div> | ||||
|         </div> | ||||
|         <div class="flex-btn" v-else> | ||||
|           <p>核销码:<span>{{item.verificationCode}}</span></p> | ||||
|           <div class="btn" v-if="item.status == 0" @click="cancel(item)">取消订单</div> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|     <AiEmpty class="pad-t112" v-else></AiEmpty> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from "vuex"; | ||||
|  | ||||
| export default { | ||||
|   name: 'myOrderList', | ||||
|   appName: '我的订单', | ||||
|   data() { | ||||
|     return { | ||||
|       tabList: [{name: '全部'}, {name: '待核销'}, {name: '已完成'}, {name: '已取消'}], | ||||
|       currentTabs: 0, | ||||
|       barStyle: { | ||||
|         'width': '20px', | ||||
|         'height': '3px', | ||||
|         'border-radius': '2px', | ||||
|         'bottom': '3px', | ||||
|         'background': '#2D7DFF' | ||||
|       }, | ||||
|       list: [], | ||||
|       current: 1, | ||||
|       userId: '' | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     this.userId = option.userId | ||||
|     this.$dict.load(['integralSGOStatus', 'integralSGType']).then(() => { | ||||
|       this.getList() | ||||
|     }) | ||||
|   }, | ||||
|   methods: { | ||||
|     changeTab(index) { | ||||
|       this.currentTabs = index | ||||
|       this.getListInit() | ||||
|     }, | ||||
|     getListInit() { | ||||
|       this.current = 1 | ||||
|       this.getList() | ||||
|     }, | ||||
|     getList() { | ||||
|       this.$http.post(`/app/appintegralsupermarketorder/listForXCX`, null, { | ||||
|         params: { | ||||
|           current: this.current, | ||||
|           status: this.currentTabs == 0 ? '' : this.currentTabs - 1, | ||||
|           createUserId: this.userId | ||||
|         } | ||||
|       }).then(res => { | ||||
|         if (res.code === 0) { | ||||
|           this.list = this.current == 1 ? res.data.records : [...this.list, ...res.data.records] | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     openJd(item) { | ||||
|       uni.navigateTo({url: `./jdH5?goodsJdUrl=${item.goodsJdUrl}`}) | ||||
|     }, | ||||
|     cancel(item) { | ||||
|       uni.showModal({ | ||||
|         title: '确认取消此订单?', | ||||
|         content: '取消订单后,积分将退回至积分余额', | ||||
|         confirmColor: "#2D7DFF", | ||||
|         cancelColor: "#2D7DFF", | ||||
|         cancelText: "我在想想", | ||||
|         confirmText: "确认取消",  | ||||
|         success: (res) => { | ||||
|           if (res.confirm) { | ||||
|             this.cancelOrder(item) | ||||
|           } | ||||
|         } | ||||
|       }); | ||||
|     }, | ||||
|     cancelOrder(item) { | ||||
|       this.$http.post(`/app/appintegralsupermarketorder/cancelForXCX?id=${item.id}`).then(res => { | ||||
|         if (res.code === 0) { | ||||
|           this.getListInit() | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|   }, | ||||
|   onReachBottom() { | ||||
|     this.current = this.current + 1 | ||||
|     this.getList() | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .myOrderList { | ||||
|   min-height: 100%; | ||||
|   .fixed-top { | ||||
|     background-color: #fff; | ||||
|     position: fixed; | ||||
|     top: 0; | ||||
|     left: 0; | ||||
|     z-index: 2; | ||||
|   } | ||||
|   .list-content { | ||||
|     padding: 112px 24px 24px; | ||||
|     background-color: #F3F6F9; | ||||
|     .item { | ||||
|       width: 100%; | ||||
|       background: #FFF; | ||||
|       border-radius: 16px; | ||||
|       margin-bottom: 32px; | ||||
|       .time-flex { | ||||
|         padding: 0 32px; | ||||
|         line-height: 64px; | ||||
|         font-family: PingFangSC-Regular; | ||||
|         font-size: 24px; | ||||
|         color: #666; | ||||
|         display: flex; | ||||
|         justify-content: space-between; | ||||
|         border-bottom: 1px solid #ddd; | ||||
|         div { | ||||
|           color: #2D7DFF; | ||||
|         } | ||||
|         .status2 { | ||||
|           color: #999; | ||||
|         } | ||||
|       } | ||||
|       .flex { | ||||
|         padding: 32px 32px 0; | ||||
|         display: flex; | ||||
|         position: relative; | ||||
|         margin-bottom: 20px; | ||||
|         img { | ||||
|           width: 166px; | ||||
|           height: 166px; | ||||
|           border-radius: 16px; | ||||
|           margin-right: 20px; | ||||
|         } | ||||
|         .type { | ||||
|           position: absolute; | ||||
|           left: 32px; | ||||
|           bottom: 0; | ||||
|           border-bottom-left-radius: 16px; | ||||
|           border-bottom-right-radius: 16px; | ||||
|           width: 166px; | ||||
|           text-align: center; | ||||
|           line-height: 34px; | ||||
|           font-family: PingFangSC-Regular; | ||||
|           font-size: 18px; | ||||
|           color: #FFF; | ||||
|           p { | ||||
|             scale: 0.9; | ||||
|           } | ||||
|         } | ||||
|         .type1 { | ||||
|           background-color: #E64E39; | ||||
|         } | ||||
|         .type0 { | ||||
|           background-color: #FF6900; | ||||
|         } | ||||
|         .flex-right { | ||||
|           width: calc(100% - 186px); | ||||
|           p { | ||||
|             word-break: break-all; | ||||
|             font-family: PingFangSC-Regular; | ||||
|             font-size: 26px; | ||||
|             color: #222; | ||||
|             line-height: 34px; | ||||
|             text-overflow: -o-ellipsis-lastline; | ||||
|             overflow: hidden; | ||||
|             text-overflow: ellipsis; | ||||
|             display: -webkit-box; | ||||
|             -webkit-line-clamp: 2; | ||||
|             line-clamp: 2;					 | ||||
|             -webkit-box-orient: vertical; | ||||
|             margin-bottom: 50px; | ||||
|           } | ||||
|           .num-flex { | ||||
|             display: flex; | ||||
|             h3 { | ||||
|               width: calc(100% - 100px); | ||||
|               font-family: PingFangSC-SNaNpxibold; | ||||
|               font-weight: 600; | ||||
|               font-size: 34px; | ||||
|               color: #FF6900; | ||||
|               line-height: 48px; | ||||
|               span { | ||||
|                 display: inline-block; | ||||
|                 font-size: 34px; | ||||
|                 color: #4181FF; | ||||
|                 margin-left: 8px; | ||||
|               } | ||||
|             } | ||||
|             div { | ||||
|               width: 100px; | ||||
|               text-align: right; | ||||
|               font-family: PingFangSC-SNaNpxibold; | ||||
|               font-weight: 600; | ||||
|               font-size: 24px; | ||||
|               color: #222; | ||||
|               line-height: 48px; | ||||
|             } | ||||
|           } | ||||
|            | ||||
|         } | ||||
|       } | ||||
|       .tips { | ||||
|         display: inline-block; | ||||
|         padding: 12px; | ||||
|         line-height: 36px; | ||||
|         background: #F5FCF5; | ||||
|         border-radius: 16px; | ||||
|         font-family: PingFangSC-Regular; | ||||
|         font-size: 24px; | ||||
|         color: #3BBC37; | ||||
|         margin: 0 32px 16px 32px; | ||||
|         span { | ||||
|           display: inline-block; | ||||
|           scale: 0.9; | ||||
|         } | ||||
|       } | ||||
|       .remark { | ||||
|         font-family: PingFangSC-Regular; | ||||
|         font-size: 24px; | ||||
|         color: #666; | ||||
|         line-height: 34px; | ||||
|         word-break: break-all; | ||||
|         margin: 0 32px 24px 32px; | ||||
|       } | ||||
|       .flex-btn { | ||||
|         padding: 0 32px 32px; | ||||
|         display: flex; | ||||
|         justify-content: space-between; | ||||
|         p { | ||||
|           height: 56px; | ||||
|           line-height: 56px; | ||||
|           font-family: PingFangSC-Regular; | ||||
|           font-size: 24px; | ||||
|           color: #666; | ||||
|           span { | ||||
|             display: inline-block; | ||||
|             font-family: PingFangSC-SNaNpxibold; | ||||
|             font-weight: 600; | ||||
|             font-size: 28px; | ||||
|             color: #2D7DFF; | ||||
|             margin-left: 8px; | ||||
|           } | ||||
|         } | ||||
|         .btn { | ||||
|           width: 136px; | ||||
|           text-align: center; | ||||
|           line-height: 54px; | ||||
|           border: 1px solid #CCC; | ||||
|           border-radius: 44px; | ||||
|           font-family: PingFangSC-Regular; | ||||
|           font-size: 22px; | ||||
|           color: #666; | ||||
|         } | ||||
|         .confirm { | ||||
|           border: 1px solid #2D7DFF; | ||||
|           background-color: #2D7DFF; | ||||
|           color: #fff; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   .pad-t112 { | ||||
|     padding-top: 112px; | ||||
|   } | ||||
|  | ||||
|    | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										292
									
								
								src/project/pingchang/AppRedemptionPoints/placeOrder.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,292 @@ | ||||
| <template> | ||||
|   <div class="placeOrder"> | ||||
|     <div class="header-info"> | ||||
|       <div class="flex"> | ||||
|         <img :src="goodsInfo.picUrl" alt=""> | ||||
|         <div class="type" :class="`type`+goodsInfo.type">{{ $dict.getLabel('integralSGType', goodsInfo.type) }}</div> | ||||
|         <div class="flex-right"> | ||||
|           <p>{{goodsInfo.title}}</p> | ||||
|           <div> | ||||
|             <u-number-box v-model="goodsNum" @change="valChange" input-height="44" size="24" :min="1" :max="goodsInfo.stock"></u-number-box> | ||||
|           </div> | ||||
|           <h3>{{goodsInfo.integralPrice}}积分<span v-if="goodsInfo.type == 1">+¥{{goodsInfo.payMoney}}.00</span></h3> | ||||
|         </div> | ||||
|       </div> | ||||
|       <p class="tips" v-if="goodsInfo.type == 1">兑换成功后,点击「去购买」前往京东低价购买</p> | ||||
|       <p class="tips" v-else>免费兑换商品,可到固定的兑换点进行「核销兑换」</p> | ||||
|     </div> | ||||
|     <div class="content"> | ||||
|       <div class="item-flex" @click="show=true"> | ||||
|         <div class="label">订单备注</div> | ||||
|         <div class="value" :class="value ? '' : 'color-999'">{{value || '无备注'}}<u-icon name="arrow-right" color="#bbb" size="24"></u-icon></div> | ||||
|       </div> | ||||
|       <div class="item-flex"> | ||||
|         <div class="label">积分余额</div> | ||||
|         <div class="value color-FF6900">{{total}}积分</div> | ||||
|       </div> | ||||
|       <div class="item-flex"> | ||||
|         <div class="label">支付积分</div> | ||||
|         <div class="value">减{{(goodsNum*goodsInfo.integralPrice).toFixed(2)}}积分</div> | ||||
|       </div> | ||||
|       <div class="item-flex" v-if="goodsInfo.type == 1"> | ||||
|         <div class="label">京东支付</div> | ||||
|         <div class="value color-999">¥{{(goodsNum*goodsInfo.payMoney).toFixed(2)}}</div> | ||||
|       </div> | ||||
|     </div> | ||||
|     <u-popup v-model="show" mode="bottom"> | ||||
|       <div class="textarea"> | ||||
|         <u-input v-model="value" type="textarea" :height="120" :auto-height="true" placeholder="请输入备注" :clearable="false" maxlength="1000" /> | ||||
|         <p>字数{{value.length}}/1000</p> | ||||
|       </div> | ||||
|       <div class="btn"> | ||||
|         <span @click="value=''">清空内容</span> | ||||
|         <span class="confirm" @click="confirm">保存</span> | ||||
|       </div> | ||||
|     </u-popup> | ||||
|     <div class="bottom-btn" @click="confirmOrder()"> | ||||
|       <div>提交订单</div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from "vuex"; | ||||
|  | ||||
| export default { | ||||
|   name: 'placeOrder', | ||||
|   appName: '提交订单', | ||||
|   data() { | ||||
|     return { | ||||
|       value: '', | ||||
|       show: false, | ||||
|       total: 0, | ||||
|       goodsInfo: {}, | ||||
|       goodsNum: 1, | ||||
|       backLevel: 0, | ||||
|       userId: '' | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     this.userId = option.userId | ||||
|     this.shopGoodsId = option.shopGoodsId | ||||
|     this.total = option.total | ||||
|     this.backLevel = option.backLevel | ||||
|     this.$dict.load(['integralSGType']).then(() => { | ||||
|       this.getDetail() | ||||
|     }) | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '提交订单' | ||||
|   }, | ||||
|   methods: { | ||||
|     getDetail() { | ||||
|       this.$http.post(`/app/appintegralsupermarketshop/queryGoodsInfoXCX?shopGoodsId=${this.shopGoodsId}`).then(res => { | ||||
|         if (res.code === 0) { | ||||
|           this.goodsInfo = res.data | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     valChange(e) { | ||||
|       this.goodsNum = e.value | ||||
|     }, | ||||
|     confirm() { | ||||
|       this.show = false | ||||
|     }, | ||||
|     confirmOrder() { | ||||
|       this.$http.post(`/app/appintegralsupermarketorder/addWXCP`,  { | ||||
|         shopId: this.goodsInfo.shopId, | ||||
|         goodsId: this.goodsInfo.id, | ||||
|         remarks: this.value, | ||||
|         quantity: this.goodsNum, | ||||
|         createUserId: this.userId | ||||
|       }).then(res => { | ||||
|         if (res.code === 0) { | ||||
|           this.toSuccess() | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     toSuccess() { | ||||
|       var integralPrice = this.goodsNum*this.goodsInfo.integralPrice | ||||
|       uni.navigateTo({url: `./successOrder?isFree=${this.goodsInfo.type}&integralPrice=${integralPrice}&backLevel=${this.backLevel}&goodsJdUrl=${this.goodsInfo.jdUrl}`}) | ||||
|     } | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .placeOrder { | ||||
|   .header-info { | ||||
|     padding: 48px 32px; | ||||
|     background-color: #fff; | ||||
|     margin-bottom: 24px; | ||||
|     .flex { | ||||
|       margin-bottom: 32px; | ||||
|       display: flex; | ||||
|       position: relative; | ||||
|       img { | ||||
|         width: 166px; | ||||
|         height: 166px; | ||||
|         border-radius: 16px; | ||||
|         margin-right: 20px; | ||||
|       } | ||||
|       .type { | ||||
|         position: absolute; | ||||
|         left: 0; | ||||
|         bottom: 0; | ||||
|         border-bottom-left-radius: 16px; | ||||
|         border-bottom-right-radius: 16px; | ||||
|         width: 166px; | ||||
|         text-align: center; | ||||
|         line-height: 34px; | ||||
|         font-family: PingFangSC-Regular; | ||||
|         font-size: 18px; | ||||
|         color: #FFF; | ||||
|         p { | ||||
|           scale: 0.9; | ||||
|         } | ||||
|       } | ||||
|       .type1 { | ||||
|         background-color: #E64E39; | ||||
|       } | ||||
|       .type0 { | ||||
|         background-color: #FF6900; | ||||
|       } | ||||
|       .flex-right { | ||||
|         width: calc(100% - 186px); | ||||
|         p { | ||||
|           word-break: break-all; | ||||
|           font-family: PingFangSC-Regular; | ||||
|           font-size: 26px; | ||||
|           color: #222; | ||||
|           line-height: 34px; | ||||
|           text-overflow: -o-ellipsis-lastline; | ||||
|           overflow: hidden; | ||||
|           text-overflow: ellipsis; | ||||
|           display: -webkit-box; | ||||
|           -webkit-line-clamp: 2; | ||||
|           line-clamp: 2;					 | ||||
|           -webkit-box-orient: vertical; | ||||
|           margin-bottom: 22px; | ||||
|         } | ||||
|         div { | ||||
|           text-align: right; | ||||
|         } | ||||
|         h3 { | ||||
|           font-family: PingFangSC-SNaNpxibold; | ||||
|           font-weight: 600; | ||||
|           font-size: 34px; | ||||
|           color: #FF6900; | ||||
|           line-height: 48px; | ||||
|           span { | ||||
|             display: inline-block; | ||||
|             font-size: 34px; | ||||
|             color: #4181FF; | ||||
|             margin-left: 8px; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|     .tips { | ||||
|       display: inline-block; | ||||
|       padding: 12px; | ||||
|       line-height: 36px; | ||||
|       background: #F5FCF5; | ||||
|       border-radius: 16px; | ||||
|       font-family: PingFangSC-Regular; | ||||
|       font-size: 24px; | ||||
|       color: #3BBC37; | ||||
|       span { | ||||
|         display: inline-block; | ||||
|         scale: 0.9; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   .content { | ||||
|     padding: 0 32px; | ||||
|     background-color: #fff; | ||||
|     .item-flex { | ||||
|       display: flex; | ||||
|       padding: 30px 0; | ||||
|       font-size: 26px; | ||||
|       line-height: 34px; | ||||
|       font-family: PingFangSC-Regular; | ||||
|       .label { | ||||
|         color: #222; | ||||
|         width: 120px; | ||||
|       } | ||||
|       .value { | ||||
|         width: calc(100% - 120px); | ||||
|         text-align: right; | ||||
|         color: #222; | ||||
|       } | ||||
|       .color-FF6900 { | ||||
|         color: #FF6900; | ||||
|       } | ||||
|       .color-999 { | ||||
|         color: #999; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   .textarea { | ||||
|     margin: 32px 32px 24px; | ||||
|     width: calc(100% - 64px); | ||||
|     padding: 16px; | ||||
|     box-sizing: border-box; | ||||
|     background: #f7f7f7; | ||||
|     border-radius: 8px; | ||||
|     p { | ||||
|       font-size: 26px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       color: #999; | ||||
|       line-height: 36px; | ||||
|       text-align: right; | ||||
|     } | ||||
|   } | ||||
|   .btn { | ||||
|     padding: 0 32px 24px; | ||||
|     height: 64px; | ||||
|     display: flex; | ||||
|     justify-content: space-between; | ||||
|     span { | ||||
|       display: inline-block; | ||||
|       line-height: 64px; | ||||
|       font-size: 26px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       color: #666; | ||||
|     } | ||||
|     .confirm { | ||||
|       width: 144px; | ||||
|       text-align: center; | ||||
|       background: #1365dd; | ||||
|       border-radius: 32px; | ||||
|       font-size: 28px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       color: #fff; | ||||
|     } | ||||
|   } | ||||
|   .bottom-btn { | ||||
|     position: fixed; | ||||
|     left: 0; | ||||
|     bottom: 0; | ||||
|     width: 100%; | ||||
|     background-color: #fff; | ||||
|     padding: 20px 32px; | ||||
|     box-sizing: border-box; | ||||
|     div { | ||||
|       width: 100%; | ||||
|       height: 88px; | ||||
|       line-height: 88px; | ||||
|       text-align: center; | ||||
|       border-radius: 44px; | ||||
|       font-family: PingFangSC-Medium; | ||||
|       font-weight: 500; | ||||
|       font-size: 34px; | ||||
|       color: #FFF; | ||||
|       background: #4181FF; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										165
									
								
								src/project/pingchang/AppRedemptionPoints/pointsPublicity.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,165 @@ | ||||
| <template> | ||||
|   <div class="pointsPublicity"> | ||||
|     <div class="header"> | ||||
|       <img :src="`${cdn}/publicity-header.png`" alt=""> | ||||
|       <div class="title">{{user.girdName}}积分公示</div> | ||||
|     </div> | ||||
|     <div class="list-content" v-if="list.length"> | ||||
|       <div class="item" v-for="(item, index) in list" :key="index"> | ||||
|         <span class="blue-tips"></span> | ||||
|         <p class="title">{{item.classOne}}</p> | ||||
|         <div class="item-info"> | ||||
|           <p class="mini-title">{{item.classTwo}}</p> | ||||
|           <div class="text-flex"> | ||||
|             <p>{{item.classThree}}</p> | ||||
|             <div> | ||||
|               <img :src="`${cdn}/star-icon.png`" alt="">+{{item.integral}} | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|     <AiEmpty v-else></AiEmpty> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapActions, mapState} from "vuex"; | ||||
|  | ||||
| export default { | ||||
|   name: 'pointsPublicity', | ||||
|   appName: '积分公示', | ||||
|   data() { | ||||
|     return { | ||||
|       cdn: "https://cdn.cunwuyun.cn/fengdu", | ||||
|       list: [], | ||||
|       current: 1 | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|   }, | ||||
|   onLoad() { | ||||
|     this.getAuth() | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '积分公示' | ||||
|   }, | ||||
|   methods: { | ||||
|     ...mapActions(['getUserInfo']), | ||||
|     getList() { | ||||
|       this.$http.post(`/app/appintegralpublicityinfo/list?current=${this.current}&girdId=${this.user.girdId}`).then(res => { | ||||
|         if (res.code === 0) { | ||||
|           this.list = this.current == 1 ? res.data.records : [...this.list, ...res.data.records] | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     getAuth() { | ||||
|       this.$nextTick(() => { | ||||
|         this.getUserInfo('qujing') | ||||
|         this.getList() | ||||
|       }) | ||||
|     }, | ||||
|   }, | ||||
|   onReachBottom() { | ||||
|     this.current++ | ||||
|     this.getList() | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| uni-page-body{ | ||||
|   background-color: #fff; | ||||
| } | ||||
| .pointsPublicity { | ||||
|   .header { | ||||
|     // position: fixed; | ||||
|     // top: 0; | ||||
|     // left: 0; | ||||
|     width: 100%; | ||||
|     img { | ||||
|       width: 100%; | ||||
|       height: 216px; | ||||
|     } | ||||
|     .title { | ||||
|       font-family: PingFangSC-Medium; | ||||
|       font-weight: 500; | ||||
|       font-size: 34px; | ||||
|       color: #222; | ||||
|       line-height: 40px; | ||||
|       padding: 38px 32px; | ||||
|     } | ||||
|   } | ||||
|   .list-content { | ||||
|     padding: 0 32px; | ||||
|     .item { | ||||
|       width: 100%; | ||||
|       background: #FFF; | ||||
|       box-shadow: inset 0 0 0 0 #EEEEEE; | ||||
|       padding: 32px 32px 0; | ||||
|       box-sizing: border-box; | ||||
|       position: relative; | ||||
|       margin-bottom: 24px; | ||||
|       .blue-tips { | ||||
|         position: absolute; | ||||
|         top: 34px; | ||||
|         left: 0; | ||||
|         width: 8px; | ||||
|         height: 36px; | ||||
|         background: #2D7DFF; | ||||
|         border-radius: 4px; | ||||
|       } | ||||
|       .title { | ||||
|         font-family: PingFangSC-Medium; | ||||
|         font-weight: 500; | ||||
|         font-size: 34px; | ||||
|         color: #333; | ||||
|         line-height: 40px; | ||||
|         word-break: break-all; | ||||
|       } | ||||
|       .item-info { | ||||
|         width: 100%; | ||||
|         padding: 32px 0; | ||||
|         border-top: 1px solid #eee; | ||||
|         .mini-title { | ||||
|           font-family: PingFangSC-Regular; | ||||
|           font-size: 34px; | ||||
|           color: #333; | ||||
|           line-height: 40px; | ||||
|           word-break: break-all; | ||||
|           margin-bottom: 14px; | ||||
|         } | ||||
|         .text-flex { | ||||
|           display: flex; | ||||
|           width: 100%; | ||||
|           p { | ||||
|             width: calc(100% - 160px); | ||||
|             font-family: PingFangSC-Regular; | ||||
|             font-size: 26px; | ||||
|             color: #666; | ||||
|             word-break: break-all; | ||||
|           } | ||||
|           div { | ||||
|             width: 160px; | ||||
|             text-align: right; | ||||
|             font-family: DINAlternate-Bold; | ||||
|             font-weight: 700; | ||||
|             font-size: 30px; | ||||
|             color: #FF7109; | ||||
|             img { | ||||
|               width: 32px; | ||||
|               height: 32px; | ||||
|               margin-right: 8px; | ||||
|               vertical-align: bottom; | ||||
|             } | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|       .item-info:nth-of-type(2) { | ||||
|         border-top: 0; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										186
									
								
								src/project/pingchang/AppRedemptionPoints/productDetails.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,186 @@ | ||||
| <template> | ||||
|   <div class="productDetails" v-if="goodsInfo.picUrl"> | ||||
|     <img :src="goodsInfo.picUrl" alt=""> | ||||
|     <div class="type" :class="`type`+goodsInfo.type">{{ $dict.getLabel('integralSGType', goodsInfo.type) }}</div> | ||||
|     <div class="product-info"> | ||||
|       <p>{{goodsInfo.title}}</p> | ||||
|       <h3>{{goodsInfo.integralPrice}}积分<span v-if="goodsInfo.type == 1">+¥{{goodsInfo.payMoney}}<span v-if="goodsInfo.type == 1">(兑换后再付)</span></span></h3> | ||||
|       <div>零售单价¥{{goodsInfo.retailPrice}}</div> | ||||
|       <span class="tips" v-if="goodsInfo.type == 1">兑换成功后,点击「去购买」前往京东低价购买</span> | ||||
|       <span class="tips" v-else>免费兑换商品,可到固定的兑换点进行「核销兑换」</span> | ||||
|     </div> | ||||
|     <div class="product-content"> | ||||
|       <p>商品描述:</p> | ||||
|       <p v-html="goodsInfo.description"></p> | ||||
|     </div> | ||||
|     <div class="btn" @click="toOrder()" v-if="goodsInfo.shopStatus == 1"> | ||||
|       <div :class="total >= goodsInfo.integralPrice ? 'status1' : 'status0'" v-if="goodsInfo.stock > 0">{{total >= goodsInfo.integralPrice ? '立即兑换' : '积分不足'}}</div> | ||||
|       <div class="status0" v-else>商品缺货</div> | ||||
|     </div> | ||||
|     <div class="btn" v-else> | ||||
|       <div class="status0">店铺停用</div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from "vuex"; | ||||
|  | ||||
| export default { | ||||
|   name: 'productDetails', | ||||
|   appName: '兑换商品', | ||||
|   data() { | ||||
|     return { | ||||
|       shopGoodsId: '', | ||||
|       goodsInfo: {}, | ||||
|       total: 0, | ||||
|       userId: '' | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     this.shopGoodsId = option.shopGoodsId | ||||
|      this.userId = option.userId | ||||
|     this.total = option.total | ||||
|     this.$dict.load(['integralSGType']).then(() => { | ||||
|       this.getDetail() | ||||
|     }) | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '兑换商品' | ||||
|   }, | ||||
|   methods: { | ||||
|     getDetail() { | ||||
|       this.$http.post(`/app/appintegralsupermarketshop/queryGoodsInfoXCX?shopGoodsId=${this.shopGoodsId}`).then(res => { | ||||
|         if (res.code === 0) { | ||||
|           this.goodsInfo = res.data | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     toOrder() { | ||||
|       if(this.total >= this.goodsInfo.integralPrice && this.goodsInfo.stock > 0 && this.goodsInfo.status == 1) { | ||||
|         uni.navigateTo({url: `./placeOrder?shopGoodsId=${this.goodsInfo.shopGoodsId}&total=${this.total}&backLevel=4&userId=${this.userId}`}) | ||||
|       } | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .productDetails { | ||||
|   background-color: #f3f6f9; | ||||
|   position: relative; | ||||
|   img { | ||||
|     width: 100%; | ||||
|     height: 750px; | ||||
|   } | ||||
|   .type { | ||||
|     position: absolute; | ||||
|     top: 0; | ||||
|     right: 0; | ||||
|     line-height: 42px; | ||||
|     font-family: PingFangSC-SNaNpxibold; | ||||
|     font-weight: 600; | ||||
|     font-size: 30px; | ||||
|     color: #FFF; | ||||
|     padding: 16px 16px 16px 36px; | ||||
|     border-bottom-left-radius: 40px; | ||||
|   } | ||||
|   .type1 { | ||||
|     background-color: #E64E39; | ||||
|   } | ||||
|   .type0 { | ||||
|     background-color: #FF6900; | ||||
|   } | ||||
|   .product-info { | ||||
|     padding: 32px; | ||||
|     background-color: #fff; | ||||
|     margin-bottom: 24px; | ||||
|     p { | ||||
|       word-break: break-all; | ||||
|       font-family: PingFangSC-SNaNpxibold; | ||||
|       font-weight: 600; | ||||
|       font-size: 48px; | ||||
|       color: #222; | ||||
|       letter-spacing: 0; | ||||
|       line-height: 76px; | ||||
|       margin-bottom: 8px; | ||||
|     } | ||||
|     h3 { | ||||
|       font-family: PingFangSC-SNaNpxibold; | ||||
|       font-weight: 600; | ||||
|       font-size: 44px; | ||||
|       color: #FF6900; | ||||
|       margin-bottom: 8px; | ||||
|       span { | ||||
|         font-size: 44px; | ||||
|         color: #4181FF; | ||||
|         margin-left: 8px; | ||||
|         span { | ||||
|           font-weight: 400; | ||||
|           font-family: PingFangSC-Regular; | ||||
|           font-size: 32px; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|     div { | ||||
|       font-family: PingFangSC-Regular; | ||||
|       font-weight: 400; | ||||
|       font-size: 24px; | ||||
|       color: #999; | ||||
|       line-height: 34px; | ||||
|       margin-bottom: 24px; | ||||
|       text-decoration: line-through; | ||||
|     } | ||||
|     .tips { | ||||
|       display: inline-block; | ||||
|       padding: 12px; | ||||
|       line-height: 36px; | ||||
|       background: #F5FCF5; | ||||
|       border-radius: 16px; | ||||
|       font-family: PingFangSC-Regular; | ||||
|       font-size: 24px; | ||||
|       color: #3BBC37; | ||||
|     } | ||||
|   } | ||||
|   .product-content { | ||||
|     padding: 34px 64px 162px; | ||||
|     background-color: #fff; | ||||
|     p { | ||||
|       font-family: PingFangSC-Regular; | ||||
|       font-size: 32px; | ||||
|       color: #666; | ||||
|       line-height: 60px; | ||||
|     } | ||||
|   } | ||||
|   .btn { | ||||
|     position: fixed; | ||||
|     left: 0; | ||||
|     bottom: 0; | ||||
|     width: 100%; | ||||
|     background-color: #fff; | ||||
|     padding: 20px 32px; | ||||
|     box-sizing: border-box; | ||||
|     div { | ||||
|       width: 100%; | ||||
|       height: 88px; | ||||
|       line-height: 88px; | ||||
|       text-align: center; | ||||
|       border-radius: 44px; | ||||
|       font-family: PingFangSC-Medium; | ||||
|       font-weight: 500; | ||||
|       font-size: 34px; | ||||
|     } | ||||
|     .status1 { | ||||
|       color: #FFF; | ||||
|       background: #4181FF; | ||||
|     } | ||||
|     .status0 { | ||||
|       color: #666; | ||||
|       background: #E2E2E2; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										132
									
								
								src/project/pingchang/AppRedemptionPoints/successOrder.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,132 @@ | ||||
| <template> | ||||
|   <div class="successOrder"> | ||||
|     <img src="./img/success.png" alt=""> | ||||
|      | ||||
|     <div v-if="isFree == 1"> | ||||
|       <h3>兑换成功</h3> | ||||
|       <p>提交「京东低价商品」订单成功,扣减 <span>{{integralPrice}}积分</span> | ||||
|         可点击下方按钮前往京东商城进行低价购买 | ||||
|       </p> | ||||
|       <div class="btn" @click="openJd">去购买</div> | ||||
|     </div> | ||||
|     <div v-else> | ||||
|       <h3>提交成功</h3> | ||||
|       <p>提交「免费兑」订单成功,扣减 <span>{{integralPrice}}积分</span></p> | ||||
|       <div class="btn-flex"> | ||||
|         <div @click="back">返回</div> | ||||
|         <div @click="toOrderList">查看订单</div> | ||||
|       </div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from "vuex"; | ||||
|  | ||||
| export default { | ||||
|   name: 'successOrder', | ||||
|   appName: '提交订单', | ||||
|   data() { | ||||
|     return { | ||||
|       isFree: 0, // 0免费 1京东 | ||||
|       integralPrice: 0, | ||||
|       backLevel: 1, | ||||
|       goodsJdUrl: '' | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     this.isFree = option.isFree | ||||
|     this.integralPrice = option.integralPrice | ||||
|     this.backLevel = option.backLevel | ||||
|     this.goodsJdUrl = option.goodsJdUrl | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '提交订单' | ||||
|   }, | ||||
|   methods: { | ||||
|     openJd() { | ||||
|       uni.navigateTo({url: `./jdH5?goodsJdUrl=${this.goodsJdUrl}`}) | ||||
|     }, | ||||
|     back() { | ||||
|       uni.navigateBack({delta: Number(this.backLevel)}) | ||||
|     }, | ||||
|     toOrderList() { | ||||
|       uni.redirectTo({ | ||||
|         url: './myOrderList' | ||||
|       }) | ||||
|     } | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| uni-page-body{ | ||||
|   background-color: #fff; | ||||
| } | ||||
| .successOrder { | ||||
|   padding: 0 60px; | ||||
|   text-align: center; | ||||
|   img { | ||||
|     width: 240px; | ||||
|     height: 232px; | ||||
|     margin: 168px auto 32px auto; | ||||
|   } | ||||
|   h3 { | ||||
|     font-family: PingFangSC-SNaNpxibold; | ||||
|     font-weight: 600; | ||||
|     font-size: 40px; | ||||
|     color: #333; | ||||
|     line-height: 56px; | ||||
|     margin-bottom: 16px; | ||||
|   } | ||||
|   p { | ||||
|     color: #333; | ||||
|     font-size: 30px; | ||||
|     font-family: PingFangSC; | ||||
|     line-height: 50px; | ||||
|     text-align: center; | ||||
|     margin-bottom: 80px; | ||||
|     span { | ||||
|       color: #FF6900; | ||||
|     } | ||||
|   } | ||||
|   .btn { | ||||
|     width: 410px; | ||||
|     height: 88px; | ||||
|     line-height: 88px; | ||||
|     background: #2D7DFF; | ||||
|     border-radius: 44px; | ||||
|     font-family: PingFangSC-Medium; | ||||
|     font-weight: 500; | ||||
|     font-size: 34px; | ||||
|     color: #FFF; | ||||
|     text-align: center; | ||||
|     margin: 0 auto; | ||||
|   } | ||||
|   .btn-flex { | ||||
|     font-family: PingFangSC-Medium; | ||||
|     font-weight: 500; | ||||
|     font-size: 34px; | ||||
|     margin: 0 auto; | ||||
|     div { | ||||
|       display: inline-block; | ||||
|       width: 272px; | ||||
|       text-align: center; | ||||
|       height: 88px; | ||||
|       line-height: 88px; | ||||
|       border-radius: 44px; | ||||
|       color: #FFF; | ||||
|       background-color: #2D7DFF; | ||||
|     } | ||||
|     div:nth-of-type(1) { | ||||
|       background-color: #E5EFFF; | ||||
|       color: #2D7DFF; | ||||
|       margin-right: 26px; | ||||
|     } | ||||
|   } | ||||
|    | ||||
| } | ||||
| </style> | ||||
| @@ -19,17 +19,19 @@ | ||||
|       </div> | ||||
|     </AiTopFixed> | ||||
|     <div class="list-content"> | ||||
|       <div class="item"> | ||||
|         <div class="label">餐饮美食</div> | ||||
|         <div class="value">100</div> | ||||
|       </div> | ||||
|       <div class="item"> | ||||
|         <div class="label">餐饮美餐饮美食餐饮美食餐饮美食餐饮美食餐饮美食餐饮美食餐饮美食餐饮美食餐饮美食餐饮美食餐饮美食餐饮美食餐饮美食餐饮美食食</div> | ||||
|         <div class="value">100</div> | ||||
|       </div> | ||||
|       <div class="item"> | ||||
|         <div class="label">餐饮美食</div> | ||||
|         <div class="value">100</div> | ||||
|       <div class="item" v-for="(item, index) in list" :key="index"> | ||||
|         <div class="item-content"> | ||||
|           <div class="label">{{item.name}}</div> | ||||
|           <div class="value" @click="viewList(index)"> | ||||
|             <u-icon name="arrow-down" color="#999" size="28" :class="activeIndex == index ? 'icon-down icon-down-active' : 'icon-down'" /> | ||||
|           </div> | ||||
|         </div> | ||||
|         <div class="item-list" v-if="activeIndex == index"> | ||||
|           <div class="row" v-for="(row, indexs) in item.tagList" :key="indexs" @click="toGrouping(row)"> | ||||
|             <div class="row-label">{{row.name}}</div> | ||||
|             <div class="row-value">50</div> | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|   </div> | ||||
| @@ -41,7 +43,11 @@ | ||||
|     appName: '群标签', | ||||
|     data() { | ||||
|       return { | ||||
|         deptList: [] | ||||
|         deptList: [], | ||||
|         current: 1, | ||||
|         pages: 2, | ||||
|         list: [], | ||||
|         activeIndex: null | ||||
|       } | ||||
|     }, | ||||
|     computed: { | ||||
| @@ -49,22 +55,40 @@ | ||||
|     }, | ||||
|     onLoad() { | ||||
|       this.deptList = [{name: this.user.departName, id: this.user.departId}] | ||||
|       this.getList() | ||||
|     }, | ||||
|     onShow() { | ||||
|       document.title = '群标签' | ||||
|     }, | ||||
|     methods: { | ||||
|       getListInit() { | ||||
|  | ||||
|         this.current = 1 | ||||
|         this.pages = 2 | ||||
|         this.getList() | ||||
|       }, | ||||
|       getTotal() { | ||||
|         this.$http.post(`/app/appwxuserfamiliarityrate/wxTopStatistics`).then(res=> { | ||||
|       getList() { | ||||
|         if(this.current > this.pages) return | ||||
|         this.$http.post(`/app/wxcp/wxgroupchattag/listAll?current=${this.current}`).then(res=> { | ||||
|           if(res?.data) { | ||||
|             this.form = {...res.data} | ||||
|             this.list = this.current == 1?  res.data.records : [...this.list,...res.data.records] | ||||
|             this.pages = res.data.pages | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|       toGrouping(row) { | ||||
|         uni.navigateTo({url: `./groupGrouping?name=${row.name}&id=${row.taggroupId}`}) | ||||
|       }, | ||||
|       viewList(index) { | ||||
|         if(this.activeIndex == index) { | ||||
|           return this.activeIndex = null | ||||
|         } | ||||
|         this.activeIndex = index | ||||
|       } | ||||
|     }, | ||||
|     onReachBottom() { | ||||
|       this.current ++ | ||||
|       this.getList() | ||||
|     } | ||||
|   } | ||||
| </script> | ||||
|  | ||||
| @@ -113,24 +137,53 @@ | ||||
|       } | ||||
|     } | ||||
|     .list-content { | ||||
|       padding: 24px 32px 0; | ||||
|       padding: 24px 0 0; | ||||
|       .item { | ||||
|         padding: 42px 32px; | ||||
|         background-color: #fff; | ||||
|         box-shadow: 0 0 8px 0 #00000005; | ||||
|         border-radius: 16px; | ||||
|         display: flex; | ||||
|         font-family: PingFangSC-Regular; | ||||
|         font-size: 32px; | ||||
|         margin-bottom: 24px; | ||||
|         .item-content { | ||||
|           display: flex; | ||||
|           padding: 36px 32px; | ||||
|           border-bottom: 1px solid #eee; | ||||
|         } | ||||
|         .label { | ||||
|           width: calc(100% - 120px); | ||||
|           color: #333; | ||||
|           font-family: PingFangSC-Medium; | ||||
|           font-weight: 500; | ||||
|           font-size: 34px; | ||||
|           color: #000; | ||||
|         } | ||||
|         .value { | ||||
|           width: 120px; | ||||
|           text-align: right; | ||||
|           color: #222; | ||||
|           .icon-down { | ||||
|             transform: rotate(180deg); | ||||
|             transition: all 0.3s ease-in-out; | ||||
|             margin-left:4px; | ||||
|           } | ||||
|  | ||||
|           .icon-down-active { | ||||
|             transform: rotate(0deg); | ||||
|           } | ||||
|         } | ||||
|         .item-list { | ||||
|           width: 100%; | ||||
|           padding: 0 32px; | ||||
|           box-sizing: border-box; | ||||
|           .row { | ||||
|             display: flex; | ||||
|             font-family: PingFangSC-Regular; | ||||
|             font-size: 30px; | ||||
|             color: #000; | ||||
|             border-bottom: 1px solid #eee; | ||||
|             padding: 28px 0; | ||||
|           } | ||||
|           .row-label { | ||||
|             width: calc(100% - 120px); | ||||
|           } | ||||
|           .row-value { | ||||
|             width: 120px; | ||||
|             text-align: right; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   | ||||
| @@ -1,29 +1,19 @@ | ||||
| <template> | ||||
|   <div class="AppGroupGrouping"> | ||||
|   <div class="groupGrouping"> | ||||
|     <AiTopFixed> | ||||
|       <u-search v-model="keyword" :clearabled="true" placeholder="请输入群名称、群主" :show-action="false" bg-color="#F5F5F5" | ||||
|         search-icon-color="#999" color="#333" height="58" @search="getListInit" @clear="getListInit"> | ||||
|       </u-search> | ||||
|     </AiTopFixed> | ||||
|     <div class="list-content"> | ||||
|       <div class="item"> | ||||
|         <img src="./imgs/del-icon.png" alt="" class="group-img"> | ||||
|       <div class="item" v-for="(item, index) in list" :key="index"> | ||||
|         <img :src="item.qrCode" alt="" class="group-img"> | ||||
|         <div class="item-right"> | ||||
|           <div class="group-info"> | ||||
|             <p>兴龙县步行街美食一群兴龙县步行街美食一群兴龙县步行街美食一群兴龙县步行街美食一群兴龙县步行街美食一群兴龙县步行街美食一群</p> | ||||
|             <div>3人 | 群主:谢晋</div> | ||||
|             <p>{{item.name}}</p> | ||||
|             <div>{{item.personCount}}人 | 群主:{{item.ownerName}}</div> | ||||
|           </div> | ||||
|           <img src="./imgs/del-icon.png" alt="" class="del-img" @click="del()"> | ||||
|         </div> | ||||
|       </div> | ||||
|       <div class="item"> | ||||
|         <img src="./imgs/del-icon.png" alt="" class="group-img"> | ||||
|         <div class="item-right"> | ||||
|           <div class="group-info"> | ||||
|             <p>兴龙县步行街美食一群</p> | ||||
|             <div>3人 | 群主:谢晋</div> | ||||
|           </div> | ||||
|           <img src="./imgs/del-icon.png" alt="" class="del-img"> | ||||
|           <img src="./imgs/del-icon.png" alt="" class="del-img" @click="del(item)"> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
| @@ -37,45 +27,63 @@ | ||||
|     appName: '群分组', | ||||
|     data() { | ||||
|       return { | ||||
|         keyword: '' | ||||
|         keyword: '', | ||||
|         titleName: '', | ||||
|         tagId: '', | ||||
|         current: 1, | ||||
|         pages: 2, | ||||
|         list: [] | ||||
|       } | ||||
|     }, | ||||
|     computed: { | ||||
|       ...mapState(['user']), | ||||
|     }, | ||||
|     onLoad(option) { | ||||
|       this.titleName = option.name | ||||
|       this.tagId = option.id | ||||
|       this.getListInit() | ||||
|     }, | ||||
|     onShow() { | ||||
|       document.title = '群分组' | ||||
|       document.title = this.titleName | ||||
|     }, | ||||
|     methods: { | ||||
|       getListInit() { | ||||
|          | ||||
|         this.current = 1 | ||||
|         this.pages = 2 | ||||
|         this.getList() | ||||
|       }, | ||||
|       getTotal() { | ||||
|         this.$http.post(`/app/appwxuserfamiliarityrate/wxTopStatistics`).then(res=> { | ||||
|       getList() { | ||||
|         if(this.current > this.pages) return | ||||
|         this.$http.post(`/app/wxcp/wxgroup/list?current=${this.current}&groupName=${this.keyword}&size=10`).then(res=> { | ||||
|           if(res?.data) { | ||||
|             this.form = {...res.data} | ||||
|             this.list = this.current == 1?  res.data.records : [...this.list,...res.data.records] | ||||
|             this.pages = res.data.pages | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|       del() { | ||||
|       del(row) { | ||||
|         this.$confirm('是否确认从该标签组中移除?').then(() => { | ||||
|           // this.$http.post(`/app/appzyvideobroadcast/getBroadcastRecall?broadcastId=${this.info.id}`).then((res) => { | ||||
|           //   if (res.code == 0) { | ||||
|           //     this.$u.toast('撤回成功!') | ||||
|           //     this.getDetail() | ||||
|           //   } | ||||
|           // }) | ||||
|           this.$http.post(`/app/wxcp/wxgroupchattag/markTagForCP?tagId=${this.tagId}&groupId=${row.id}`).then((res) => { | ||||
|             if (res.code == 0) { | ||||
|               this.$u.toast('移除成功!') | ||||
|               this.getListInit() | ||||
|             } | ||||
|           }) | ||||
|         }) | ||||
|       }, | ||||
|       add() { | ||||
|         uni.navigateTo({url: `./groupList`}) | ||||
|       } | ||||
|     }, | ||||
|     onReachBottom() { | ||||
|       this.current ++ | ||||
|       this.getList() | ||||
|     } | ||||
|   } | ||||
| </script> | ||||
| 
 | ||||
| <style lang="scss" scoped> | ||||
|   .AppGroupGrouping { | ||||
|   .groupGrouping { | ||||
|     .list-content { | ||||
|       margin-top: 24px; | ||||
|       .item { | ||||
| Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.3 KiB | 
| Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB | 
| Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB | 
| Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 1.7 KiB |