|
|
@@ -0,0 +1,173 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <view class="loading-content" v-if="loading">
|
|
|
+ <view class="store-header">
|
|
|
+ <view class="logo"><view class="skeleton-line animate"></view></view>
|
|
|
+ <view class="info">
|
|
|
+ <view class="skeleton-line animate"></view>
|
|
|
+ <view class="skeleton-line animate mt15"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="store-detail">
|
|
|
+ <view class="detail-left">
|
|
|
+ <view class="skeleton-line animate"></view>
|
|
|
+ <view class="skeleton-line animate mt15"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="store-goods">
|
|
|
+ <view class="goods-item" v-for="(item,index) in 3" :key="index">
|
|
|
+ <view class="image"><view class="skeleton-line animate"></view></view>
|
|
|
+ <view class="info">
|
|
|
+ <view class="skeleton-line animate"></view>
|
|
|
+ <view class="skeleton-line animate mt15"></view>
|
|
|
+ <view class="skeleton-line animate mt15"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <block v-else>
|
|
|
+ <view class="ts-header">
|
|
|
+ <view class="ts-h-title">投诉门店</view>
|
|
|
+ <view class="store-info">
|
|
|
+ <view class="store-left">
|
|
|
+ <view class="name">{{dataInfo.store.poi_name}}</view>
|
|
|
+ <view class="address">{{dataInfo.store.poi_address}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="ts-body">
|
|
|
+ <view class="order-status" v-if="dataInfo.status == 0">
|
|
|
+ <image src="https://jymini.oss-cn-guangzhou.aliyuncs.com/mini/complaint-2.svg"></image>
|
|
|
+ </view>
|
|
|
+ <view class="order-status" v-if="dataInfo.status == 1">
|
|
|
+ <image src="https://jymini.oss-cn-guangzhou.aliyuncs.com/mini/complaint-3.svg"></image>
|
|
|
+ </view>
|
|
|
+ <view class="ts-form">
|
|
|
+ <view class="ts-form-item">
|
|
|
+ <view class="form-title">具体问题 <text>*</text></view>
|
|
|
+ <view class="form-input">
|
|
|
+ {{dataInfo.question}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="ts-form-item">
|
|
|
+ <view class="form-title">问题订单 <text>*</text></view>
|
|
|
+ <view class="form-input">
|
|
|
+ {{dataInfo.order_sn}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="ts-form-item">
|
|
|
+ <view class="form-title">联系方式</view>
|
|
|
+ <view class="form-input">
|
|
|
+ {{dataInfo.mobile}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="ts-form-item">
|
|
|
+ <view class="form-title">详细补充 <text>*</text></view>
|
|
|
+ <view class="form-input-text">
|
|
|
+ {{dataInfo.content}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="ts-form-item">
|
|
|
+ <view class="form-title">回复结果 <text>*</text></view>
|
|
|
+ <view class="form-input-text">
|
|
|
+ <view class="data" v-html="dataInfo.remark"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </block>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+var app;
|
|
|
+import * as Api from "@/static/api/complaint.js";
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ options:null,
|
|
|
+ disabled:false,
|
|
|
+ dataInfo:null,
|
|
|
+ loading:true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(options) {
|
|
|
+ app = this;
|
|
|
+ app.options = options;
|
|
|
+ app.getDetail()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ tipsPop(){
|
|
|
+ app.$refs.tspopup.close()
|
|
|
+ },
|
|
|
+ getDetail(){
|
|
|
+ app.loading = true;
|
|
|
+ Api.detail(app.options).then((res)=>{
|
|
|
+ app.loading = false;
|
|
|
+ if (res.code == 0) {
|
|
|
+ app.$dialog.showSuccess(validation,"none",function(){
|
|
|
+ uni.navigateBack()
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ app.dataInfo = res.data;
|
|
|
+ })
|
|
|
+ },
|
|
|
+ submitTs(){
|
|
|
+ var validation = form.validation(app.options,[
|
|
|
+ {name:"content",rule:["required"],msg:["请输入描述内容"]}
|
|
|
+ ]);
|
|
|
+ if(validation){
|
|
|
+ app.$dialog.showSuccess(validation);
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ Api.complaint(app.options).then((res)=>{
|
|
|
+ if (res.code == 0) {
|
|
|
+ return app.$dialog.showSuccess(res.msg);
|
|
|
+ }
|
|
|
+ app.$dialog.showSuccess(res.msg,"none",function(){
|
|
|
+ uni.navigateBack()
|
|
|
+ });
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+page{background-color: #f8f8f8;}
|
|
|
+.loading-content{margin: 20upx;}
|
|
|
+.form-input-text{font-size: 28upx;line-height: 43upx;}
|
|
|
+.form-input-text image{width: 100%;}
|
|
|
+.form-input-text img{width: 100%;}
|
|
|
+.ts-popup{background-color: #fff;width: 90vw;border-radius: 20upx;}
|
|
|
+.ts-popup .title{font-size: 32upx;color: #333;font-weight: bold;padding: 30upx 0;text-align: center;}
|
|
|
+.ts-popup .sub-title{color: #f00;padding: 20upx 0;text-align: center;font-size: 28upx;}
|
|
|
+.ts-popup .tips-body{width: 90%;margin: 0 auto;}
|
|
|
+.ts-popup .tips-body .item-title{font-size: 28upx;color: #333;padding: 15upx 0;}
|
|
|
+.ts-popup .tips-body .item-desc{font-size: 28upx;color: #333;line-height: 46upx;margin-bottom: 20upx;}
|
|
|
+.ts-popup .pup-close{padding-top: 40upx;}
|
|
|
+.ts-popup .pup-close .pop-btn{border: 0;background-color: #f00;font-size: 32upx;color: #fff;border-radius: 0 0 20upx 20upx;padding: 15upx 0;cursor: pointer;}
|
|
|
+
|
|
|
+.ts-header{padding: 20upx 0;margin-bottom: 20upx;}
|
|
|
+.ts-header .ts-h-title{font-size: 28upx;color: #666;padding: 20upx;}
|
|
|
+.ts-header .store-info{background-color: #fff;padding: 20upx;}
|
|
|
+.ts-header .store-info .store-left .name{font-size: 30rpx;color: #333;font-weight: bold;line-height: 80upx;}
|
|
|
+.ts-header .store-info .store-left .address{font-size: 24rpx;color: #999;}
|
|
|
+.ts-body{background-color: #fff;padding: 20upx;position: relative;}
|
|
|
+
|
|
|
+.ts-body .order-status{position: absolute;right: 20upx;top: 20upx;}
|
|
|
+.ts-body .order-status image{width: 120upx;height: 120upx;transform: rotate(45deg);}
|
|
|
+
|
|
|
+.ts-form .ts-form-item{border-bottom: 2upx solid #f8f8f8;padding-bottom: 10upx;}
|
|
|
+.ts-form .ts-form-item:last-child{border-bottom: 0;}
|
|
|
+.ts-form .ts-form-item .form-title{color: #333;font-size: 28upx;padding: 20upx 0;}
|
|
|
+.ts-form .ts-form-item .form-title text{color: #f00;margin-left: 10upx;}
|
|
|
+.ts-form .ts-form-item .form-input{font-size: 28upx;color: #333;height: 80upx;display: flex;align-items: center;}
|
|
|
+.ts-form .ts-form-item .ts-input{height: 100%;border: 0;box-shadow: none;width: 100%;}
|
|
|
+.ts-form .form-input-textarea{height: 200upx;font-size: 28upx;color: #333;}
|
|
|
+.footer{position: fixed;bottom: 0;background-color: #fff;padding: 20upx 20upx 0 20upx;border-top: 2upx solid #f8f8f8;left: 0;right: 0;}
|
|
|
+.footer .footer-safe {height: env(safe-area-inset-bottom);width: 100%;}
|
|
|
+.footer .footer-btn{padding: 20upx 0;}
|
|
|
+.footer .footer-btn .btn{color: #fff;background-color: #f00;border-radius: 10upx;}
|
|
|
+</style>
|
Zory