feat: 意见反馈

src/components/Feedback/index.vue

@@ -1,50 +1,55 @@
 <template>
   <view class="create-service-order">
-    <view class="create-service-wrapper">
-      <view class="order-header">
-        <text>反馈意见</text>
-      </view>
-      <view class="order-content">
-        <view class="detail-item">
-          <text class="detail-label">联系电话：</text>
+    <view
+      class="w-full bg-white border-box border-ff overflow-hidden rounded-20"
+    >
+      <image
+        class="order-header w-full"
+        src="https://oss.nianxx.cn/mp/static/version_101/home/feedback_1.png"
+        mode="aspectFill"
+      />
+      <view class="order-content border-box p-12">
+        <view
+          class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 font-size-14 color-171717 mb-12"
+        >
+          <text class="font-500 line-height-22 mr-20">联系电话</text>
           <input
             v-if="!isCallSuccess"
-            class="detail-input"
             placeholder="请填写联系电话"
             v-model="contactPhone"
           />
           <text v-else class="detail-value">{{ contactPhone }}</text>
         </view>
-        <view class="detail-item">
-          <text class="detail-label">意见内容：</text>
+        <view
+          class="bg-F5F7FA border-box p-12 rounded-10 font-size-14 font-500 color-171717 mb-12"
+        >
+          <view class="font-500 line-height-22 mb-12">意见内容</view>
           <textarea
             v-if="!isCallSuccess"
-            class="detail-textarea"
             placeholder="请输入反馈意见"
+            maxlength="100"
             v-model="contactText"
           />
           <text v-else class="detail-value">{{ contactText }}</text>
         </view>
 
-        <button
+        <view
           v-if="!isCallSuccess"
-          class="order-button submit-button"
+          class="btn rounded-50 color-white bg-button flex flex-items-center flex-justify-center"
           @click="handleCall"
         >
           立即提交
-        </button>
-
-        <button v-else class="order-button look-button" @click="viewWorkOrder">
-          查看意见
-        </button>
+        </view>
       </view>
-    </view>
 
-    <view class="footer-help">
-      <image src="./images/icon_volume.png" class="help-icon"></image>
-      <text class="help-text">
-        {{ appName }}收到您的意见将第一时间为您处理!
-      </text>
+      <view
+        class="footer-help flex flex-items-center flex-justify-center mb-12"
+      >
+        <image class="help-icon mr-4" src="./images/icon_volume.png" />
+        <text class="font-size-12 font-500 color-FA7319">
+          {{ appName }}收到您的意见将第一时间为您处理!
+        </text>
+      </view>
     </view>
   </view>
 </template>