Browse Source

Merge branch 'master' of ssh://gogs.zfire.top:2222/zfire-front/recycle-mobile

linwenxin 1 năm trước cách đây
mục cha
commit
e0ae51fd05

+ 13 - 13
src/components/zj-dialog/zj-dialog-remark.vue

@@ -1,14 +1,14 @@
 <template>
 	<zjDialogBox
-		:title="'修改备注'"
+		:title="'留言'"
 		:minHeight="'50vh'"
-		:isShow="isShow" 
-		@cancel="cancelDialog" 
+		:isShow="isShow"
+		@cancel="cancelDialog"
 		@confirm="confirmDialog">
 		<u--textarea
 			fixed
-			v-model="value" 
-			placeholder="请输入备注信息" 
+			v-model="value"
+			placeholder="请输入留言内容"
 			border="none"
 			height="250">
 		</u--textarea>
@@ -17,12 +17,12 @@
 
 <script>
 	import zjDialogBox from "@/components/zj-dialog/zj-dialog-box.vue";
-	
+
 	export default {
 		components: {
 		    zjDialogBox,
 		},
-		
+
 		props: {
 			isShow: {
 				type: Boolean,
@@ -33,13 +33,13 @@
 				default: ''
 			},
 		},
-		
+
 		data() {
 			return {
 				value: '',
 			}
 		},
-		
+
 		methods: {
 			setValue(id) {
 				this.$axios({
@@ -52,15 +52,15 @@
 					this.value = res.data.workerRemark;
 				})
 			},
-			
+
 			cancelDialog() {
 				this.value = '';
 				this.$emit('close');
 			},
-			
+
 			confirmDialog() {
 				if(!this.value) return this.$toast('请填写备注信息');
-				
+
 				this.$axios({
 					url: '/order/remark',
 					method: 'POST',
@@ -79,5 +79,5 @@
 </script>
 
 <style lang="scss" scoped>
-	
+
 </style>

+ 6 - 0
src/pages.json

@@ -96,6 +96,12 @@
       }
     },
     {
+      "path": "pages/mine/myBuy/return",
+      "style": {
+        "navigationBarTitleText": "申请售后"
+      }
+    },
+    {
       "path": "pages/mine/myBuy/logistics",
       "style": {
         "navigationBarTitleText": "查看物流"

+ 210 - 45
src/pages/goods/detail.vue

@@ -1,61 +1,132 @@
 <template>
-  <zj-page-layout
-  	:hasFooter="false"
-  	:isScroll="true"
-  	:refresherTriggered="refresherTriggered"
-  	@refresherrefresh="refresherrefresh">
-    <view class="top-container">
-      <view class="user">
-        <image src="@/static/common/logo.png"></image>
-        <view class="info">
-          <view class="name">张三</view>
-          <view class="phone">联系电话:138****2233</view>
+  <view>
+    <zj-page-layout
+    	:hasFooter="true"
+    	:isScroll="true"
+    	:refresherTriggered="refresherTriggered"
+    	@refresherrefresh="refresherrefresh">
+      <view class="top-container">
+        <view class="user">
+          <image src="@/static/common/logo.png"></image>
+          <view class="info">
+            <view class="name">张三</view>
+            <view class="phone">联系电话:138****2233</view>
+          </view>
+        </view>
+        <view class="btns">
+          <u-button type="warning" text="分享好友" class="share"></u-button>
+          <u-button type="error" text="立即联系" class="contact"></u-button>
+          <u-button type="primary" text="立即购买" class="buy" @tap="$navPage(`/pages/goods/order`)"></u-button>
         </view>
       </view>
-      <view class="btns">
-        <u-button type="warning" text="分享好友" class="share"></u-button>
-        <u-button type="error" text="立即联系" class="contact"></u-button>
-        <u-button type="primary" text="立即购买" class="buy" @tap="$navPage(`/pages/goods/order`)"></u-button>
-      </view>
-    </view>
 
-    <view class="info-container">
-      <view class="title">
-        <view class="tit">商品名称</view>
-        <view class="price">¥1234.00</view>
-      </view>
-      <view class="des">商品描述商品描述商品描述商品描述商品描述</view>
-      <view class="tags">
-        <view class="it">格力</view>
-        <view class="it">7200w</view>
-        <view class="it">一级能效</view>
-      </view>
-      <view class="info">
-        <view class="left">
-          <text>23小时前发布</text>
-          <text>20人浏览</text>
+      <view class="info-container">
+        <view class="title">
+          <view class="tit">商品名称</view>
+          <view class="price">¥1234.00</view>
+        </view>
+        <view class="des">商品描述商品描述商品描述商品描述商品描述</view>
+        <view class="tags">
+          <view class="it">格力</view>
+          <view class="it">7200w</view>
+          <view class="it">一级能效</view>
+        </view>
+        <view class="info">
+          <view class="left">
+            <text>23小时前发布</text>
+            <text>20人浏览</text>
+          </view>
+          <view class="right">库存10</view>
+        </view>
+        <view class="bottom">
+          <view class="left-location">天河区棠下</view>
+          <view class="right-stats">
+            <view class="it">
+              <text class="iconfont icon-dianzan"></text>
+              <text class="text">点赞</text>
+            </view>
+            <view class="it">
+              <text class="iconfont icon-pinglun"></text>
+              <text class="text">收藏</text>
+            </view>
+          </view>
         </view>
-        <view class="right">库存10</view>
       </view>
-      <view class="bottom">
-        <view class="left-location">天河区棠下</view>
-        <view class="right-stats">
-          <view class="it">
-            <text class="iconfont icon-dianzan"></text>
-            <text class="text">点赞</text>
+
+      <view class="remark-container">
+        <view class="title">
+          <view class="tit">全部留言</view>
+          <view class="right">内容违规,我要举报</view>
+        </view>
+        <view class="item">
+          <view class="top">
+            <image src="@/static/common/logo.png"></image>
+            <view class="user">
+              <view class="name">李海</view>
+              <view class="time">2023-11-12 20:22:33</view>
+            </view>
           </view>
-          <view class="it">
-            <text class="iconfont icon-pinglun"></text>
-            <text class="text">收藏</text>
+          <view class="content">
+            <view class="left">商品很nice</view>
+            <view class="right"><text class="iconfont icon-bianji"></text><text>回复</text></view>
           </view>
+          <view class="reply">主人回复:好的,我知道了</view>
         </view>
       </view>
-    </view>
 
-  </zj-page-layout>
+      <template slot="footer">
+        <view class="bottom-container">
+          <u-button text="留言" type="primary" shape="circle" @click="isShowRemarkDialog = true"></u-button>
+          <u-button text="操作" type="primary" shape="circle" @click="isShowActionDialog = true"></u-button>
+        </view>
+      </template>
+    </zj-page-layout>
+
+    <zj-dialog-remark
+    	ref="remarkDialog"
+    	:isShow="isShowRemarkDialog"
+    	@close="isShowRemarkDialog = false">
+    </zj-dialog-remark>
+
+    <u-action-sheet
+      :actions="actionList"
+      :title="'操作'"
+      :show="isShowActionDialog"
+      @close="isShowActionDialog = false"
+      @select="selectAction">
+    </u-action-sheet>
+  </view>
 </template>
 
-<script>
+<script>
+	import zjDialogRemark from '@/components/zj-dialog/zj-dialog-remark.vue';
+
+  export default {
+    components: {
+      zjDialogRemark
+    },
+
+    data() {
+      return {
+        refresherTriggered: false,
+        isShowRemarkDialog: false,
+        actionList: [
+          {name: '已卖出'},
+          {name: '下架'},
+          {name: '重新上架'},
+          {name: '编辑'},
+        ],
+        isShowActionDialog: false,
+      }
+    },
+
+    methods: {
+      selectAction() {
+
+      }
+    }
+
+  }
 
 </script>
 
@@ -179,4 +250,98 @@
     }
   }
 }
+
+.remark-container {
+  background: #ffffff;
+  margin-top: 30rpx;
+  padding: 30rpx;
+  .title {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    .tit {
+      font-weight: 500;
+    }
+    .right {
+      font-size: 24rpx;
+      color: $sec-font;
+    }
+  }
+  .item {
+    padding: 30rpx 0;
+    border-bottom: 1px solid #eaeaea;
+    &:last-child {
+      border: none;
+    }
+    .top {
+      display: flex;
+      image {
+        width: 88rpx;
+        height: 88rpx;
+        border-radius: 50%;
+        flex-shrink: 0;
+      }
+      .user {
+        margin-left: 20rpx;
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        .name {
+
+        }
+        .time {
+          color: $sec-font;
+          font-size: 24rpx;
+          margin-top: 8rpx;
+        }
+      }
+      .status {
+        color: $assist-color;
+      }
+    }
+    .content {
+      margin-top: 20rpx;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      .left {
+        font-size: 28rpx;
+      }
+      .right {
+        font-size: 24rpx;
+        background: #eaeaea;
+        display: flex;
+        align-items: center;
+        padding: 8rpx 12rpx;
+        margin-left: 40rpx;
+        border-radius: 8rpx;
+        .iconfont {
+          font-size: 24rpx;
+          margin-right: 4rpx;
+        }
+      }
+    }
+    .reply {
+      margin-top: 20rpx;
+      font-size: 24rpx;
+      color: $sec-font;
+      border-left: 4rpx solid $theme-color;
+      padding-left: 8rpx;
+    }
+  }
+}
+
+.bottom-container {
+  padding: 20rpx 30rpx;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  .u-button {
+    width: auto;
+    height: 60rpx;
+    margin: 0;
+    margin-left: 20rpx;
+  }
+}
 </style>

+ 159 - 0
src/pages/mine/myBuy/return.vue

@@ -0,0 +1,159 @@
+<template>
+  <zj-page-layout
+  	:hasFooter="true"
+  	:isScroll="true"
+  	:refresherTriggered="refresherTriggered"
+  	@refresherrefresh="refresherrefresh">
+
+    <view class="goods-container">
+      <view class="title">商品信息</view>
+      <view class="goods">
+        <image src="@/static/user/other_book.png"></image>
+        <view class="main">
+          <view class="name">商品名称</view>
+          <view class="des">商品描述</view>
+          <view class="price"><text>¥18.00</text>x2</view>
+        </view>
+      </view>
+      <view class="total">订单总金额<text>¥1200.00</text></view>
+    </view>
+
+    <view class="form-container">
+      <view class="title">退货信息填写</view>
+      <view class="radio">
+        <view class="label">选择类型</view>
+        <u-radio-group
+            v-model="type"
+            placement="row">
+        	<u-radio label="仅退款" activeColor="#01C30B" :name="1"></u-radio>
+        </u-radio-group>
+      </view>
+      <view class="content">
+        <view class="label">退货原因</view>
+        <u--textarea v-model="content" placeholder="请输入内容" ></u--textarea>
+      </view>
+    </view>
+
+    <view class="form-container">
+      <view class="title">处理结果</view>
+      <view class="row">
+        <view class="label">处理状态</view>
+        <view class="value">已处理</view>
+      </view>
+      <view class="row">
+        <view class="label">处理结果</view>
+        <view class="value">同意退款</view>
+      </view>
+      <view class="row">
+        <view class="label">退款金额</view>
+        <view class="value">¥1200.00</view>
+      </view>
+      <view class="row">
+        <view class="label">备注信息</view>
+        <view class="value">备注信息备注信息备注信息备注信息备注信息备注信息备注信息备注信息备注信息</view>
+      </view>
+    </view>
+
+    <template slot="footer">
+      <view class="bottom-container">
+        <u-button text="提交申请" type="primary" shape="circle"></u-button>
+      </view>
+    </template>
+
+  </zj-page-layout>
+</template>
+
+<script>
+  export default {
+    data() {
+      return {
+        type: 1,
+        content: ''
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+.goods-container {
+  background: #ffffff;
+  margin-top: 30rpx;
+  padding: 30rpx 30rpx 0;
+  .title {
+    font-weight: 500;
+  }
+  .goods {
+    display: flex;
+    padding: 30rpx 0;
+    image {
+      width: 120rpx;
+      height: 120rpx;
+    }
+    .main {
+      flex: 1;
+      margin-left: 20rpx;
+      .name {
+        font-size: 32rpx;
+      }
+      .des {
+        margin-top: 12rpx;
+        font-size: 28rpx;
+        color: $reg-font;
+      }
+      .price {
+        margin-top: 12rpx;
+      	text {
+      		color: $assist-color;
+      		font-weight: 500;
+      		font-size: 32rpx;
+          margin-right: 12rpx;
+      	}
+      }
+    }
+  }
+  .total {
+    border-top: 1px solid #eaeaea;
+    height: 80rpx;
+    display: flex;
+    align-items: center;
+    justify-content: end;
+    font-size: 28rpx;
+    text {
+      margin-left: 12rpx;
+      color: $assist-color;
+    }
+  }
+}
+
+.form-container {
+  background: #ffffff;
+  margin-top: 30rpx;
+  padding: 30rpx;
+  .title {
+    font-weight: 500;
+  }
+  .label {
+  	color: $sec-font;
+  	flex-shrink: 0;
+  	margin-right: 30rpx;
+  }
+  .radio {
+    display: flex;
+    align-items: center;
+    margin-top: 30rpx;
+  }
+  .content {
+    display: flex;
+    margin-top: 30rpx;
+  }
+  .row {
+    display: flex;
+    margin-top: 30rpx;
+  }
+}
+
+.bottom-container {
+  padding: 20rpx 30rpx;
+}
+
+</style>