feat: 优化迭代
This commit is contained in:
admin
parent
4910ed04cb
commit
efb6d77ed0
16
index.html
16
index.html
|
|
@ -3,18 +3,26 @@
|
|||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<script>
|
||||
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
|
||||
CSS.supports('top: constant(a)'))
|
||||
var coverSupport =
|
||||
"CSS" in window &&
|
||||
typeof CSS.supports === "function" &&
|
||||
(CSS.supports("top: env(a)") || CSS.supports("top: constant(a)"));
|
||||
document.write(
|
||||
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
|
||||
(coverSupport ? ', viewport-fit=cover' : '') + '" />')
|
||||
(coverSupport ? ", viewport-fit=cover" : "") +
|
||||
'" />'
|
||||
);
|
||||
</script>
|
||||
|
||||
<title></title>
|
||||
<!--preload-links-->
|
||||
<!--app-context-->
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"><!--app-html--></div>
|
||||
<div id="app"><!--app-html-->
|
||||
</div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,115 @@
|
|||
<template>
|
||||
<view
|
||||
@click="handleOnline"
|
||||
style="
|
||||
position: fixed;
|
||||
bottom: 100px;
|
||||
z-index: 999;
|
||||
right: 20px;
|
||||
background: #294ac7;
|
||||
border-radius: 50%;
|
||||
padding: 5px;
|
||||
"
|
||||
><up-icon name="chat" color="#fff" size="28"></up-icon
|
||||
></view>
|
||||
<!-- <view class="content">
|
||||
<movable-area class="movableArea">
|
||||
<movable-view
|
||||
class="movableView"
|
||||
:position="4"
|
||||
:x="x"
|
||||
:y="y"
|
||||
:direction="'none'"
|
||||
:damping="10"
|
||||
@change="onChange"
|
||||
@tap="onTap"
|
||||
@touchend="onTouchend"
|
||||
>
|
||||
<up-icon name="chat" color="#fff" size="28"></up-icon>
|
||||
</movable-view>
|
||||
</movable-area>
|
||||
</view> -->
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const x = ref(300);
|
||||
const y = ref(500);
|
||||
const x1 = ref(0);
|
||||
const x2 = ref(0);
|
||||
const y1 = ref(0);
|
||||
const y2 = ref(0);
|
||||
const move = reactive({
|
||||
x: 0,
|
||||
y: 0,
|
||||
});
|
||||
|
||||
const handleOnline = () => {
|
||||
//跳转到对应的webview页面并传入url和其他参数
|
||||
uni.navigateTo({
|
||||
url: "/pagesOnline/index",
|
||||
});
|
||||
};
|
||||
|
||||
function onChange(e: any) {
|
||||
if (e.detail.source === "touch") {
|
||||
move.x = e.detail.x;
|
||||
move.y = e.detail.y;
|
||||
}
|
||||
}
|
||||
function onTap(e: any) {
|
||||
console.log("Tap event");
|
||||
// 在这里处理单击事件的逻辑
|
||||
// 例如打开链接、执行动作等
|
||||
}
|
||||
function onTouchend() {
|
||||
x.value = move.x;
|
||||
y.value = move.y;
|
||||
setTimeout(() => {
|
||||
if (move.x < x2.value / 2) x.value = x1.value;
|
||||
else x.value = x2.value;
|
||||
console.log("yuan" + x.value, "y", y.value);
|
||||
}, 100);
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
uni.getSystemInfo({
|
||||
success: (res: any) => {
|
||||
x1.value = 0;
|
||||
x2.value = parseInt(res.windowWidth) - 50;
|
||||
y1.value = 0;
|
||||
y2.value = parseInt(res.windowHeight) - 20;
|
||||
setTimeout(() => {
|
||||
x.value = x2.value;
|
||||
y.value = parseInt((y2.value * 0.8).toString());
|
||||
move.x = x.value;
|
||||
move.y = y.value;
|
||||
}, 0);
|
||||
},
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<style scoped>
|
||||
.content {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.movableArea {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
pointer-events: none;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.movableView {
|
||||
pointer-events: auto;
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
padding: 10rpx;
|
||||
border-radius: 100%;
|
||||
border: 2px solid #294ac7;
|
||||
background-color: #294ac7;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -134,7 +134,7 @@
|
|||
}
|
||||
&--submit {
|
||||
// background: #5773f9;
|
||||
background-color: $u-primary;;
|
||||
background-color: $u-primary;
|
||||
color: #fff;
|
||||
}
|
||||
&--delete {
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@
|
|||
},
|
||||
/* 小程序特有相关 */
|
||||
"mp-weixin" : {
|
||||
"appid" : "wx9251d74fe0e87028",
|
||||
"appid" : "wx3c231250b822fbf5",
|
||||
"logoPath" : "https://backend-common.obs.cn-east-3.myhuaweicloud.com/static/pagesLogin/logo-simple.png",
|
||||
"setting" : {
|
||||
"urlCheck" : false
|
||||
|
|
|
|||
|
|
@ -12,6 +12,13 @@
|
|||
}
|
||||
},
|
||||
"pages": [
|
||||
// {
|
||||
// "path": "pagesLogin/index",
|
||||
// "style": {
|
||||
// // "navigationStyle": "custom", // 控制头部是否显示
|
||||
// "navigationBarTitleText": "登陆"
|
||||
// }
|
||||
// },
|
||||
{
|
||||
"path": "pagesHome/index",
|
||||
"style": {
|
||||
|
|
@ -85,11 +92,17 @@
|
|||
}
|
||||
},
|
||||
{
|
||||
"path": "registration",
|
||||
"path": "regisList",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我要登记"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "registration",
|
||||
"style": {
|
||||
"navigationBarTitleText": "登记信息"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "recycleFlow",
|
||||
"style": {
|
||||
|
|
@ -101,9 +114,55 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "所需材料"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "recovery",
|
||||
"style": {
|
||||
"navigationBarTitleText": "登记信息"
|
||||
}
|
||||
},
|
||||
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pagesOnline",
|
||||
"pages": [
|
||||
{
|
||||
"path": "index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "在线咨询"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pagesOrder",
|
||||
"pages": [
|
||||
{
|
||||
"path": "vehicle/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "报废车辆回收"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "vehicle/detail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单详情"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
// {
|
||||
// "root": "pagesLogin",
|
||||
// "pages": [
|
||||
// {
|
||||
// "path": "index",
|
||||
// "style": {
|
||||
// "navigationBarTitleText": "登陆"
|
||||
// }
|
||||
// }
|
||||
// ]
|
||||
// }
|
||||
],
|
||||
"tabBar": {
|
||||
"color": "#7A7E83",
|
||||
|
|
|
|||
|
|
@ -87,11 +87,13 @@
|
|||
>
|
||||
</view>
|
||||
</uni-card>
|
||||
<OpOnline />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import CustomSwiper from "@/components/CustomSwiper/index.vue";
|
||||
import OpOnline from "@/components/OpOnline/index.vue";
|
||||
import { url } from "@/utils/data";
|
||||
|
||||
const bannerList = [
|
||||
|
|
@ -186,7 +188,7 @@ const handleClick = (item: any) => {
|
|||
});
|
||||
};
|
||||
|
||||
const callNumber = (number:any) => {
|
||||
const callNumber = (number: any) => {
|
||||
// 判断是否为移动端
|
||||
if (
|
||||
uni.getSystemInfoSync().platform === "android" ||
|
||||
|
|
|
|||
|
|
@ -1,16 +1,5 @@
|
|||
<template>
|
||||
<Layout>
|
||||
<!-- 轮播图 -->
|
||||
<!-- <button
|
||||
open-type="im"
|
||||
:data-im-id="'13918346152'"
|
||||
@im="imCallback"
|
||||
@error="onimError"
|
||||
class="animate-button"
|
||||
>
|
||||
点击咨询
|
||||
</button> -->
|
||||
|
||||
<CustomSwiper> </CustomSwiper>
|
||||
<!-- 入口 -->
|
||||
<view class="entry-card">
|
||||
|
|
@ -71,18 +60,15 @@
|
|||
/>
|
||||
</uni-card>
|
||||
</view>
|
||||
<OpOnline />
|
||||
</Layout>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import CustomSwiper from "@/components/CustomSwiper/index.vue";
|
||||
import OpOnline from "@/components/OpOnline/index.vue";
|
||||
import Layout from "@/components/Layout/index.vue";
|
||||
import { url } from "@/utils/data";
|
||||
const bannerList = [
|
||||
{
|
||||
imgUrl: "v-a1.png",
|
||||
},
|
||||
];
|
||||
|
||||
const entryItemList = ref([
|
||||
{
|
||||
|
|
@ -107,14 +93,6 @@ const handleClick = (item: any) => {
|
|||
url: item.url, // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
|
||||
const imCallback = (e: any) => {
|
||||
console.log("跳转IM客服成功", e.detail);
|
||||
};
|
||||
|
||||
const onimError = (e: any) => {
|
||||
console.log("拉起IM客服失败", e.detail);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
|||
|
|
@ -3,16 +3,46 @@
|
|||
<view class="profile">
|
||||
<view class="baseinfo">
|
||||
<view class="head">
|
||||
<image :src="`${url}/static/img/profile/user.png`" class="user"></image>
|
||||
<image
|
||||
:src="`${url}/static/img/profile/user.png`"
|
||||
class="user"
|
||||
></image>
|
||||
<view>
|
||||
<view>
|
||||
<text class="name">{{ '用户' || "-" }}</text>
|
||||
<text class="name">{{ "用户" || "-" }}</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="company">{{ '-' || "-" }}</text>
|
||||
<text class="company">{{ "-" || "-" }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="entry-card">
|
||||
<uni-card
|
||||
:shadow="'0rpx 0rpx 10rpx 0rpx rgba(5,68,37,0.12)'"
|
||||
:padding="'10px'"
|
||||
:margin="'10px 0px'"
|
||||
:border="false"
|
||||
>
|
||||
<view class="title">我的订单</view>
|
||||
<uni-grid :column="3" :showBorder="false" :square="false">
|
||||
<uni-grid-item
|
||||
v-for="(item, index) in entryItemList"
|
||||
:key="index"
|
||||
>
|
||||
<view class="item">
|
||||
<view @click="handleClickEntry(item)">
|
||||
<view>
|
||||
<image :src="`${url}/static/img/${item.path}`"></image>
|
||||
</view>
|
||||
<view>
|
||||
<text class="text">{{ item.name }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
</uni-grid>
|
||||
</uni-card>
|
||||
</view>
|
||||
<view class="content">
|
||||
<u-list :height="'200px'">
|
||||
<u-list-item v-for="(item, index) in list" :key="index">
|
||||
|
|
@ -45,6 +75,10 @@
|
|||
import Layout from "@/components/Layout/index.vue";
|
||||
import { url } from "@/utils/data";
|
||||
const list = reactive([
|
||||
{
|
||||
name: "收款信息",
|
||||
icon: "4.png",
|
||||
},
|
||||
{
|
||||
name: "用户协议",
|
||||
icon: "4.png",
|
||||
|
|
@ -55,6 +89,30 @@ const list = reactive([
|
|||
},
|
||||
]);
|
||||
|
||||
const entryItemList = ref([
|
||||
{
|
||||
path: "1.png",
|
||||
name: "报废车辆回收",
|
||||
url: "/pagesOrder/vehicle/index",
|
||||
},
|
||||
{
|
||||
path: "2.png",
|
||||
name: "电池回收",
|
||||
url: "/pagesBattery/index",
|
||||
},
|
||||
{
|
||||
path: "3.png",
|
||||
name: "加入我们",
|
||||
url: "/pagesScrapSteel/index",
|
||||
},
|
||||
]);
|
||||
|
||||
const handleClickEntry = (item: any) => {
|
||||
uni.navigateTo({
|
||||
url: item.url, // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
|
||||
const hanldeClick = (item: any) => {
|
||||
if (item.name === "用户协议") {
|
||||
openDoc("在生万有用户协议");
|
||||
|
|
@ -65,10 +123,16 @@ const hanldeClick = (item: any) => {
|
|||
|
||||
const openDoc = (item: string) => {
|
||||
//文件预览
|
||||
const isWX = uni.getSystemInfoSync().uniPlatform === 'mp-weixin'
|
||||
console.log(`${url}/static/${isWX && (item === '在生万有隐私政策') ? 'weixin/' : ''}${item}.docx`)
|
||||
const isWX = uni.getSystemInfoSync().uniPlatform === "mp-weixin";
|
||||
console.log(
|
||||
`${url}/static/${
|
||||
isWX && item === "在生万有隐私政策" ? "weixin/" : ""
|
||||
}${item}.docx`
|
||||
);
|
||||
uni.downloadFile({
|
||||
url: `${url}/static/${isWX && (item === '在生万有隐私政策') ? 'weixin/' : ''}${item}.docx`,
|
||||
url: `${url}/static/${
|
||||
isWX && item === "在生万有隐私政策" ? "weixin/" : ""
|
||||
}${item}.docx`,
|
||||
success: function (res) {
|
||||
setTimeout(
|
||||
() =>
|
||||
|
|
@ -95,24 +159,24 @@ const openDoc = (item: string) => {
|
|||
});
|
||||
};
|
||||
|
||||
//隐藏官方的tabBar
|
||||
// #ifdef MP-ALIPAY
|
||||
my.hideTabBar({
|
||||
animation: false, // 是否需要动画效果，alipay 1.95.0支持此参数
|
||||
success: (res) => {
|
||||
// 隐藏成功的回调
|
||||
console.log("TabBar has been hidden", res);
|
||||
},
|
||||
fail: (err) => {
|
||||
// 隐藏失败的回调
|
||||
console.error("Failed to hide TabBar", err);
|
||||
},
|
||||
});
|
||||
// #endif
|
||||
//隐藏官方的tabBar
|
||||
// #ifdef MP-ALIPAY
|
||||
my.hideTabBar({
|
||||
animation: false, // 是否需要动画效果，alipay 1.95.0支持此参数
|
||||
success: (res) => {
|
||||
// 隐藏成功的回调
|
||||
console.log("TabBar has been hidden", res);
|
||||
},
|
||||
fail: (err) => {
|
||||
// 隐藏失败的回调
|
||||
console.error("Failed to hide TabBar", err);
|
||||
},
|
||||
});
|
||||
// #endif
|
||||
|
||||
// #ifndef MP-ALIPAY
|
||||
uni.hideTabBar();
|
||||
// #endif
|
||||
// #ifndef MP-ALIPAY
|
||||
uni.hideTabBar();
|
||||
// #endif
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -157,6 +221,27 @@ const openDoc = (item: string) => {
|
|||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.entry-card {
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
.item {
|
||||
text-align: center;
|
||||
image {
|
||||
width: 74rpx;
|
||||
height: 76rpx;
|
||||
}
|
||||
.text {
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
line-height: 42rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,298 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="title">欢迎使用在生万有回收平台</view>
|
||||
<view class="logo">
|
||||
<image :src="`${url}/static/img/logo.png`"></image>
|
||||
</view>
|
||||
<view class="login-form">
|
||||
<u-form
|
||||
labelPosition="left"
|
||||
:model="model1"
|
||||
:rules="rules"
|
||||
ref="loginForm"
|
||||
:labelWidth="0"
|
||||
>
|
||||
<u-form-item prop="userInfo.phone">
|
||||
<u-input
|
||||
v-model="model1.userInfo.phone"
|
||||
placeholder="请输入手机号"
|
||||
:shape="'circle'"
|
||||
clearable
|
||||
:customStyle="{
|
||||
'border-color':
|
||||
currentFocus === 'phone' ? '#00dcee !important' : '',
|
||||
}"
|
||||
border="none"
|
||||
type="number"
|
||||
@focus="handleFocus('phone')"
|
||||
@change="(e:any) => {handleInput(e, 'phone')}"
|
||||
@clear="handleClear({ key: 'phone' })"
|
||||
>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
<u-form-item prop="userInfo.code">
|
||||
<u-input
|
||||
v-model="model1.userInfo.code"
|
||||
placeholder="请输入验证码"
|
||||
:shape="'circle'"
|
||||
type="text"
|
||||
border="none"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="seconds === 0" class="code_text" @click="getCode"
|
||||
>获取验证码</text
|
||||
>
|
||||
<text v-else class="code_text">{{ seconds }}s后重新发送</text>
|
||||
</template>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
<view class="login-btn">
|
||||
<u-button
|
||||
@click="submit"
|
||||
type="primary"
|
||||
:customStyle="{
|
||||
'border-radius': '43rpx',
|
||||
}"
|
||||
>立即登录</u-button
|
||||
>
|
||||
<view class="agree">
|
||||
<u-checkbox
|
||||
:key="1"
|
||||
:size="'28rpx'"
|
||||
:activeColor="'#00dcee'"
|
||||
:name="1"
|
||||
:usedAlone="true"
|
||||
:checked="checkGroup.agreeCheck"
|
||||
@change="
|
||||
(v:any) => {
|
||||
checkGroup.agreeCheck = v;
|
||||
}
|
||||
"
|
||||
></u-checkbox>
|
||||
<view>
|
||||
我已阅读并同意在生万有
|
||||
<text class="agree-item" @click="openDoc('在生万有用户协议')"
|
||||
>《 用户协议 》</text
|
||||
>
|
||||
和
|
||||
<text class="agree-item" @click="openDoc('在生万有隐私政策')"
|
||||
>《 隐私政策 》</text
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Layout from "@/components/Layout/index.vue";
|
||||
import { useMemberStore } from "@/store/index";
|
||||
import valid from "@/utils/validate";
|
||||
import pinia from "@/store";
|
||||
import { onShow } from "@dcloudio/uni-app";
|
||||
import { url } from "@/utils/data";
|
||||
|
||||
const handleClear = (item: any) => {
|
||||
setTimeout(() => {
|
||||
(model1.userInfo as any)[item.key] = "";
|
||||
}, 100);
|
||||
};
|
||||
const store = useMemberStore(pinia);
|
||||
const loginForm = ref(null);
|
||||
const model1 = reactive({
|
||||
userInfo: {
|
||||
phone: "",
|
||||
code: "",
|
||||
},
|
||||
});
|
||||
const seconds = ref(0);
|
||||
// 控制focus 边框样式
|
||||
const currentFocus = ref("");
|
||||
// 记住密码 // 同意协议
|
||||
const checkGroup = reactive({
|
||||
agreeCheck: false,
|
||||
});
|
||||
|
||||
const rules = ref({
|
||||
"userInfo.phone": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入手机号",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"userInfo.code": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入验证码",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
});
|
||||
|
||||
const getCode = () => {
|
||||
if (!valid.mobile.pattern.test(model1.userInfo.phone)) {
|
||||
uni.showToast({ icon: "none", title: "请输入正确的手机号" });
|
||||
return;
|
||||
}
|
||||
// ProfileApi.getCommonDbPhone({ phone: model1.userInfo.phone }).then(
|
||||
// (res: any) => {
|
||||
// if (res.code === 200) {
|
||||
// if (res.data.length > 0) {
|
||||
// store.setMechanism({mechanismCode: res.data[0].mechanismCode, mechanismName: res.data[0].mechanismName});
|
||||
// sendMsg();
|
||||
// } else {
|
||||
// uni.showToast({
|
||||
// title: "当前号码未加入货场",
|
||||
// icon: 'none'
|
||||
// });
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// );
|
||||
};
|
||||
const sendMsg = () => {
|
||||
// ProfileApi.sendMsg({ phone: model1.userInfo.phone }).then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// uni.$u.toast("验证码已发送");
|
||||
// seconds.value = 60;
|
||||
// let countDownTimer = setInterval(() => {
|
||||
// if (seconds.value > 0) {
|
||||
// --seconds.value;
|
||||
// } else {
|
||||
// clearInterval(countDownTimer);
|
||||
// }
|
||||
// }, 1000);
|
||||
// }
|
||||
// });
|
||||
};
|
||||
const handleInput = (e: any, key: string) => {
|
||||
if (key === "phone") {
|
||||
const temp = e?.replace(valid.valid_number, "");
|
||||
setTimeout(() => {
|
||||
(model1.userInfo as any)[key] = temp;
|
||||
}, 10);
|
||||
}
|
||||
};
|
||||
|
||||
const handleFocus = (attr: string) => {
|
||||
currentFocus.value = attr;
|
||||
};
|
||||
const submit = () => {
|
||||
if (model1.userInfo.phone) {
|
||||
if (!valid.mobile.pattern.test(model1.userInfo.phone)) {
|
||||
uni.showToast({ icon: "none", title: "请输入正确的手机号" });
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
(loginForm.value as any).validate().then((res: any) => {
|
||||
if (res) {
|
||||
if (!checkGroup.agreeCheck) {
|
||||
uni.showToast({
|
||||
title: "请同意协议",
|
||||
icon: "none",
|
||||
});
|
||||
return;
|
||||
}
|
||||
// ProfileApi.loginPhone(model1.userInfo).then((res: any) => {
|
||||
// if (res.code === 200) {
|
||||
// store.setProfile(res.data);
|
||||
// uni.reLaunch({
|
||||
// url: "/pagesHome/index", // 要跳转到的页面路径
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const openDoc = (item: string) => {
|
||||
//文件预览
|
||||
const isWX = uni.getSystemInfoSync().uniPlatform === "mp-weixin";
|
||||
console.log(
|
||||
`${url}/static/${
|
||||
isWX && item === "在生万有隐私政策" ? "weixin/" : ""
|
||||
}${item}.docx`
|
||||
);
|
||||
uni.downloadFile({
|
||||
url: `${url}/static/${
|
||||
isWX && item === "在生万有隐私政策" ? "weixin/" : ""
|
||||
}${item}.docx`,
|
||||
success: function (res) {
|
||||
setTimeout(
|
||||
() =>
|
||||
uni.openDocument({
|
||||
filePath: res.tempFilePath,
|
||||
showMenu: false,
|
||||
success: function () {
|
||||
console.log("打开文档成功");
|
||||
},
|
||||
fail: function () {
|
||||
uni.showToast({
|
||||
title: "暂不支持此类型",
|
||||
duration: 2000,
|
||||
icon: "none",
|
||||
});
|
||||
},
|
||||
}),
|
||||
100
|
||||
);
|
||||
},
|
||||
fail: function (res) {
|
||||
console.log(res); //失败
|
||||
},
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.title {
|
||||
text-align: center;
|
||||
font-size: 40rpx;
|
||||
font-weight: bold;
|
||||
padding: 100rpx 0rpx;
|
||||
}
|
||||
.logo {
|
||||
text-align: center;
|
||||
image {
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.login-form {
|
||||
margin-top: 50rpx;
|
||||
padding: 0rpx 50rpx;
|
||||
}
|
||||
::v-deep .u-form-item__body__right__content {
|
||||
border-radius: 100px;
|
||||
border: 1px solid #dadbde;
|
||||
}
|
||||
.custom-icon {
|
||||
width: 37.18rpx;
|
||||
height: 18.59rpx;
|
||||
}
|
||||
.login-btn {
|
||||
margin-top: 23.72rpx;
|
||||
}
|
||||
.agree {
|
||||
display: flex;
|
||||
font-size: 21rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
margin-top: 10rpx;
|
||||
align-items: flex-start;
|
||||
text-align: center;
|
||||
line-height: 41rpx;
|
||||
margin-top: 26.28rpx;
|
||||
.agree-item {
|
||||
color: $u-primary;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
.code_text {
|
||||
color: $u-primary;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<template>
|
||||
<view>
|
||||
<!-- 在这里使用 web-view 组件来嵌入 H5 页面 -->
|
||||
<web-view :src="url"></web-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
let url = 'https://ykf-weixin01.7moor.com/wapchat.html?accessId=2c6004e0-7631-11ef-90d7-f1a5ae18c977&fromUrl=http://&urlTitle=001&language=ZHCN&wechatOrAppImplant=true&otherParams={"nickName":"test001"}&clientId=13918346152'
|
||||
</script>
|
||||
|
|
@ -0,0 +1,155 @@
|
|||
<template>
|
||||
<view>
|
||||
<view></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { reactive } from 'vue';
|
||||
|
||||
const listMap = reactive({
|
||||
payment: {
|
||||
name: '打款信息',
|
||||
attrList: [
|
||||
{
|
||||
name: '打款时间',
|
||||
value: '',
|
||||
key: ''
|
||||
},
|
||||
{
|
||||
name: '打款金额',
|
||||
value: '',
|
||||
key: '',
|
||||
unit: '元'
|
||||
}
|
||||
]
|
||||
},
|
||||
settle: {
|
||||
name: '结算信息',
|
||||
attrList: [
|
||||
{
|
||||
name: '过磅重量',
|
||||
value: '',
|
||||
key: '',
|
||||
unit: 'KG'
|
||||
},
|
||||
{
|
||||
name: '结算金额',
|
||||
value: '',
|
||||
key: '',
|
||||
unit: '元'
|
||||
}
|
||||
]
|
||||
},
|
||||
room: {
|
||||
name: '上门服务',
|
||||
attrList: [
|
||||
{
|
||||
name: '上门时间',
|
||||
value: '',
|
||||
key: ''
|
||||
}
|
||||
]
|
||||
},
|
||||
regis: {
|
||||
name: '登记信息',
|
||||
attrList: [
|
||||
{
|
||||
name: '车辆所属',
|
||||
value: '',
|
||||
key: ''
|
||||
},
|
||||
{
|
||||
name: '联系人',
|
||||
value: '',
|
||||
key: ''
|
||||
},
|
||||
{
|
||||
name: '联系方式',
|
||||
value: '',
|
||||
key: ''
|
||||
},
|
||||
{
|
||||
name: '上门地址',
|
||||
value: '',
|
||||
key: ''
|
||||
}
|
||||
]
|
||||
},
|
||||
car: {
|
||||
name: '我要选新车',
|
||||
attrList: [
|
||||
{
|
||||
name: '选择品牌',
|
||||
value: '',
|
||||
key: ''
|
||||
},
|
||||
{
|
||||
name: '预算范围',
|
||||
value: '',
|
||||
key: ''
|
||||
}
|
||||
]
|
||||
},
|
||||
vehicle: {
|
||||
name: '车辆信息',
|
||||
attrList: [
|
||||
{
|
||||
name: '行驶证',
|
||||
value: '',
|
||||
key: ''
|
||||
},
|
||||
{
|
||||
name: '车辆类型',
|
||||
value: '',
|
||||
key: ''
|
||||
},
|
||||
{
|
||||
name: '燃油类别',
|
||||
value: '',
|
||||
key: ''
|
||||
},
|
||||
{
|
||||
name: '钢圈材质',
|
||||
value: '',
|
||||
key: ''
|
||||
},
|
||||
{
|
||||
name: '整车质量',
|
||||
value: '',
|
||||
key: '',
|
||||
unit: 'KG'
|
||||
},
|
||||
{
|
||||
name: '车架号',
|
||||
value: '',
|
||||
key: ''
|
||||
},
|
||||
{
|
||||
name: '品牌型号',
|
||||
value: '',
|
||||
key: ''
|
||||
},
|
||||
{
|
||||
name: '系列',
|
||||
value: '',
|
||||
key: ''
|
||||
},
|
||||
{
|
||||
name: '总重量',
|
||||
value: '',
|
||||
key: '',
|
||||
unit: 'KG'
|
||||
},
|
||||
{
|
||||
name: '车牌号',
|
||||
value: '',
|
||||
key: ''
|
||||
}
|
||||
]
|
||||
},
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
|
|
@ -0,0 +1,97 @@
|
|||
<template>
|
||||
<view>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
<view class="box">
|
||||
<uni-table stripe emptyText="暂无订单数据">
|
||||
<!-- 表头行 -->
|
||||
<uni-tr>
|
||||
<uni-th v-for="(item, index) in tableTitleList" :key="index"
|
||||
>{{ item.name }}
|
||||
</uni-th>
|
||||
</uni-tr>
|
||||
<!-- 表格数据行 -->
|
||||
<uni-tr v-for="(item, index) in []" :key="index">
|
||||
<uni-td v-for="(tItem, index) in tableTitleList" :key="index">{{
|
||||
item[tItem.key]
|
||||
}}</uni-td>
|
||||
</uni-tr>
|
||||
</uni-table>
|
||||
</view>
|
||||
<view class="btn-box-fix-btn">
|
||||
<view
|
||||
><u-button type="primary" shape="circle" @click="goInquiry()">去询价</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { VehicleApi } from "@/services";
|
||||
import pinia from "@/store";
|
||||
import { useMemberStore } from "@/store/index";
|
||||
const tableTitleList = reactive([
|
||||
{
|
||||
name: "时间",
|
||||
key: "paymentName",
|
||||
},
|
||||
{
|
||||
name: "状态",
|
||||
key: "paymentPrice",
|
||||
},
|
||||
{
|
||||
name: "品牌型号",
|
||||
key: "revenuePrice",
|
||||
},
|
||||
{
|
||||
name: "总重量",
|
||||
key: "revenuePrice",
|
||||
},
|
||||
{
|
||||
name: "预估价格",
|
||||
key: "revenuePrice",
|
||||
},
|
||||
{
|
||||
name: "过磅重量",
|
||||
key: "revenuePrice",
|
||||
},
|
||||
{
|
||||
name: "实际价格",
|
||||
key: "revenuePrice",
|
||||
},
|
||||
]);
|
||||
// VehicleApi.queryRegis({
|
||||
// startTime: "2024-09-01 00:00:00",
|
||||
// endTime: "2024-09-30 23:59:59",
|
||||
// }).then((res:any) => {
|
||||
// if(res.code === 200) {
|
||||
// res.data.list
|
||||
// }
|
||||
// });
|
||||
|
||||
const goInquiry = () => {
|
||||
uni.navigateTo({
|
||||
url: '/pagesVehicle/inquiry', // 要跳转到的页面路径
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.btn-box-fix-btn {
|
||||
justify-content: center;
|
||||
view {
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
.regis {
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
padding-top: 15px;
|
||||
width: 100% !important;
|
||||
color: $u-primary;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -77,11 +77,13 @@
|
|||
>
|
||||
</view>
|
||||
</uni-card>
|
||||
<OpOnline/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import CustomSwiper from "@/components/CustomSwiper/index.vue";
|
||||
import OpOnline from "@/components/OpOnline/index.vue";
|
||||
import { url } from "@/utils/data";
|
||||
const bannerList = [
|
||||
{
|
||||
|
|
@ -108,7 +110,7 @@ const entryItemList = ref([
|
|||
{
|
||||
path: "4.png",
|
||||
name: "我要登记",
|
||||
url: "/pagesVehicle/registration",
|
||||
url: "/pagesVehicle/regisList",
|
||||
},
|
||||
]);
|
||||
const serviceItemList = ref([
|
||||
|
|
|
|||
|
|
@ -4,86 +4,111 @@
|
|||
:margin="'20px'"
|
||||
:border="false"
|
||||
>
|
||||
<view class="uni-card__content">
|
||||
<view class="title">车辆信息</view>
|
||||
<u-form
|
||||
labelPosition="left"
|
||||
:model="model1"
|
||||
:rules="rules"
|
||||
ref="form"
|
||||
:labelWidth="80"
|
||||
:labelStyle="{ padding: '0rpx 10rpx' }"
|
||||
:errorType="'border-bottom'"
|
||||
>
|
||||
<u-form-item
|
||||
:prop="`formData.${item.key}`"
|
||||
:label="item.name"
|
||||
:required="item.required"
|
||||
v-for="(item, index) in formAttrList"
|
||||
:key="index"
|
||||
@click="item.fn"
|
||||
<view class="uni-card__content">
|
||||
<view class="title">车辆信息</view>
|
||||
<u-form
|
||||
labelPosition="left"
|
||||
:model="model1"
|
||||
:rules="rules"
|
||||
ref="form"
|
||||
:labelWidth="80"
|
||||
:labelStyle="{ padding: '0rpx 10rpx' }"
|
||||
:errorType="'border-bottom'"
|
||||
>
|
||||
<u-input
|
||||
v-if="item.type === 'input'"
|
||||
v-model="(model1.formData as any)[item.key]"
|
||||
:placeholder="`请输入${item.name}`"
|
||||
clearable
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
:disabled="item.disabled"
|
||||
:type="
|
||||
['contactInfo', 'curbWeight'].indexOf(item.key) > -1
|
||||
? 'number'
|
||||
: 'text'
|
||||
"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.unit">
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
<u-input
|
||||
v-if="item.type === 'select'"
|
||||
:disabled="true"
|
||||
:disabledColor="'#ffffff'"
|
||||
v-model="(model1.formData as any)[item.key]"
|
||||
:placeholder="`请选择${item.name}`"
|
||||
clearable
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.unit">
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
|
||||
<!-- 上传 -->
|
||||
<view v-if="item.type === 'upload'">
|
||||
<view>（拍照上传后自动识别车辆信息）</view>
|
||||
<view style="padding-left: 20rpx; margin-top: 20rpx">
|
||||
<image
|
||||
@click="handleUpload"
|
||||
:src="
|
||||
model1.formData.licensePhotoUrl ||
|
||||
`${url}/static/img/vehicle/upload.png`
|
||||
"
|
||||
style="width: 203rpx; height: 133rpx"
|
||||
/>
|
||||
</view>
|
||||
<view style="padding-left: 20rpx; margin-top: 10rpx"
|
||||
>点击上传行驶证主页</view
|
||||
<view v-for="(item, index) in formAttrList" :key="index">
|
||||
<u-form-item
|
||||
v-if="item.name !== '行驶证'"
|
||||
:prop="`formData.${item.key}`"
|
||||
:label="item.name"
|
||||
:required="item.required"
|
||||
@click="item.fn"
|
||||
>
|
||||
</view>
|
||||
<template #right v-if="item.type === 'select'">
|
||||
<u-icon name="arrow-right" @click="item.fn"></u-icon>
|
||||
</template>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
</view>
|
||||
<u-input
|
||||
v-if="item.type === 'input'"
|
||||
v-model="(model1.formData as any)[item.key]"
|
||||
:placeholder="`请输入${item.name}`"
|
||||
clearable
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
:disabled="item.disabled"
|
||||
:type="
|
||||
['contactInfo', 'curbWeight'].indexOf(item.key) > -1
|
||||
? 'number'
|
||||
: 'text'
|
||||
"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.unit">
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
<u-input
|
||||
v-if="item.type === 'select'"
|
||||
:disabled="true"
|
||||
:disabledColor="'#ffffff'"
|
||||
v-model="(model1.formData as any)[item.key]"
|
||||
:placeholder="`请选择${item.name}`"
|
||||
clearable
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.unit">
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
<template #right v-if="item.type === 'select'">
|
||||
<u-icon name="arrow-right" @click="item.fn"></u-icon>
|
||||
</template>
|
||||
</u-form-item>
|
||||
<view v-else-if="item.name === '行驶证'">
|
||||
<view style="padding: 22rpx">
|
||||
<text style="color: #f56c6c; font-size: 20px; margin-right: 5px"
|
||||
>*</text
|
||||
>
|
||||
<text style="color: #303133; font-size: 15px; line-height: 22px"
|
||||
>行驶证</text
|
||||
>（拍照上传后自动识别车辆信息）</view
|
||||
>
|
||||
<view style="display: flex; justify-content: space-around">
|
||||
<view>
|
||||
<view style="padding-left: 20rpx; margin-top: 20rpx">
|
||||
<image
|
||||
@click="handleUpload"
|
||||
:src="
|
||||
model1.formData.licensePhotoUrl ||
|
||||
`${url}/static/img/vehicle/upload.png`
|
||||
"
|
||||
style="width: 203rpx; height: 133rpx"
|
||||
/>
|
||||
</view>
|
||||
<view style="padding-left: 20rpx; margin-top: 10rpx"
|
||||
>点击上传行驶证主页</view
|
||||
>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<view style="padding-left: 20rpx; margin-top: 20rpx">
|
||||
<image
|
||||
@click="handleUpload"
|
||||
:src="
|
||||
model1.formData.licensePhotoUrl ||
|
||||
`${url}/static/img/vehicle/upload.png`
|
||||
"
|
||||
style="width: 203rpx; height: 133rpx"
|
||||
/>
|
||||
</view>
|
||||
<view style="padding-left: 20rpx; margin-top: 10rpx"
|
||||
>点击上传行驶证副页</view
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-form>
|
||||
</view>
|
||||
</uni-card>
|
||||
|
||||
<view class="btn-box-fix-btn">
|
||||
|
|
@ -105,6 +130,34 @@
|
|||
:closeOnClickAction="true"
|
||||
></u-action-sheet>
|
||||
</block>
|
||||
|
||||
<up-modal
|
||||
title="你的爱车回收参考价为"
|
||||
:show="true"
|
||||
closeOnClickOverlay
|
||||
showCancelButton
|
||||
contentTextAlign="center"
|
||||
>
|
||||
<view>
|
||||
<view class="price"> 9999元</view>
|
||||
<view class="tip">
|
||||
注：该价格为参考价格，实际价格根据过磅重量进行结算</view
|
||||
>
|
||||
</view>
|
||||
<template #confirmButton>
|
||||
<up-button
|
||||
text="我已知悉 去登记"
|
||||
shape="circle"
|
||||
type="primary"
|
||||
@click="goRegis"
|
||||
></up-button>
|
||||
<view class="mt-30">
|
||||
<up-button text="暂不登记" shape="circle" @click="handleBack"></up-button>
|
||||
</view>
|
||||
|
||||
<!-- @click="show8 = false" -->
|
||||
</template>
|
||||
</up-modal>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
|
|
@ -118,20 +171,20 @@ const model1 = reactive<any>({
|
|||
formData: {},
|
||||
});
|
||||
const formAttrList = reactive<any>([
|
||||
{
|
||||
name: "姓名",
|
||||
key: "name",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "联系方式",
|
||||
key: "contactInfo",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
// {
|
||||
// name: "姓名",
|
||||
// key: "name",
|
||||
// type: "input",
|
||||
// required: true,
|
||||
// unit: "",
|
||||
// },
|
||||
// {
|
||||
// name: "联系方式",
|
||||
// key: "contactInfo",
|
||||
// type: "input",
|
||||
// required: true,
|
||||
// unit: "",
|
||||
// },
|
||||
{
|
||||
name: "行驶证",
|
||||
key: "",
|
||||
|
|
@ -184,21 +237,35 @@ const formAttrList = reactive<any>([
|
|||
name: "车架号",
|
||||
key: "vin",
|
||||
type: "input",
|
||||
required: false,
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "品牌型号",
|
||||
key: "brandModel",
|
||||
type: "input",
|
||||
required: false,
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "系列",
|
||||
key: "series",
|
||||
type: "input",
|
||||
required: false,
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "总重量",
|
||||
key: "series",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "车牌号",
|
||||
key: "series",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
]);
|
||||
|
|
@ -300,7 +367,7 @@ const handleSelect = (key: string, v: any) => {
|
|||
};
|
||||
// 授权
|
||||
const handleUpload = () => {
|
||||
upload()
|
||||
upload();
|
||||
// uni.authorize({
|
||||
// // #ifdef MP-TOUTIAO
|
||||
// scope: "scope.album, scope.writePhotosAlbum,scope.camera",
|
||||
|
|
@ -437,6 +504,18 @@ const startSave = () => {
|
|||
}
|
||||
});
|
||||
};
|
||||
|
||||
const goRegis = () => {
|
||||
uni.navigateTo({
|
||||
url: '/pagesVehicle/registration', // 要跳转到的页面路径
|
||||
});
|
||||
}
|
||||
|
||||
const handleBack = () => {
|
||||
uni.navigateBack();
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.uni-card__content {
|
||||
|
|
@ -444,11 +523,6 @@ const startSave = () => {
|
|||
height: calc(100vh - 100px);
|
||||
overflow: auto;
|
||||
}
|
||||
// ::v-deep .uni-card__content {
|
||||
// padding: 10px !important;
|
||||
// height: calc(100vh - 100px);
|
||||
// overflow: auto;
|
||||
// }
|
||||
::v-deep .uni-card--shadow {
|
||||
padding: 0px !important;
|
||||
}
|
||||
|
|
@ -469,4 +543,17 @@ const startSave = () => {
|
|||
width: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 38rpx;
|
||||
font-weight: bold;
|
||||
color: red;
|
||||
text-align: center;
|
||||
}
|
||||
.tip {
|
||||
font-size: 22rpx;
|
||||
color: rgba(0, 0, 0, 0.35);
|
||||
margin-top: 20rpx;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,751 @@
|
|||
<template>
|
||||
<uni-card
|
||||
:shadow="'0rpx 0rpx 10rpx 0rpx rgba(5,68,37,0.12)'"
|
||||
:margin="'20px'"
|
||||
:border="false"
|
||||
>
|
||||
<view class="uni-card__content">
|
||||
<u-form
|
||||
labelPosition="left"
|
||||
:model="model1"
|
||||
:rules="rules"
|
||||
ref="form"
|
||||
:labelWidth="80"
|
||||
:labelStyle="{ padding: '0rpx 10rpx' }"
|
||||
:errorType="'border-bottom'"
|
||||
>
|
||||
<view class="title">车辆信息</view>
|
||||
<view v-for="(item, index) in formAttrList" :key="index">
|
||||
<u-form-item
|
||||
v-if="item.name !== '行驶证'"
|
||||
:prop="`formData.${item.key}`"
|
||||
:label="item.name"
|
||||
:required="item.required"
|
||||
@click="item.fn"
|
||||
>
|
||||
<u-input
|
||||
v-if="item.type === 'input'"
|
||||
v-model="(model1.formData as any)[item.key]"
|
||||
:placeholder="`请输入${item.name}`"
|
||||
clearable
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
:disabled="item.disabled"
|
||||
:type="
|
||||
['contactInfo', 'curbWeight'].indexOf(item.key) > -1
|
||||
? 'number'
|
||||
: 'text'
|
||||
"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.unit">
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
<u-input
|
||||
v-if="item.type === 'select'"
|
||||
:disabled="true"
|
||||
:disabledColor="'#ffffff'"
|
||||
v-model="(model1.formData as any)[item.key]"
|
||||
:placeholder="`请选择${item.name}`"
|
||||
clearable
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.unit">
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
<template #right v-if="item.type === 'select'">
|
||||
<u-icon name="arrow-right" @click="item.fn"></u-icon>
|
||||
</template>
|
||||
</u-form-item>
|
||||
<view v-else-if="item.name === '行驶证'">
|
||||
<view style="padding: 22rpx">
|
||||
<text style="color: #f56c6c; font-size: 20px; margin-right: 5px"
|
||||
>*</text
|
||||
>
|
||||
<text style="color: #303133; font-size: 15px; line-height: 22px"
|
||||
>行驶证</text
|
||||
>（拍照上传后自动识别车辆信息）</view
|
||||
>
|
||||
<view style="display: flex; justify-content: space-around">
|
||||
<view>
|
||||
<view style="padding-left: 20rpx; margin-top: 20rpx">
|
||||
<image
|
||||
@click="handleUpload"
|
||||
:src="
|
||||
model1.formData.licensePhotoUrl ||
|
||||
`${url}/static/img/vehicle/upload.png`
|
||||
"
|
||||
style="width: 203rpx; height: 133rpx"
|
||||
/>
|
||||
</view>
|
||||
<view style="padding-left: 20rpx; margin-top: 10rpx"
|
||||
>点击上传行驶证主页</view
|
||||
>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<view style="padding-left: 20rpx; margin-top: 20rpx">
|
||||
<image
|
||||
@click="handleUpload"
|
||||
:src="
|
||||
model1.formData.licensePhotoUrl ||
|
||||
`${url}/static/img/vehicle/upload.png`
|
||||
"
|
||||
style="width: 203rpx; height: 133rpx"
|
||||
/>
|
||||
</view>
|
||||
<view style="padding-left: 20rpx; margin-top: 10rpx"
|
||||
>点击上传行驶证副页</view
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="title">登记信息</view>
|
||||
|
||||
<u-form-item
|
||||
:prop="`formData.${item.key}`"
|
||||
:label="item.name"
|
||||
:required="item.required"
|
||||
v-for="(item, index) in formAttrList1"
|
||||
:key="index"
|
||||
@click="item.fn"
|
||||
>
|
||||
<u-input
|
||||
v-if="item.type === 'input'"
|
||||
v-model="(model1.formData as any)[item.key]"
|
||||
:placeholder="`请输入${item.name}`"
|
||||
clearable
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
:disabled="item.disabled"
|
||||
:disabledColor="'#ffffff'"
|
||||
:type="['contactInfo'].indexOf(item.key) > -1 ? 'number' : 'text'"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.unit">
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
<u-input
|
||||
v-if="item.type === 'select'"
|
||||
:disabled="true"
|
||||
:disabledColor="'#ffffff'"
|
||||
v-model="(model1.formData as any)[item.key]"
|
||||
:placeholder="`请选择${item.name}`"
|
||||
clearable
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.unit">
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
<template #right v-if="item.type === 'select'">
|
||||
<u-icon name="arrow-right" @click="item.fn"></u-icon>
|
||||
</template>
|
||||
</u-form-item>
|
||||
|
||||
<view class="title mt-30">我要选新车</view>
|
||||
|
||||
<u-form-item
|
||||
:prop="`formData.${item.key}`"
|
||||
:label="item.name"
|
||||
:required="item.required"
|
||||
v-for="(item, index) in formAttrList2"
|
||||
:key="index"
|
||||
@click="item.fn"
|
||||
>
|
||||
<u-input
|
||||
v-if="item.type === 'select'"
|
||||
:disabled="true"
|
||||
:disabledColor="'#ffffff'"
|
||||
v-model="(model1.formData as any)[item.key]"
|
||||
:placeholder="`请选择${item.name}`"
|
||||
clearable
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.unit">
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
<template #right v-if="item.type === 'select'">
|
||||
<u-icon name="arrow-right" @click="item.fn"></u-icon>
|
||||
</template>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
</view>
|
||||
</uni-card>
|
||||
|
||||
<view class="btn-box-fix-btn">
|
||||
<view
|
||||
><u-button type="primary" shape="circle" @click="save"
|
||||
>提交询价</u-button
|
||||
></view
|
||||
>
|
||||
</view>
|
||||
|
||||
<block v-for="(item, index) in formAttrList.concat(formAttrList1).concat(formAttrList2)" :key="index">
|
||||
<u-action-sheet
|
||||
v-if="item.type === 'select' && item.childKey"
|
||||
:actions="contrlModalParams[item.childKey].list"
|
||||
:title="contrlModalParams[item.childKey].title"
|
||||
:show="contrlModalParams[item.childKey].isShow"
|
||||
@select="(v: any) => handleSelect(item.childKey, v)"
|
||||
@close="contrlModalParams[item.childKey].isShow = false"
|
||||
:closeOnClickAction="true"
|
||||
></u-action-sheet>
|
||||
</block>
|
||||
|
||||
<!-- 车牌号 -->
|
||||
<CarNoDialog
|
||||
:show="showDialog.showCarNo"
|
||||
@handleDialog="(v:boolean) => {handleDialog('showCarNo', v)}"
|
||||
@changeCarNo="changeCarNo"
|
||||
ref="carNoRef"
|
||||
></CarNoDialog>
|
||||
|
||||
<!-- 供应商选择弹框 -->
|
||||
<BrandDialog
|
||||
ref="BrandDialog"
|
||||
:show="showDialog.showBrand"
|
||||
@handleDialog="(v:boolean) => {handleDialog('showBrand', v)}"
|
||||
@handleChange="handleChange"
|
||||
></BrandDialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { url } from "@/utils/data";
|
||||
import { PictureApi, VehicleApi, UserApi } from "@/services";
|
||||
import pinia from "@/store";
|
||||
import { useMemberStore } from "@/store/index";
|
||||
import valid from "@/utils/validate";
|
||||
const store = useMemberStore(pinia);
|
||||
import CarNoDialog from "@/components/Dialog/CarNoDialog.vue";
|
||||
import BrandDialog from "@/components/Dialog/BrandDialog.vue";
|
||||
const model1 = reactive<any>({
|
||||
formData: {},
|
||||
});
|
||||
const formAttrList = reactive<any>([
|
||||
// {
|
||||
// name: "姓名",
|
||||
// key: "name",
|
||||
// type: "input",
|
||||
// required: true,
|
||||
// unit: "",
|
||||
// },
|
||||
// {
|
||||
// name: "联系方式",
|
||||
// key: "contactInfo",
|
||||
// type: "input",
|
||||
// required: true,
|
||||
// unit: "",
|
||||
// },
|
||||
{
|
||||
name: "行驶证",
|
||||
key: "",
|
||||
type: "upload",
|
||||
required: false,
|
||||
unit: "",
|
||||
},
|
||||
|
||||
{
|
||||
name: "车辆类型",
|
||||
key: "vehicleType",
|
||||
type: "select",
|
||||
childKey: "vehicleType",
|
||||
required: true,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams["vehicleType"].isShow = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "燃油类别",
|
||||
key: "fuelType",
|
||||
type: "select",
|
||||
childKey: "fuelType",
|
||||
required: true,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams["fuelType"].isShow = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "钢圈材质",
|
||||
key: "wheelMaterial",
|
||||
type: "select",
|
||||
childKey: "material",
|
||||
required: true,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams["material"].isShow = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "整备质量",
|
||||
key: "curbWeight",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "KG",
|
||||
},
|
||||
{
|
||||
name: "车架号",
|
||||
key: "vin",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "品牌型号",
|
||||
key: "brandModel",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "系列",
|
||||
key: "series",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "总重量",
|
||||
key: "series",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "车牌号",
|
||||
key: "series",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
]);
|
||||
|
||||
const formAttrList1 = reactive<any>([
|
||||
{
|
||||
name: "车辆所属",
|
||||
key: "ownerType",
|
||||
type: "select",
|
||||
childKey: "ownerType",
|
||||
required: true,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams["ownerType"].isShow = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "联系方式",
|
||||
key: "contactInfo",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "车牌号",
|
||||
key: "licensePlate",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
disabled: true,
|
||||
fn: () => {
|
||||
uni.hideKeyboard();
|
||||
showDialog.showCarNo = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "所在地",
|
||||
key: "location",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
]);
|
||||
|
||||
const formAttrList2 = reactive<any>([
|
||||
{
|
||||
name: "选择品牌",
|
||||
key: "brandName",
|
||||
type: "select",
|
||||
required: false,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
uni.hideKeyboard();
|
||||
showDialog.showBrand = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "预算范围",
|
||||
key: "budgetRange",
|
||||
type: "select",
|
||||
childKey: "budgetRange",
|
||||
required: false,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams["budgetRange"].isShow = true;
|
||||
},
|
||||
},
|
||||
]);
|
||||
const rules = reactive({
|
||||
"formData.name": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入姓名",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"formData.contactInfo": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入联系方式",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"formData.licensePhotoUrl": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请上传行驶证照片",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"formData.vehicleType": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请选择车辆类型",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"formData.fuelType": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请选择燃油类型",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"formData.wheelMaterial": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请选择钢圈材质",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"formData.curbWeight": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入整备质量",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
|
||||
"formData.ownerType": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请选择车辆所属",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"formData.licensePlate": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入车牌号",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"formData.location": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入所在地",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
});
|
||||
|
||||
const contrlModalParams = reactive<any>({
|
||||
vehicleType: {
|
||||
isShow: false,
|
||||
title: "车辆类型",
|
||||
list: [
|
||||
{ name: "轿车（含MPV）" },
|
||||
{ name: "面包车" },
|
||||
{ name: "中型客车" },
|
||||
{ name: "大型客车" },
|
||||
{ name: "轻型载货汽车" },
|
||||
{ name: "中型载货汽车" },
|
||||
{ name: "重型载货汽车" },
|
||||
{ name: "越野汽车（SUV）" },
|
||||
{ name: "农用运输车" },
|
||||
{ name: "牵引汽车" },
|
||||
{ name: "挂车" },
|
||||
{ name: "农用机械" },
|
||||
{ name: "摩托车" },
|
||||
{ name: "电瓶摩托车" },
|
||||
],
|
||||
},
|
||||
fuelType: {
|
||||
isShow: false,
|
||||
title: "燃油类别",
|
||||
list: [
|
||||
{ name: "汽油" },
|
||||
{ name: "柴油" },
|
||||
{ name: "油气" },
|
||||
{ name: "纯电" },
|
||||
{ name: "油电" },
|
||||
{ name: "无动力" },
|
||||
{ name: "天然气" },
|
||||
],
|
||||
},
|
||||
material: {
|
||||
isShow: false,
|
||||
title: "钢圈材质",
|
||||
list: [{ name: "铝质" }, { name: "铁质" }],
|
||||
},
|
||||
ownerType: {
|
||||
isShow: false,
|
||||
title: "车辆所属",
|
||||
list: [{ name: "个人" }, { name: "单位" }],
|
||||
},
|
||||
budgetRange: {
|
||||
isShow: false,
|
||||
title: "预算范围",
|
||||
list: [
|
||||
{ name: "10万以下" },
|
||||
{ name: "10-15万" },
|
||||
{ name: "15-20万" },
|
||||
{ name: "20-25万" },
|
||||
{ name: "25-30万" },
|
||||
{ name: "30-40万" },
|
||||
{ name: "40-50万" },
|
||||
{ name: "50万以上" },
|
||||
],
|
||||
},
|
||||
});
|
||||
|
||||
// 供应商选择
|
||||
const showDialog = <any>reactive({
|
||||
showCarNo: false,
|
||||
showBrand: false,
|
||||
});
|
||||
|
||||
const handleDialog = (key: string, v: boolean) => {
|
||||
showDialog[key] = v;
|
||||
};
|
||||
|
||||
const changeCarNo = (plate: string) => {
|
||||
if (plate.length >= 7) model1.formData.licensePlate = plate;
|
||||
showDialog.showCarNo = false;
|
||||
};
|
||||
|
||||
const handleChange = (arr: any) => {
|
||||
model1.formData.brandName = arr
|
||||
.map((item: any) => {
|
||||
return item.brandName;
|
||||
})
|
||||
.toString();
|
||||
model1.formData.brandId = arr
|
||||
.map((item: any) => {
|
||||
return item.id;
|
||||
})
|
||||
.toString();
|
||||
};
|
||||
|
||||
const handleSelect = (key: string, v: any) => {
|
||||
contrlModalParams[key].isShow = false;
|
||||
if (key === "vehicleType") {
|
||||
model1.formData.vehicleType = v.name;
|
||||
} else if (key === "fuelType") {
|
||||
model1.formData.fuelType = v.name;
|
||||
} else if (key === "material") {
|
||||
model1.formData.wheelMaterial = v.name;
|
||||
}
|
||||
};
|
||||
// 授权
|
||||
const handleUpload = () => {
|
||||
upload();
|
||||
// uni.authorize({
|
||||
// // #ifdef MP-TOUTIAO
|
||||
// scope: "scope.album, scope.writePhotosAlbum,scope.camera",
|
||||
// // #endif
|
||||
// success(res) {
|
||||
// console.log("检测权限通过", res);
|
||||
// },
|
||||
// fail(err) {
|
||||
// console.log("检测权限不通过", err);
|
||||
// uni.hideLoading();
|
||||
// },
|
||||
// });
|
||||
// uni.authorize({
|
||||
// scope: "scope.writePhotosAlbum",
|
||||
// success() {
|
||||
// console.log("授权成功");
|
||||
// // 用户同意授权后，可以执行相关上传文件的操作
|
||||
// },
|
||||
// fail() {
|
||||
// console.log("用户拒绝授权");
|
||||
// // 引导用户到设置中开启权限
|
||||
// if (uni.getSystemInfoSync().platform === "android") {
|
||||
// uni.showModal({
|
||||
// title: "提示",
|
||||
// content: "此功能需要访问您的相册，请在设置中允许访问相册",
|
||||
// success: function (modalRes) {
|
||||
// if (modalRes.confirm) {
|
||||
// uni.openSetting();
|
||||
// }
|
||||
// },
|
||||
// });
|
||||
// }
|
||||
// },
|
||||
// });
|
||||
};
|
||||
// 上传
|
||||
const upload = () => {
|
||||
uni.chooseImage({
|
||||
success: (chooseImageRes) => {
|
||||
const tempFilePaths = chooseImageRes.tempFilePaths;
|
||||
PictureApi.upload({
|
||||
files: tempFilePaths[0],
|
||||
path: tempFilePaths[0],
|
||||
}).then((res: any) => {
|
||||
if (res.code === 200) {
|
||||
model1.formData.licensePhotoUrl = res.data.url;
|
||||
const ocr = JSON.parse(res.data.ocr);
|
||||
if (ocr.error_code) {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: "未识别出相关信息",
|
||||
});
|
||||
model1.formData.licensePhotoUrl = "";
|
||||
model1.formData.ascription = "";
|
||||
model1.formData.licenseNumber = "";
|
||||
model1.formData.vin = "";
|
||||
model1.formData.brandModel = "";
|
||||
} else {
|
||||
model1.formData.ascription = ocr.words_result["所有人"].words;
|
||||
model1.formData.licenseNumber = ocr.words_result["号牌号码"].words;
|
||||
model1.formData.vin = ocr.words_result["车辆识别代号"].words;
|
||||
model1.formData.brandModel = ocr.words_result["品牌型号"].words;
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: (error) => {
|
||||
console.log(error);
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 校验
|
||||
*/
|
||||
const form = ref();
|
||||
const check = () => {
|
||||
return new Promise((resolve) => {
|
||||
form.value
|
||||
.validate()
|
||||
.then((res: boolean) => {
|
||||
resolve(res);
|
||||
})
|
||||
.catch((errors: any) => {
|
||||
resolve(false);
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: errors[0].message || "校验失败",
|
||||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
const save = () => {
|
||||
check().then((res) => {
|
||||
if (res) {
|
||||
startSave();
|
||||
}
|
||||
});
|
||||
// if (store.profile?.token) {
|
||||
// check().then((res) => {
|
||||
// if (res) {
|
||||
// startSave();
|
||||
// }
|
||||
// });
|
||||
// } else {
|
||||
// uni.login({
|
||||
// provider: "toutiao",
|
||||
// success: function (loginRes) {
|
||||
// UserApi.login({ code: loginRes.code }).then((res: any) => {
|
||||
// if (res.data) {
|
||||
// store.setProfile({ token: res.data.token });
|
||||
// check().then((res) => {
|
||||
// if (res) {
|
||||
// startSave();
|
||||
// }
|
||||
// });
|
||||
// } else {
|
||||
// uni.showToast({ title: "授权失败", icon: "none" });
|
||||
// }
|
||||
// });
|
||||
// },
|
||||
// });
|
||||
// }
|
||||
};
|
||||
|
||||
const startSave = () => {
|
||||
VehicleApi.add(model1.formData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
uni.showToast({
|
||||
title: "提交成功",
|
||||
});
|
||||
uni.navigateBack();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleBack = () => {
|
||||
uni.navigateBack();
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.uni-card__content {
|
||||
padding: 10px !important;
|
||||
height: calc(100vh - 100px);
|
||||
overflow: auto;
|
||||
}
|
||||
::v-deep .uni-card--shadow {
|
||||
padding: 0px !important;
|
||||
}
|
||||
::v-deep .u-form-item {
|
||||
height: auto !important;
|
||||
border-bottom: 1rpx solid rgba(233, 233, 233, 0.76);
|
||||
margin: 0px 20rpx;
|
||||
padding: 0px 20rpx;
|
||||
}
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.btn-box-fix-btn {
|
||||
justify-content: center;
|
||||
view {
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 38rpx;
|
||||
font-weight: bold;
|
||||
color: red;
|
||||
text-align: center;
|
||||
}
|
||||
.tip {
|
||||
font-size: 22rpx;
|
||||
color: rgba(0, 0, 0, 0.35);
|
||||
margin-top: 20rpx;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="box">
|
||||
<uni-table stripe emptyText="暂无询价记录">
|
||||
<!-- 表头行 -->
|
||||
<uni-tr>
|
||||
<uni-th v-for="(item, index) in tableTitleList" :key="index"
|
||||
>{{ item.name }}
|
||||
</uni-th>
|
||||
</uni-tr>
|
||||
<!-- 表格数据行 -->
|
||||
<uni-tr v-for="(item, index) in [{paymentName: '2022'}]" :key="index">
|
||||
<uni-td v-for="(tItem, index) in tableTitleList" :key="index">{{
|
||||
item[tItem.key]
|
||||
}}</uni-td>
|
||||
<uni-td>
|
||||
<u-button type="primary" shape="circle" @click="goRegis()">去登记</u-button>
|
||||
</uni-td>
|
||||
</uni-tr>
|
||||
</uni-table>
|
||||
</view>
|
||||
<view class="btn-box-fix-btn">
|
||||
<view
|
||||
><u-button type="primary" shape="circle" @click="goInquiry()">去询价</u-button>
|
||||
<view @click="goRecovery" class="regis" >不需询价, 直接登记回收</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { VehicleApi } from "@/services";
|
||||
import pinia from "@/store";
|
||||
import { useMemberStore } from "@/store/index";
|
||||
const tableTitleList = reactive([
|
||||
{
|
||||
name: "时间",
|
||||
key: "paymentName",
|
||||
},
|
||||
{
|
||||
name: "品牌型号",
|
||||
key: "paymentPrice",
|
||||
},
|
||||
{
|
||||
name: "总重量",
|
||||
key: "revenuePrice",
|
||||
},
|
||||
{
|
||||
name: "预估价格",
|
||||
key: "revenuePrice",
|
||||
},
|
||||
{
|
||||
name: "操作",
|
||||
key: "revenuePrice",
|
||||
},
|
||||
]);
|
||||
// VehicleApi.queryRegis({
|
||||
// startTime: "2024-09-01 00:00:00",
|
||||
// endTime: "2024-09-30 23:59:59",
|
||||
// }).then((res:any) => {
|
||||
// if(res.code === 200) {
|
||||
// res.data.list
|
||||
// }
|
||||
// });
|
||||
const goRegis = () => {
|
||||
uni.navigateTo({
|
||||
url: '/pagesVehicle/registration', // 要跳转到的页面路径
|
||||
});
|
||||
}
|
||||
|
||||
const goInquiry = () => {
|
||||
uni.navigateTo({
|
||||
url: '/pagesVehicle/inquiry', // 要跳转到的页面路径
|
||||
});
|
||||
}
|
||||
|
||||
const goRecovery = () => {
|
||||
uni.navigateTo({
|
||||
url: '/pagesVehicle/recovery', // 要跳转到的页面路径
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.btn-box-fix-btn {
|
||||
justify-content: center;
|
||||
view {
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
.regis {
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
padding-top: 15px;
|
||||
width: 100% !important;
|
||||
color: $u-primary;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,369 @@
|
|||
<template>
|
||||
<uni-card
|
||||
:shadow="'0rpx 0rpx 10rpx 0rpx rgba(5,68,37,0.12)'"
|
||||
:margin="'20px'"
|
||||
:border="false"
|
||||
>
|
||||
<view class="title">车辆信息</view>
|
||||
<u-form
|
||||
labelPosition="left"
|
||||
:model="model1"
|
||||
:rules="rules"
|
||||
ref="form"
|
||||
:labelWidth="80"
|
||||
:labelStyle="{ padding: '0rpx 10rpx' }"
|
||||
:errorType="'border-bottom'"
|
||||
>
|
||||
<u-form-item
|
||||
:prop="`formData.${item.key}`"
|
||||
:label="item.name"
|
||||
:required="item.required"
|
||||
v-for="(item, index) in formAttrList"
|
||||
:key="index"
|
||||
@click="item.fn"
|
||||
>
|
||||
<u-input
|
||||
v-if="item.type === 'input'"
|
||||
v-model="(model1.formData as any)[item.key]"
|
||||
:placeholder="`请输入${item.name}`"
|
||||
clearable
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
:disabled="item.disabled"
|
||||
:disabledColor="'#ffffff'"
|
||||
:type="['contactInfo'].indexOf(item.key) > -1 ? 'number' : 'text'"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.unit">
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
<u-input
|
||||
v-if="item.type === 'select'"
|
||||
:disabled="true"
|
||||
:disabledColor="'#ffffff'"
|
||||
v-model="(model1.formData as any)[item.key]"
|
||||
:placeholder="`请选择${item.name}`"
|
||||
clearable
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.unit">
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
<template #right v-if="item.type === 'select'">
|
||||
<u-icon name="arrow-right" @click="item.fn"></u-icon>
|
||||
</template>
|
||||
</u-form-item>
|
||||
|
||||
<view class="title mt-30">我要选新车</view>
|
||||
|
||||
<u-form-item
|
||||
:prop="`formData.${item.key}`"
|
||||
:label="item.name"
|
||||
:required="item.required"
|
||||
v-for="(item, index) in formAttrList1"
|
||||
:key="index"
|
||||
@click="item.fn"
|
||||
>
|
||||
<u-input
|
||||
v-if="item.type === 'select'"
|
||||
:disabled="true"
|
||||
:disabledColor="'#ffffff'"
|
||||
v-model="(model1.formData as any)[item.key]"
|
||||
:placeholder="`请选择${item.name}`"
|
||||
clearable
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.unit">
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
<template #right v-if="item.type === 'select'">
|
||||
<u-icon name="arrow-right" @click="item.fn"></u-icon>
|
||||
</template>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
</uni-card>
|
||||
|
||||
<view class="btn-box-fix-btn">
|
||||
<view
|
||||
><u-button type="primary" shape="circle" @click="save"
|
||||
>提交登记</u-button
|
||||
></view
|
||||
>
|
||||
</view>
|
||||
|
||||
<block v-for="(item, index) in formAttrList.concat(formAttrList1)" :key="index">
|
||||
<u-action-sheet
|
||||
v-if="item.type === 'select' && item.childKey"
|
||||
:actions="contrlModalParams[item.childKey].list"
|
||||
:title="contrlModalParams[item.childKey].title"
|
||||
:show="contrlModalParams[item.childKey].isShow"
|
||||
@select="(v: any) => handleSelect(item.childKey, v)"
|
||||
@close="contrlModalParams[item.childKey].isShow = false"
|
||||
:closeOnClickAction="true"
|
||||
></u-action-sheet>
|
||||
</block>
|
||||
|
||||
<!-- 车牌号 -->
|
||||
<CarNoDialog
|
||||
:show="showDialog.showCarNo"
|
||||
@handleDialog="(v:boolean) => {handleDialog('showCarNo', v)}"
|
||||
@changeCarNo="changeCarNo"
|
||||
ref="carNoRef"
|
||||
></CarNoDialog>
|
||||
|
||||
<!-- 供应商选择弹框 -->
|
||||
<BrandDialog
|
||||
ref="BrandDialog"
|
||||
:show="showDialog.showBrand"
|
||||
@handleDialog="(v:boolean) => {handleDialog('showBrand', v)}"
|
||||
@handleChange="handleChange"
|
||||
></BrandDialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import CarNoDialog from "@/components/Dialog/CarNoDialog.vue";
|
||||
import BrandDialog from "@/components/Dialog/BrandDialog.vue";
|
||||
import { VehicleApi, UserApi } from "@/services";
|
||||
import pinia from "@/store";
|
||||
import { useMemberStore } from "@/store/index";
|
||||
const store = useMemberStore(pinia);
|
||||
// 供应商选择
|
||||
const showDialog = <any>reactive({
|
||||
showCarNo: false,
|
||||
showBrand: false
|
||||
});
|
||||
const model1 = reactive<any>({
|
||||
formData: {},
|
||||
});
|
||||
const formAttrList = reactive<any>([
|
||||
{
|
||||
name: "车辆所属",
|
||||
key: "ownerType",
|
||||
type: "select",
|
||||
childKey: "ownerType",
|
||||
required: true,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams["ownerType"].isShow = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "联系方式",
|
||||
key: "contactInfo",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "车牌号",
|
||||
key: "licensePlate",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
disabled: true,
|
||||
fn: () => {
|
||||
uni.hideKeyboard();
|
||||
showDialog.showCarNo = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "所在地",
|
||||
key: "location",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
]);
|
||||
|
||||
const formAttrList1 = reactive<any>([
|
||||
{
|
||||
name: "选择品牌",
|
||||
key: "brandName",
|
||||
type: "select",
|
||||
required: false,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
uni.hideKeyboard();
|
||||
showDialog.showBrand = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "预算范围",
|
||||
key: "budgetRange",
|
||||
type: "select",
|
||||
childKey: "budgetRange",
|
||||
required: false,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams["budgetRange"].isShow = true;
|
||||
},
|
||||
},
|
||||
]);
|
||||
const rules = reactive({
|
||||
"formData.ownerType": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请选择车辆所属",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"formData.contactInfo": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入联系方式",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"formData.licensePlate": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入车牌号",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"formData.location": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入所在地",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
});
|
||||
|
||||
const contrlModalParams = reactive<any>({
|
||||
ownerType: {
|
||||
isShow: false,
|
||||
title: "车辆所属",
|
||||
list: [{ name: "个人" }, { name: "单位" }],
|
||||
},
|
||||
budgetRange: {
|
||||
isShow: false,
|
||||
title: "预算范围",
|
||||
list: [
|
||||
{ name: "10万以下" },
|
||||
{ name: "10-15万" },
|
||||
{ name: "15-20万" },
|
||||
{ name: "20-25万" },
|
||||
{ name: "25-30万" },
|
||||
{ name: "30-40万" },
|
||||
{ name: "40-50万" },
|
||||
{ name: "50万以上" },
|
||||
],
|
||||
},
|
||||
});
|
||||
|
||||
const handleSelect = (key: string, v: any) => {
|
||||
contrlModalParams[key].isShow = false;
|
||||
if (key === "ownerType") {
|
||||
model1.formData.ownerType = v.name;
|
||||
} else if(key === 'budgetRange') {
|
||||
model1.formData.budgetRange = v.name;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 校验
|
||||
*/
|
||||
const form = ref();
|
||||
const check = () => {
|
||||
return new Promise((resolve) => {
|
||||
form.value
|
||||
.validate()
|
||||
.then((res: boolean) => {
|
||||
resolve(res);
|
||||
})
|
||||
.catch((errors: any) => {
|
||||
resolve(false);
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: errors[0].message || "校验失败",
|
||||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
const save = () => {
|
||||
check().then((res) => {
|
||||
if (res) {
|
||||
startSave();
|
||||
}
|
||||
});
|
||||
// if (store.profile?.token) {
|
||||
// check().then((res) => {
|
||||
// if (res) {
|
||||
// startSave();
|
||||
// }
|
||||
// });
|
||||
// } else {
|
||||
// uni.login({
|
||||
// provider: "toutiao",
|
||||
// success: function (loginRes) {
|
||||
// UserApi.login({ code: loginRes.code }).then((res) => {
|
||||
|
||||
// });
|
||||
// },
|
||||
// });
|
||||
// }
|
||||
};
|
||||
|
||||
const startSave = () => {
|
||||
VehicleApi.addRegis({
|
||||
...model1.formData,
|
||||
ownerType: model1.formData.ownerType === "个人" ? 0 : 1,
|
||||
}).then((res) => {
|
||||
if (res.code === 200) {
|
||||
uni.showToast({
|
||||
title: "提交成功",
|
||||
});
|
||||
uni.navigateBack();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleDialog = (key: string, v: boolean) => {
|
||||
showDialog[key] = v;
|
||||
};
|
||||
|
||||
const changeCarNo = (plate: string) => {
|
||||
if (plate.length >= 7) model1.formData.licensePlate = plate;
|
||||
showDialog.showCarNo = false;
|
||||
};
|
||||
|
||||
const handleChange = (arr: any) => {
|
||||
model1.formData.brandName = arr.map((item:any) => {return item.brandName}).toString()
|
||||
model1.formData.brandId = arr.map((item:any) => {return item.id}).toString()
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .uni-card__content {
|
||||
padding: 20rpx !important;
|
||||
height: calc(100vh - 200px);
|
||||
overflow: auto;
|
||||
}
|
||||
::v-deep .uni-card--shadow {
|
||||
padding: 0px !important;
|
||||
}
|
||||
::v-deep .u-form-item {
|
||||
height: auto;
|
||||
border-bottom: 1rpx solid rgba(233, 233, 233, 0.76);
|
||||
margin: 0px 20rpx;
|
||||
padding: 0px 20rpx;
|
||||
}
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.btn-box-fix-btn {
|
||||
justify-content: center;
|
||||
view {
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -4,7 +4,7 @@
|
|||
:margin="'20px'"
|
||||
:border="false"
|
||||
>
|
||||
<view class="title">车辆信息</view>
|
||||
<view class="title">登记信息</view>
|
||||
<u-form
|
||||
labelPosition="left"
|
||||
:model="model1"
|
||||
|
|
@ -157,6 +157,13 @@ const formAttrList = reactive<any>([
|
|||
contrlModalParams["ownerType"].isShow = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "联系人",
|
||||
key: "name",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "联系方式",
|
||||
key: "contactInfo",
|
||||
|
|
@ -165,19 +172,14 @@ const formAttrList = reactive<any>([
|
|||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "车牌号",
|
||||
key: "licensePlate",
|
||||
name: "上门地址",
|
||||
key: "location",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "",
|
||||
disabled: true,
|
||||
fn: () => {
|
||||
uni.hideKeyboard();
|
||||
showDialog.showCarNo = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "所在地",
|
||||
name: "详细地址",
|
||||
key: "location",
|
||||
type: "input",
|
||||
required: true,
|
||||
|
|
|
|||
|
|
@ -29,6 +29,15 @@ export const getBrand = (data: any) => {
|
|||
});
|
||||
};
|
||||
|
||||
export const queryRegis = (data: any) => {
|
||||
return http({
|
||||
method: "get",
|
||||
url: "/api/v1/vehicleRegistration/findPage",
|
||||
data,
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -99,3 +99,18 @@ body {
|
|||
color: $u-primary;
|
||||
}
|
||||
}
|
||||
::v-deep .uni-table {
|
||||
.uni-table-th {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
padding: 5px 5px;
|
||||
}
|
||||
.uni-table-td {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue