fixed
This commit is contained in:
parent
f2ef51b939
commit
5b4701c0f9
@ -1,128 +1,77 @@
|
||||
<template>
|
||||
<mobile-sub-layout
|
||||
:title="$t('account.header.feedbackTitle')"
|
||||
:lineHeight="4"
|
||||
>
|
||||
<view class="feed-back-body">
|
||||
<view
|
||||
class="feed-back-content"
|
||||
:style="{ backgroundColor: themeStore.theme.account.feedBack.lightBgColor }"
|
||||
>
|
||||
<view
|
||||
class="feed-back-content-item"
|
||||
:style="{ color: themeStore.theme.account.feedBack.text.lable }"
|
||||
>
|
||||
<view class="feed-back-content-item-left"
|
||||
>{{ $t("account.feedBack.label.yourId") }}:</view
|
||||
>
|
||||
<view class="feed-back-content-item-right">{{ params.userId }}</view>
|
||||
</view>
|
||||
<view
|
||||
class="feed-back-content-item"
|
||||
:style="{ color: themeStore.theme.account.feedBack.text.lable }"
|
||||
>
|
||||
<view class="feed-back-content-item-left"
|
||||
>{{ $t("account.feedBack.label.phoneNumber") }}:</view
|
||||
>
|
||||
<view class="feed-back-content-item-right" v-if="!isShowInput"
|
||||
>{{ appStore.phoneNumberPrefix }}
|
||||
{{ params.phone.replace(appStore.phoneNumberPrefix.replace('+', ''), '') }}
|
||||
</view>
|
||||
<template v-else>
|
||||
<view style="width: 70rpx; margin-left: 24rpx">{{
|
||||
appStore.phoneNumberPrefix
|
||||
}}</view>
|
||||
<input
|
||||
class="feed-back-content-item-input"
|
||||
:style="{
|
||||
color: themeStore.theme.account.feedBack.text.inputColor,
|
||||
backgroundColor: themeStore.theme.account.feedBack.placeHolderBgColor }"
|
||||
v-model="params.phone"
|
||||
:placeholder-style="
|
||||
JSON.stringify({ color: themeStore.theme.account.feedBack.text.placeHolderColor })
|
||||
"
|
||||
:placeholder="$t('account.feedBack.label.phonePlaceholder')"
|
||||
/></template>
|
||||
</view>
|
||||
<view class="feed-back-content-item" style="margin-top: 10rpx">
|
||||
<view
|
||||
class="feed-back-content-item-left"
|
||||
:style="{ color: themeStore.theme.account.feedBack.text.lable }"
|
||||
>{{ $t("account.feedBack.label.email") }}:</view
|
||||
>
|
||||
<input
|
||||
class="feed-back-content-item-input"
|
||||
:style="{
|
||||
marginLeft: '24rpx',
|
||||
color: themeStore.theme.account.feedBack.text.inputColor,
|
||||
backgroundColor:themeStore.theme.account.feedBack.placeHolderBgColor}"
|
||||
v-model="params.email"
|
||||
:placeholder-style="
|
||||
JSON.stringify({ color: themeStore.theme.account.feedBack.text.placeHolderColor })
|
||||
"
|
||||
:placeholder="$t('account.feedBack.label.emailPlaceholder')"
|
||||
/>
|
||||
</view>
|
||||
<view
|
||||
class="feed-back-content-item-scenes"
|
||||
:style="{ color: themeStore.theme.account.feedBack.text.lable }"
|
||||
>
|
||||
<view class="feed-back-content-item-scenes-list">
|
||||
<view
|
||||
class="feed-back-content-item-scenes-list-item"
|
||||
v-for="(item, index) in scenes"
|
||||
:key="index"
|
||||
:style="{
|
||||
color:
|
||||
index == checkScene
|
||||
? themeStore.theme.account.feedBack.text.scenesItemActiveColor
|
||||
: themeStore.theme.account.feedBack.text.scenesItemColor,
|
||||
backgroundColor:
|
||||
index == checkScene
|
||||
? themeStore.theme.account.feedBack.scenesItemActiveBgColor
|
||||
: themeStore.theme.account.feedBack.scenesItemBgColor,
|
||||
}"
|
||||
@click="checkSceneClick(index)"
|
||||
>
|
||||
{{ item }}
|
||||
<mobile-sub-layout :title="$t('account.header.feedbackTitle')" :lineHeight="4">
|
||||
<view class="feed-back-body">
|
||||
<view class="feed-back-content"
|
||||
:style="{ backgroundColor: themeStore.theme.account.feedBack.lightBgColor }">
|
||||
<view class="feed-back-content-item" :style="{ color: themeStore.theme.account.feedBack.text.lable }">
|
||||
<view class="feed-back-content-item-left">{{ $t("account.feedBack.label.yourId") }}:</view>
|
||||
<view class="feed-back-content-item-right">{{ params.userId }}</view>
|
||||
</view>
|
||||
<view class="feed-back-content-item" :style="{ color: themeStore.theme.account.feedBack.text.lable }">
|
||||
<view class="feed-back-content-item-left">{{ $t("account.feedBack.label.phoneNumber") }}:</view>
|
||||
<view class="feed-back-content-item-right" v-if="!isShowInput">{{ appStore.phoneNumberPrefix }}
|
||||
{{ params.phone.replace(appStore.phoneNumberPrefix.replace('+', ''), '') }}
|
||||
</view>
|
||||
<template v-else>
|
||||
<view style="width: 70rpx; margin-left: 24rpx">
|
||||
{{ appStore.phoneNumberPrefix }}
|
||||
</view>
|
||||
<input class="feed-back-content-item-input" :style="{
|
||||
color: themeStore.theme.account.feedBack.text.inputColor,
|
||||
backgroundColor: themeStore.theme.account.feedBack.placeHolderBgColor
|
||||
}" v-model="params.phone" :placeholder-style="JSON.stringify({ color: themeStore.theme.account.feedBack.text.placeHolderColor })
|
||||
" :placeholder="$t('account.feedBack.label.phonePlaceholder')" />
|
||||
</template>
|
||||
</view>
|
||||
<view class="feed-back-content-item" style="margin-top: 10rpx">
|
||||
<view class="feed-back-content-item-left"
|
||||
:style="{ color: themeStore.theme.account.feedBack.text.lable }">{{
|
||||
$t("account.feedBack.label.email") }}:</view>
|
||||
<input class="feed-back-content-item-input" :style="{
|
||||
marginLeft: '24rpx',
|
||||
color: themeStore.theme.account.feedBack.text.inputColor,
|
||||
backgroundColor: themeStore.theme.account.feedBack.placeHolderBgColor
|
||||
}" v-model="params.email" :placeholder-style="JSON.stringify({ color: themeStore.theme.account.feedBack.text.placeHolderColor })
|
||||
" :placeholder="$t('account.feedBack.label.emailPlaceholder')" />
|
||||
</view>
|
||||
<view class="feed-back-content-item-scenes"
|
||||
:style="{ color: themeStore.theme.account.feedBack.text.lable }">
|
||||
<view class="feed-back-content-item-scenes-list">
|
||||
<view class="feed-back-content-item-scenes-list-item" v-for="(item, index) in scenes"
|
||||
:key="index" :style="{
|
||||
color:
|
||||
index == checkScene
|
||||
? themeStore.theme.account.feedBack.text.scenesItemActiveColor
|
||||
: themeStore.theme.account.feedBack.text.scenesItemColor,
|
||||
backgroundColor:
|
||||
index == checkScene
|
||||
? themeStore.theme.account.feedBack.scenesItemActiveBgColor
|
||||
: themeStore.theme.account.feedBack.scenesItemBgColor,
|
||||
}" @click="checkSceneClick(index)">
|
||||
{{ item }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="feed-back-content-item-textarea-label"
|
||||
:style="{ color: themeStore.theme.account.feedBack.text.lable }">{{
|
||||
$t("account.feedBack.label.suggestion") }}:</view>
|
||||
<view class="feed-back-content-item-textarea">
|
||||
<textarea type="textarea" rows="7" :placeholder-style="JSON.stringify({ color: themeStore.theme.account.feedBack.text.placeHolderColor })
|
||||
" :style="{
|
||||
color: themeStore.theme.account.feedBack.text.inputColor,
|
||||
backgroundColor: themeStore.theme.account.feedBack.placeHolderBgColor,
|
||||
}" v-model="params.content" class="feed-back-content-item-textarea-style"
|
||||
:placeholder="$t('account.feedBack.label.suggestionPlaceholder')" />
|
||||
</view>
|
||||
<view class="submit-content">
|
||||
<view class="submit-btn" :style="{
|
||||
background: themeStore.theme.button.normal,
|
||||
color: themeStore.theme.button.textNormal,
|
||||
}" @click="submit">{{ $t("account.button.submit") }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
class="feed-back-content-item-textarea-label"
|
||||
:style="{ color: themeStore.theme.account.feedBack.text.lable }"
|
||||
>{{ $t("account.feedBack.label.suggestion") }}:</view
|
||||
>
|
||||
<view class="feed-back-content-item-textarea">
|
||||
<textarea
|
||||
type="textarea"
|
||||
rows="7"
|
||||
:placeholder-style="
|
||||
JSON.stringify({ color: themeStore.theme.account.feedBack.text.placeHolderColor })
|
||||
"
|
||||
:style="{
|
||||
color: themeStore.theme.account.feedBack.text.inputColor,
|
||||
backgroundColor: themeStore.theme.account.feedBack.placeHolderBgColor,
|
||||
}"
|
||||
v-model="params.content"
|
||||
class="feed-back-content-item-textarea-style"
|
||||
:placeholder="$t('account.feedBack.label.suggestionPlaceholder')"
|
||||
/>
|
||||
</view>
|
||||
<view class="submit-content">
|
||||
<view
|
||||
class="submit-btn"
|
||||
:style="{
|
||||
background: themeStore.theme.button.normal,
|
||||
color: themeStore.theme.button.textNormal,
|
||||
}"
|
||||
@click="submit"
|
||||
>{{ $t("account.button.submit") }}</view
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</mobile-sub-layout>
|
||||
</mobile-sub-layout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
@ -138,176 +87,193 @@ const { t } = useI18n();
|
||||
const appStore = useAppStore();
|
||||
|
||||
let scenes = ref([
|
||||
t("account.feedBack.screen.game"),
|
||||
t("account.feedBack.screen.deposit"),
|
||||
t("account.feedBack.screen.withdraw"),
|
||||
t("account.feedBack.screen.vip"),
|
||||
t("account.feedBack.screen.invite"),
|
||||
t("account.feedBack.screen.account"),
|
||||
t("account.feedBack.screen.other"),
|
||||
t("account.feedBack.screen.game"),
|
||||
t("account.feedBack.screen.deposit"),
|
||||
t("account.feedBack.screen.withdraw"),
|
||||
t("account.feedBack.screen.vip"),
|
||||
t("account.feedBack.screen.invite"),
|
||||
t("account.feedBack.screen.account"),
|
||||
t("account.feedBack.screen.other"),
|
||||
]);
|
||||
let checkScene = ref(0);
|
||||
let isShowInput =
|
||||
userStore.userInfo.mobile == null || userStore.userInfo.mobile == ""
|
||||
? true
|
||||
: false;
|
||||
userStore.userInfo.mobile == null || userStore.userInfo.mobile == ""
|
||||
? true
|
||||
: false;
|
||||
let params = reactive({
|
||||
userId: userStore.userInfo.id,
|
||||
phone: userStore.userInfo.mobile == null ? "" : userStore.userInfo.mobile,
|
||||
email: "",
|
||||
content: "",
|
||||
appPackageName: appStore.packageName,
|
||||
userId: userStore.userInfo.id,
|
||||
phone: userStore.userInfo.mobile == null ? "" : userStore.userInfo.mobile,
|
||||
email: "",
|
||||
content: "",
|
||||
appPackageName: appStore.packageName,
|
||||
});
|
||||
/**
|
||||
* 选择 Scene
|
||||
*/
|
||||
const checkSceneClick = (index) => {
|
||||
checkScene.value = index;
|
||||
checkScene.value = index;
|
||||
};
|
||||
/**
|
||||
* 提交反馈
|
||||
*/
|
||||
const submit = async () => {
|
||||
const { code, data } = await updateFeedbackApi({
|
||||
type: checkScene.value,
|
||||
userId: params.userId,
|
||||
email: params.email,
|
||||
mobile: params.phone,
|
||||
content: params.content,
|
||||
appPackageName: params.appPackageName,
|
||||
});
|
||||
if (code == 200) {
|
||||
uni.navigateBack()
|
||||
}
|
||||
const { code, data } = await updateFeedbackApi({
|
||||
type: checkScene.value,
|
||||
userId: params.userId,
|
||||
email: params.email,
|
||||
mobile: params.phone,
|
||||
content: params.content,
|
||||
appPackageName: params.appPackageName,
|
||||
});
|
||||
if (code == 200) {
|
||||
uni.navigateBack()
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.feed-back-body {
|
||||
width: 100vw;
|
||||
height: calc(100vh - 88rpx);
|
||||
// background: #2c0303;
|
||||
box-sizing: border-box;
|
||||
padding-top: 10rpx;
|
||||
.feed-back-content {
|
||||
height: 100%;
|
||||
// background: #610606;
|
||||
width: 100vw;
|
||||
height: calc(100vh - 88rpx);
|
||||
// background: #2c0303;
|
||||
box-sizing: border-box;
|
||||
padding: 0 30rpx 30rpx 30rpx;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
.feed-back-content-item {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
height: 79rpx;
|
||||
line-height: 79rpx;
|
||||
// color: #fff;
|
||||
font-size: 30rpx;
|
||||
.feed-back-content-item-left {
|
||||
width: 231rpx;
|
||||
text-align: right;
|
||||
}
|
||||
.feed-back-content-item-right {
|
||||
margin-left: 24rpx;
|
||||
width: calc(100% - 255rpx);
|
||||
}
|
||||
.feed-back-content-item-input {
|
||||
border-radius: 20rpx;
|
||||
height: 79rpx;
|
||||
border: none;
|
||||
outline: none;
|
||||
padding-top: 10rpx;
|
||||
|
||||
.feed-back-content {
|
||||
height: 100%;
|
||||
// background: #610606;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20rpx;
|
||||
font-size: 26rpx;
|
||||
line-height: 79rpx;
|
||||
}
|
||||
.feed-back-content-item-input::placeholder {
|
||||
font-size: 26rpx;
|
||||
// color: #f98585;
|
||||
}
|
||||
}
|
||||
.feed-back-content-item-scenes {
|
||||
width: 100%;
|
||||
margin-top: 57rpx;
|
||||
// color: #fff;
|
||||
.feed-back-content-item-scenes-list::before {
|
||||
content: "Scenes:";
|
||||
width: 231rpx;
|
||||
text-align: right;
|
||||
line-height: 65rpx;
|
||||
margin-right: 20rpx;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.feed-back-content-item-scenes-list {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: wrap;
|
||||
.feed-back-content-item-scenes-list-item {
|
||||
width: 213rpx;
|
||||
height: 65rpx;
|
||||
// background: #963333;
|
||||
margin-bottom: 29rpx;
|
||||
border-radius: 33rpx;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
line-height: 65rpx;
|
||||
margin-right: 6rpx;
|
||||
padding: 0 30rpx 30rpx 30rpx;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
.feed-back-content-item {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
height: 79rpx;
|
||||
line-height: 79rpx;
|
||||
// color: #fff;
|
||||
font-size: 30rpx;
|
||||
|
||||
.feed-back-content-item-left {
|
||||
width: 231rpx;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.feed-back-content-item-right {
|
||||
margin-left: 24rpx;
|
||||
width: calc(100% - 255rpx);
|
||||
}
|
||||
|
||||
.feed-back-content-item-input {
|
||||
border-radius: 20rpx;
|
||||
height: 79rpx;
|
||||
border: none;
|
||||
outline: none;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20rpx;
|
||||
font-size: 26rpx;
|
||||
line-height: 79rpx;
|
||||
}
|
||||
|
||||
.feed-back-content-item-input::placeholder {
|
||||
font-size: 26rpx;
|
||||
// color: #f98585;
|
||||
}
|
||||
}
|
||||
.feed-back-content-item-scenes-list-item-active {
|
||||
// background: #f37e1c;
|
||||
|
||||
.feed-back-content-item-scenes {
|
||||
width: 100%;
|
||||
margin-top: 57rpx;
|
||||
|
||||
// color: #fff;
|
||||
.feed-back-content-item-scenes-list::before {
|
||||
content: "Scenes:";
|
||||
width: 231rpx;
|
||||
text-align: right;
|
||||
line-height: 65rpx;
|
||||
margin-right: 20rpx;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.feed-back-content-item-scenes-list {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.feed-back-content-item-scenes-list-item {
|
||||
width: 213rpx;
|
||||
height: 65rpx;
|
||||
// background: #963333;
|
||||
margin-bottom: 29rpx;
|
||||
border-radius: 33rpx;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
line-height: 65rpx;
|
||||
margin-right: 6rpx;
|
||||
}
|
||||
|
||||
.feed-back-content-item-scenes-list-item-active {
|
||||
// background: #f37e1c;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.feed-back-content-item-textarea-label {
|
||||
width: 231rpx;
|
||||
text-align: right;
|
||||
height: 79rpx;
|
||||
line-height: 79rpx;
|
||||
// color: #fff;
|
||||
}
|
||||
|
||||
.feed-back-content-item-textarea {
|
||||
width: 100%;
|
||||
margin-top: 25rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 0 30rpx;
|
||||
|
||||
.feed-back-content-item-textarea-style {
|
||||
width: 100%;
|
||||
height: 344rpx;
|
||||
// background: #3d0303;
|
||||
border-radius: 20rpx;
|
||||
border: none;
|
||||
outline: none;
|
||||
box-sizing: border-box;
|
||||
padding: 30rpx 20rpx;
|
||||
// color: #fff;
|
||||
line-height: 40rpx;
|
||||
direction: ltr;
|
||||
text-align: left;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.feed-back-content-item-textarea-style::placeholder {
|
||||
font-size: 26rpx;
|
||||
// color: #f98585;
|
||||
}
|
||||
}
|
||||
|
||||
.submit-content {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 25rpx;
|
||||
margin-top: 44rpx;
|
||||
|
||||
.submit-btn {
|
||||
width: 100%;
|
||||
height: 90rpx;
|
||||
// background: linear-gradient(90deg, #f78b22, #e34e04);
|
||||
border-radius: 45rpx;
|
||||
line-height: 90rpx;
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.feed-back-content-item-textarea-label {
|
||||
width: 231rpx;
|
||||
text-align: right;
|
||||
height: 79rpx;
|
||||
line-height: 79rpx;
|
||||
// color: #fff;
|
||||
}
|
||||
.feed-back-content-item-textarea {
|
||||
width: 100%;
|
||||
margin-top: 25rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 0 30rpx;
|
||||
.feed-back-content-item-textarea-style {
|
||||
width: 100%;
|
||||
height: 344rpx;
|
||||
// background: #3d0303;
|
||||
border-radius: 20rpx;
|
||||
border: none;
|
||||
outline: none;
|
||||
box-sizing: border-box;
|
||||
padding: 30rpx 20rpx;
|
||||
// color: #fff;
|
||||
line-height: 40rpx;
|
||||
direction: ltr;
|
||||
text-align: left;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.feed-back-content-item-textarea-style::placeholder {
|
||||
font-size: 26rpx;
|
||||
// color: #f98585;
|
||||
}
|
||||
}
|
||||
.submit-content {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 25rpx;
|
||||
margin-top: 44rpx;
|
||||
.submit-btn {
|
||||
width: 100%;
|
||||
height: 90rpx;
|
||||
// background: linear-gradient(90deg, #f78b22, #e34e04);
|
||||
border-radius: 45rpx;
|
||||
line-height: 90rpx;
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -158,11 +158,13 @@ import { requestOrderDetail } from "@/api/deposit.js";
|
||||
import Toast from "@/module/toast/toast.js";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { useDepositStore } from "@/store/useDepositStore.js";
|
||||
// import { useUserStore } from "@/store/useUserStore.js";
|
||||
|
||||
const { t } = useI18n();
|
||||
const themeStore = useThemeStore();
|
||||
const appStore = useAppStore();
|
||||
const depositStore = useDepositStore();
|
||||
// const userStore = useUserStore();
|
||||
|
||||
const pageData = reactive({
|
||||
orderId: "",
|
||||
|
||||
Loading…
Reference in New Issue
Block a user