feat: 意见反馈

This commit is contained in:
duanshuwen
2025-10-18 17:09:52 +08:00
parent 4b066626cf
commit 8b4926eb2b
9 changed files with 61 additions and 111 deletions

View File

@@ -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>

View File

@@ -1,95 +1,16 @@
.create-service-wrapper {
padding: 6px 0 12px;
}
.order-header {
font-size: $uni-font-size-base;
font-weight: 500;
margin-bottom: 10px;
color: $uni-text-color;
height: 48px;
}
.order-content {
width: 100%;
box-sizing: border-box;
background-color: #fff;
padding: 12px;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.detail-item {
display: flex;
align-items: start;
margin-bottom: 12px;
font-size: $uni-font-size-base;
color: $uni-text-color;
}
.detail-label {
width: 70px;
white-space: nowrap;
}
.detail-value {
font-size: $uni-font-size-base;
color: $uni-text-color;
}
.detail-textarea {
width: 100%;
font-size: $uni-font-size-base;
color: $uni-text-color;
border-radius: 4px;
border: 1px solid #ddd;
padding: 8px;
}
.detail-input {
border: none;
outline: none;
width: 100%;
font-size: $uni-font-size-base;
color: $uni-text-color;
border-bottom: 1px solid #ddd;
padding-left: 8px;
}
.order-button {
width: 300px;
height: 42px;
color: #fff;
font-size: $uni-font-size-base;
font-weight: 600;
border-radius: 21px;
margin-top: 24px;
display: flex;
align-items: center;
justify-content: center;
}
.submit-button {
background: linear-gradient(179deg, #00a6ff 0%, #0256ff 100%);
}
.look-button {
background: linear-gradient(90deg, #0256ff, #00a6ff);
}
.footer-help {
margin-bottom: 12px;
display: flex;
align-items: center;
font-size: $uni-font-size-base;
color: #ed6a0c;
width: 335px;
}
.help-icon {
width: 16px;
height: 14px;
margin-right: 5px;
height: 16px;
}
.help-text {
margin-right: 5px;
.btn {
height: 44px;
}