Browse Source

feat(client): 新增发布组件

yizhiyang 1 year ago
parent
commit
8025d7e92f

+ 47 - 0
src/components/publish-review/publish-review.vue

@@ -0,0 +1,47 @@
+<!--
+ ****--@date 2024-06-10 15:08:22
+ ****--@author yizhiyang
+ ****--@description  底部发布评论按钮
+-->
+<template>
+  <view class="fl-flex publish-review">
+    <u--input
+      placeholder="说点什么..."
+      shape="circle"
+      v-model="value"
+      border="none"
+      :customStyle="customStyleInput"
+    ></u--input>
+    <u-button text="发布" :customStyle="customStyleBtn" color="#215EBE"></u-button>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'publish-review',
+  computed: {
+    customStyleBtn() {
+      return {
+        width: '96rpx',
+        height: '68rpx',
+        borderRadius: ' 8rpx',
+        marginLeft: '32rpx',
+      };
+    },
+    customStyleInput() {
+      return {
+        height: '70rpx !important',
+        backgroundColor: '#f5f6f8',
+        paddingLeft: '32rpx',
+      };
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.publish-review {
+  height: 88rpx;
+  padding: 10rpx 32rpx;
+}
+</style>

+ 0 - 52
src/pagesHome/components/evaluateComponent.vue

@@ -1,52 +0,0 @@
-<template>
-  <view>
-    <view class="Evaluate-content">
-      <view v-for="(item, index) in comments" :key="index">
-        <view class="commnet-user flex">
-          <image :src="item.user.avatar" style="width: 40px; height: 40px; border-radius: 50%" />
-          <view class="commnet-user-middle flex">
-            <view class="name flex">{{ item.user.nickname }}</view>
-            <u-rate
-              class="rate"
-              :value="item.score"
-              readonly
-              :size="12"
-              gutter="1"
-              active-color="#ffa500"
-            />
-          </view>
-          <view class="time">{{ item.createTime }}</view>
-        </view>
-        <view class="commnet-text">{{ item.content }}</view>
-        <view class="commnet-img">
-          <image
-            class="img"
-            v-for="(img, index) in item.attachments"
-            :key="index"
-            :src="url"
-            mode="widthFix"
-          />
-        </view>
-      </view>
-
-      <u-empty
-        v-if="comments.length == 0"
-        mode="message"
-        icon="http://cdn.uviewui.com/uview/empty/message.png"
-      ></u-empty>
-    </view>
-  </view>
-</template>
-
-<script>
-export default {
-  props: {
-    comments: {
-      type: Array,
-      default: [],
-    },
-  },
-};
-</script>
-
-<style lang="less" scoped></style>

+ 39 - 28
src/pagesHome/evaluateDetail/index.vue

@@ -1,35 +1,40 @@
 <template>
-  <view class="evaluate-detail">
-    <page-navbar bgColor="#fff" title="评价详情" />
-    <dynamic-list :list="list"></dynamic-list>
-    <view class="fl-flex merchant-mine">
-      <base-img
-        src="/static/img.jpg"
-        width="160rpx"
-        height="160rpx"
-        borderRadius="16rpx"
-      ></base-img>
-      <view class="merchant-list u-m-l-32">
-        <view class="f-s-30 text-primary u-m-b-14 text-bold u-m-t-8">
-          新世纪环球购物中心
+  <view>
+    <view class="evaluate-detail">
+      <page-navbar bgColor="#fff" title="评价详情" />
+      <dynamic-list :list="list"></dynamic-list>
+      <view class="fl-flex merchant-mine">
+        <base-img
+          src="/static/img.jpg"
+          width="160rpx"
+          height="160rpx"
+          borderRadius="16rpx"
+        ></base-img>
+        <view class="merchant-list u-m-l-32">
+          <view class="f-s-30 text-primary u-m-b-14 text-bold u-m-t-8">
+            新世纪环球购物中心
+          </view>
+          <view class="fl-flex u-m-b-14 fl-align-center">
+            <u-rate
+              v-model="value"
+              readonly
+              gutter="0"
+              size="24"
+              activeColor="#ffa033"
+            ></u-rate>
+            <view class="f-s-26 text-99">(3.0)</view>
+          </view>
+          <view class="f-s-24 text-999">世纪城国际展览中心世纪城国际展览中心</view>
         </view>
-        <view class="fl-flex u-m-b-14 fl-align-center">
-          <u-rate
-            v-model="value"
-            readonly
-            gutter="0"
-            size="24"
-            activeColor="#ffa033"
-          ></u-rate>
-          <view class="f-s-26 text-99">(3.0)</view>
-        </view>
-        <view class="f-s-24 text-999">世纪城国际展览中心世纪城国际展览中心</view>
       </view>
-    </view>
 
-    <view class="evaluate">
-      <view class="fl-text-title u-m-b-32">全部评价</view>
-      <evaluate-item v-for="(item, index) in 8" :key="index"></evaluate-item>
+      <view class="evaluate">
+        <view class="fl-text-title u-m-b-32">全部评价</view>
+        <evaluate-item v-for="(item, index) in 8" :key="index"></evaluate-item>
+      </view>
+    </view>
+    <view class="evaluate-button">
+      <publish-review></publish-review>
     </view>
   </view>
 </template>
@@ -62,4 +67,10 @@ export default {
     margin: 32rpx 0;
   }
 }
+.evaluate-button {
+  position: fixed;
+  bottom: 0;
+  width: 100%;
+  background-color: #fff;
+}
 </style>

+ 2 - 2
src/pagesHome/productDetail/index copy.vue

@@ -144,12 +144,12 @@ import {
 } from '@/api/client/business.js';
 
 import couponComponent from '../marketer/CouponStore.vue';
-import evaluateComponent from '../components/evaluateComponent.vue';
+// import evaluateComponent from '../components/evaluateComponent.vue';
 
 export default {
   components: {
     couponComponent,
-    evaluateComponent,
+    // evaluateComponent,
   },
   data() {
     return {

+ 2 - 2
src/pagesHome/productDetail/productDetail - 副本.vue

@@ -143,11 +143,11 @@ import {
 } from '@/api/client/business.js';
 import { accountTotIdGetCouponList } from '@/api/client/mine.js';
 import couponComponent from '../components/couponComponent.vue';
-import evaluateComponent from '../components/evaluateComponent.vue';
+// import evaluateComponent from '../components/evaluateComponent.vue';
 export default {
   components: {
     couponComponent,
-    evaluateComponent,
+    // evaluateComponent,
   },
   data() {
     return {