1.我的车牌页面 录入车牌弹窗封装
This commit is contained in:
@@ -17,9 +17,13 @@ const install = (Vue, vm) => {
|
|||||||
getFunList:(params = {})=>vm.$u.get(config.adminPath+'/system/funList/list', params),
|
getFunList:(params = {})=>vm.$u.get(config.adminPath+'/system/funList/list', params),
|
||||||
//我的访客列表
|
//我的访客列表
|
||||||
getMyVisitor:(params = {})=>vm.$u.get(config.adminPath+'/property/visitorManagement/list',params),
|
getMyVisitor:(params = {})=>vm.$u.get(config.adminPath+'/property/visitorManagement/list',params),
|
||||||
|
//新增访客
|
||||||
|
addVisitor:(params = {})=>vm.$u.post(config.adminPath+'/property/visitorManagement',params),
|
||||||
|
|
||||||
//报事报修
|
//报事报修
|
||||||
getOrderList:(params = {})=>vm.$u.get(config.adminPath+'/property/workOrders/list',params),
|
getOrderList:(params = {})=>vm.$u.get(config.adminPath+'/property/workOrders/list',params),
|
||||||
|
|
||||||
|
|
||||||
// 基础服务:登录登出、身份信息、菜单授权、切换系统、字典数据等
|
// 基础服务:登录登出、身份信息、菜单授权、切换系统、字典数据等
|
||||||
lang: (params = {}) => vm.$u.get('/lang/'+params.lang),
|
lang: (params = {}) => vm.$u.get('/lang/'+params.lang),
|
||||||
index: (params = {}) => vm.$u.get(config.adminPath+'/mobile/index', params),
|
index: (params = {}) => vm.$u.get(config.adminPath+'/mobile/index', params),
|
||||||
|
72
common/upload.js
Normal file
72
common/upload.js
Normal file
@@ -0,0 +1,72 @@
|
|||||||
|
// utils/upload.js
|
||||||
|
|
||||||
|
export const uploadFiles = ({
|
||||||
|
files = [],
|
||||||
|
url = '',
|
||||||
|
name = 'file',
|
||||||
|
formData = {},
|
||||||
|
fileType = 'image',
|
||||||
|
vm, // 关键:传入 vm 以便访问 vuex_token、vuex_remember 等
|
||||||
|
}) => {
|
||||||
|
return new Promise(async (resolve, reject) => {
|
||||||
|
if (!url) return reject(new Error('上传地址不能为空'));
|
||||||
|
if (!Array.isArray(files) || files.length === 0) return reject(new Error('文件列表不能为空'));
|
||||||
|
|
||||||
|
const results = [];
|
||||||
|
for (let i = 0; i < files.length; i++) {
|
||||||
|
const filePath = files[i];
|
||||||
|
try {
|
||||||
|
const res = await uploadSingleFile({ filePath, url, name, formData, fileType, vm });
|
||||||
|
results.push(res);
|
||||||
|
} catch (err) {
|
||||||
|
reject(err);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
resolve(results);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
function uploadSingleFile({ filePath, url, name, formData = {}, fileType = 'image', vm }) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
const headers = {
|
||||||
|
'x-requested-with': 'XMLHttpRequest',
|
||||||
|
source: 'uniapp',
|
||||||
|
clientId: 'dab457a1ea14411787c240db05bb0832',
|
||||||
|
};
|
||||||
|
|
||||||
|
// 手动加上 Token
|
||||||
|
if (vm?.vuex_token) {
|
||||||
|
headers.Authorization = `Bearer ${vm.vuex_token}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 加上 rememberMe
|
||||||
|
if (vm?.vuex_remember) {
|
||||||
|
headers['x-remember'] = vm.vuex_remember;
|
||||||
|
}
|
||||||
|
console.log('request', headers);
|
||||||
|
uni.uploadFile({
|
||||||
|
url,
|
||||||
|
filePath,
|
||||||
|
name,
|
||||||
|
formData,
|
||||||
|
header: headers,
|
||||||
|
fileType,
|
||||||
|
success: (res) => {
|
||||||
|
try {
|
||||||
|
const data = JSON.parse(res.data);
|
||||||
|
if (res.statusCode === 200) {
|
||||||
|
resolve(data);
|
||||||
|
} else {
|
||||||
|
reject(data);
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
reject(e);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
reject(err);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
254
components/CarBindDialog.vue
Normal file
254
components/CarBindDialog.vue
Normal file
@@ -0,0 +1,254 @@
|
|||||||
|
<template>
|
||||||
|
<view v-if="visible" class="pay-dialog-mask" @click.self="closeDialog">
|
||||||
|
<view class="pay-dialog-box">
|
||||||
|
<view class="pay-dialog-title-row">
|
||||||
|
<view class="pay-dialog-title">请输入车牌号</view>
|
||||||
|
<image src="/static/ic_close_01.png" class="pay-dialog-close" @click="closeDialog" />
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="pay-dialog-input-row">
|
||||||
|
<!-- 省份简称,readonly -->
|
||||||
|
<input
|
||||||
|
class="pay-dialog-input province-input"
|
||||||
|
:value="carNumArr[0]"
|
||||||
|
readonly
|
||||||
|
@click="showProvinceKeyboard = true"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!-- 后6位 -->
|
||||||
|
<input
|
||||||
|
v-for="(item, idx) in 6"
|
||||||
|
:key="idx"
|
||||||
|
maxlength="1"
|
||||||
|
class="pay-dialog-input"
|
||||||
|
v-model="carNumArr[idx + 1]"
|
||||||
|
@input="onCarInput($event, idx)"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<button class="pay-dialog-btn" @click="saveCar">保存</button>
|
||||||
|
|
||||||
|
<!-- 省份自定义键盘 -->
|
||||||
|
<view v-if="showProvinceKeyboard" class="province-keyboard-mask" @click.self="showProvinceKeyboard = false">
|
||||||
|
<view class="province-keyboard-box">
|
||||||
|
<view class="province-keyboard-title">选择省份简称</view>
|
||||||
|
<view class="province-keyboard-grid">
|
||||||
|
<view
|
||||||
|
v-for="(item, idx) in provinceList"
|
||||||
|
:key="idx"
|
||||||
|
class="province-keyboard-btn"
|
||||||
|
@click="selectProvince(item)"
|
||||||
|
>
|
||||||
|
{{ item }}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<button class="province-keyboard-cancel" @click="showProvinceKeyboard = false">取消</button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "CarBindDialog",
|
||||||
|
props: {
|
||||||
|
visible: Boolean,
|
||||||
|
carNumber: {
|
||||||
|
type: Array,
|
||||||
|
default() {
|
||||||
|
return ["渝", "", "", "", "", "", ""];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
carNumArr: [...this.carNumber],
|
||||||
|
showProvinceKeyboard: false,
|
||||||
|
provinceList: [
|
||||||
|
"京",
|
||||||
|
"津",
|
||||||
|
"沪",
|
||||||
|
"渝",
|
||||||
|
"冀",
|
||||||
|
"豫",
|
||||||
|
"云",
|
||||||
|
"辽",
|
||||||
|
"黑",
|
||||||
|
"湘",
|
||||||
|
"皖",
|
||||||
|
"鲁",
|
||||||
|
"新",
|
||||||
|
"苏",
|
||||||
|
"浙",
|
||||||
|
"赣",
|
||||||
|
"鄂",
|
||||||
|
"桂",
|
||||||
|
"甘",
|
||||||
|
"晋",
|
||||||
|
"蒙",
|
||||||
|
"陕",
|
||||||
|
"吉",
|
||||||
|
"闽",
|
||||||
|
"贵",
|
||||||
|
"粤",
|
||||||
|
"青",
|
||||||
|
"藏",
|
||||||
|
"川",
|
||||||
|
"宁",
|
||||||
|
"琼",
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
carNumber(newVal) {
|
||||||
|
this.carNumArr = [...newVal];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onCarInput(e, idx) {
|
||||||
|
let val = e.detail.value.toUpperCase().replace(/[^A-Z0-9]/g, "");
|
||||||
|
this.$set(this.carNumArr, idx + 1, val);
|
||||||
|
},
|
||||||
|
selectProvince(item) {
|
||||||
|
this.$set(this.carNumArr, 0, item);
|
||||||
|
this.showProvinceKeyboard = false;
|
||||||
|
},
|
||||||
|
saveCar() {
|
||||||
|
this.$emit("save", this.carNumArr);
|
||||||
|
this.$emit("update:visible", false);
|
||||||
|
},
|
||||||
|
closeDialog() {
|
||||||
|
this.$emit("update:visible", false);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.pay-dialog-mask {
|
||||||
|
position: fixed;
|
||||||
|
z-index: 9999;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
background-color: rgba(0, 0, 0, 0.5);
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pay-dialog-box {
|
||||||
|
width: 90vw;
|
||||||
|
max-width: 400px;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
padding: 30rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pay-dialog-title-row {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pay-dialog-title {
|
||||||
|
font-size: 36rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pay-dialog-close {
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pay-dialog-input-row {
|
||||||
|
display: flex;
|
||||||
|
gap: 10rpx;
|
||||||
|
margin-bottom: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pay-dialog-input {
|
||||||
|
width: 40rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 36rpx;
|
||||||
|
border: 1rpx solid #ccc;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.province-input {
|
||||||
|
width: 60rpx;
|
||||||
|
background-color: #eee;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pay-dialog-btn {
|
||||||
|
width: 100%;
|
||||||
|
height: 70rpx;
|
||||||
|
background-color: #007aff;
|
||||||
|
color: white;
|
||||||
|
border-radius: 35rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 自定义省份键盘样式 */
|
||||||
|
.province-keyboard-mask {
|
||||||
|
position: fixed;
|
||||||
|
z-index: 10000;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
background-color: rgba(0, 0, 0, 0.4);
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.province-keyboard-box {
|
||||||
|
width: 90vw;
|
||||||
|
max-width: 400px;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
padding: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.province-keyboard-title {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.province-keyboard-grid {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.province-keyboard-btn {
|
||||||
|
flex: 1 0 18%;
|
||||||
|
background-color: #f0f0f0;
|
||||||
|
text-align: center;
|
||||||
|
padding: 10rpx 0;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
user-select: none;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.province-keyboard-cancel {
|
||||||
|
margin-top: 20rpx;
|
||||||
|
width: 100%;
|
||||||
|
height: 60rpx;
|
||||||
|
background-color: #aaa;
|
||||||
|
color: white;
|
||||||
|
font-size: 28rpx;
|
||||||
|
border-radius: 15rpx;
|
||||||
|
}
|
||||||
|
</style>
|
14
pages.json
14
pages.json
@@ -322,6 +322,12 @@
|
|||||||
"navigationBarTitleText": "缴费记录"
|
"navigationBarTitleText": "缴费记录"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/sys/user/myPayment/myCarCode",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "我的车牌"
|
||||||
|
}
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"path": "pages/sys/user/myRepair/myRepair",
|
"path": "pages/sys/user/myRepair/myRepair",
|
||||||
"style": {
|
"style": {
|
||||||
@@ -407,5 +413,13 @@
|
|||||||
"navigationBarTextStyle": "black",
|
"navigationBarTextStyle": "black",
|
||||||
"navigationBarTitleText": "Aidex",
|
"navigationBarTitleText": "Aidex",
|
||||||
"navigationBarBackgroundColor": "#ffffff"
|
"navigationBarBackgroundColor": "#ffffff"
|
||||||
|
},
|
||||||
|
"easycom": {
|
||||||
|
"autoscan": true,
|
||||||
|
"custom": {
|
||||||
|
"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
128
pages/sys/user/myPayment/myCarCode.vue
Normal file
128
pages/sys/user/myPayment/myCarCode.vue
Normal file
@@ -0,0 +1,128 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<scroll-view scroll-y class="list" style="height: 80vh;">
|
||||||
|
<block v-for="(item, index) in carList" :key="item.plate">
|
||||||
|
<u-swipe-action :index="index" :options="rightOptions" @click="onDelete">
|
||||||
|
<view class="car-item" @click="onItemClick(item)">
|
||||||
|
<view class="car-num">{{ item.plate }}</view>
|
||||||
|
<view class="car-time">上次停放时间: {{ item.time }}</view>
|
||||||
|
</view>
|
||||||
|
</u-swipe-action>
|
||||||
|
</block>
|
||||||
|
</scroll-view>
|
||||||
|
|
||||||
|
<!-- 绑定车牌弹窗 -->
|
||||||
|
<CarBindDialog
|
||||||
|
:visible="showBindDialog"
|
||||||
|
:carNumber="carNumArr"
|
||||||
|
@save="handleSaveCar"
|
||||||
|
@update:visible="showBindDialog = $event"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<button class="add-btn" @click="onAddCar">新增停车</button>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import CarBindDialog from '@/components/CarBindDialog.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
CarBindDialog
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
showBindDialog: false, // 控制弹窗显示
|
||||||
|
carNumArr: ['渝', '', '', '', '', '', ''], // 当前编辑的车牌号码数组
|
||||||
|
carList: [ // 车牌列表数据
|
||||||
|
{ plate: '渝A·B8889', time: '2025-07-28' },
|
||||||
|
{ plate: '渝A·C1234', time: '2025-07-27' },
|
||||||
|
{ plate: '渝A·D5678', time: '2025-07-26' }
|
||||||
|
],
|
||||||
|
rightOptions: [ // 侧滑删除按钮配置
|
||||||
|
{
|
||||||
|
text: '删除',
|
||||||
|
style: {
|
||||||
|
backgroundColor: '#FF5A1F',
|
||||||
|
color: '#fff',
|
||||||
|
width: '150rpx'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onAddCar() {
|
||||||
|
// 新增车牌时,重置车牌数组为默认
|
||||||
|
this.carNumArr = ['渝', '', '', '', '', '', ''];
|
||||||
|
this.showBindDialog = true;
|
||||||
|
},
|
||||||
|
handleSaveCar(car) {
|
||||||
|
// 保存车牌,格式化并加入列表
|
||||||
|
const plate = car.join('').replace(/^([A-Z])/, '$1·');
|
||||||
|
this.carList.push({
|
||||||
|
plate,
|
||||||
|
time: new Date().toISOString().slice(0, 10)
|
||||||
|
});
|
||||||
|
this.showBindDialog = false;
|
||||||
|
},
|
||||||
|
onDelete({ index, optionIndex }) {
|
||||||
|
// 侧滑删除操作
|
||||||
|
if (optionIndex === 0) {
|
||||||
|
this.carList.splice(index, 1);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onItemClick(item) {
|
||||||
|
// 点击车牌,发送事件并返回上一页
|
||||||
|
uni.$emit('selectPlate', item.plate);
|
||||||
|
uni.navigateBack();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.container {
|
||||||
|
padding: 20rpx;
|
||||||
|
background-color: #f8f8f8;
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.list {
|
||||||
|
margin-bottom: 60rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.car-item {
|
||||||
|
background-color: #fff;
|
||||||
|
padding: 30rpx;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.car-num {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.car-time {
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #999;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-btn {
|
||||||
|
width: 80%;
|
||||||
|
margin: 0 auto;
|
||||||
|
background-color: #007aff;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 50rpx;
|
||||||
|
height: 90rpx;
|
||||||
|
line-height: 90rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 32rpx;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 40rpx;
|
||||||
|
left: 10%;
|
||||||
|
}
|
||||||
|
</style>
|
@@ -7,11 +7,11 @@
|
|||||||
<view class="info">
|
<view class="info">
|
||||||
<view class="cv-section-title">访客信息</view>
|
<view class="cv-section-title">访客信息</view>
|
||||||
<view class="cv-avatar-upload" @click="chooseAvatar">
|
<view class="cv-avatar-upload" @click="chooseAvatar">
|
||||||
<view v-if="!form.avatar" class="cv-avatar-placeholder">上传正脸照</view>
|
<view v-if="!form.facePictures" class="cv-avatar-placeholder">上传正脸照</view>
|
||||||
<image v-else :src="form.avatar" class="cv-avatar-img" />
|
<image v-else :src="form.facePictures" class="cv-avatar-img" />
|
||||||
</view>
|
</view>
|
||||||
<input class="cv-input-name" placeholder="请输入姓名" v-model="form.name" />
|
<input class="cv-input-name" placeholder="请输入姓名" v-model="form.visitorName" />
|
||||||
<input class="cv-input-phone" placeholder="请输入来访人电话" v-model="form.phone" />
|
<input class="cv-input-phone" placeholder="请输入来访人电话" v-model="form.visitorPhone" />
|
||||||
<input class="cv-input" placeholder="请输入来访人身份证/军官证" v-model="form.idCard" />
|
<input class="cv-input" placeholder="请输入来访人身份证/军官证" v-model="form.idCard" />
|
||||||
</view>
|
</view>
|
||||||
<!-- 选择来访目的 -->
|
<!-- 选择来访目的 -->
|
||||||
@@ -19,7 +19,8 @@
|
|||||||
<view class="cv-section-title">选择来访目的</view>
|
<view class="cv-section-title">选择来访目的</view>
|
||||||
<view class="cv-purpose-list">
|
<view class="cv-purpose-list">
|
||||||
<view v-for="(item, idx) in purposes" :key="idx"
|
<view v-for="(item, idx) in purposes" :key="idx"
|
||||||
:class="['cv-purpose-btn', {active: form.purpose === item}]" @click="form.purpose = item">{{ item }}
|
:class="['cv-purpose-btn', {active: form.visitingReason === item}]"
|
||||||
|
@click="form.visitingReason = item">{{ item }}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="cv-room-select" @click="chooseRoom">
|
<view class="cv-room-select" @click="chooseRoom">
|
||||||
@@ -31,20 +32,21 @@
|
|||||||
<view class="cv-section">
|
<view class="cv-section">
|
||||||
<view class="cv-section-title">来访时间</view>
|
<view class="cv-section-title">来访时间</view>
|
||||||
<view class="cv-time-list">
|
<view class="cv-time-list">
|
||||||
<view v-for="(item, idx) in times" :key="idx" :class="['cv-time-btn', {active: form.time === item}]"
|
<view v-for="(item, idx) in times" :key="idx"
|
||||||
@click="form.time = item">{{ item }}</view>
|
:class="['cv-time-btn', {active: form.visitingBeginTime === item}]"
|
||||||
|
@click="form.visitingBeginTime = item">{{ item }}</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<!-- 是否预约车位 -->
|
<!-- 是否预约车位 -->
|
||||||
<view class="cv-section">
|
<view class="cv-section">
|
||||||
<view class="cv-parking-row">
|
<view class="cv-parking-row">
|
||||||
<view class="cv-section-title">是否预约车位</view>
|
<view class="cv-section-title">是否预约车位</view>
|
||||||
<view class="cv-radio-label" @click="form.parking = true">
|
<view class="cv-radio-label" @click="form.bookingParkingSpace = true">
|
||||||
<view :class="['cv-radio-custom', {checked: form.parking === true}]" />
|
<view :class="['cv-radio-custom', {checked: form.bookingParkingSpace === true}]" />
|
||||||
<text>是</text>
|
<text>是</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="cv-radio-label" @click="form.parking = false">
|
<view class="cv-radio-label" @click="form.bookingParkingSpace = false">
|
||||||
<view :class="['cv-radio-custom', {checked: form.parking === false}]" />
|
<view :class="['cv-radio-custom', {checked: form.bookingParkingSpace === false}]" />
|
||||||
<text>否</text>
|
<text>否</text>
|
||||||
</view>
|
</view>
|
||||||
<text class="cv-parking-count">
|
<text class="cv-parking-count">
|
||||||
@@ -52,45 +54,83 @@
|
|||||||
</text>
|
</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="cv-room-select" @click="chooseCarNumber">
|
<view class="cv-room-select" @click="chooseCarNumber">
|
||||||
<text>{{ form.carNumber || '请选择车牌号' }}</text>
|
<text>{{ form.licensePlate || '请选择车牌号' }}</text>
|
||||||
<text class="cv-arrow">></text>
|
<text class="cv-arrow">></text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<!-- 提交按钮 -->
|
<!-- 提交按钮 -->
|
||||||
<button class="cv-submit-btn">提交</button>
|
<button class="cv-submit-btn" @click="submit">提交</button>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import MediaSelector, {
|
||||||
|
MediaType
|
||||||
|
} from '@/utils/mediaSelector';
|
||||||
|
import {
|
||||||
|
uploadFiles
|
||||||
|
} from '@/common/upload.js';
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
form: {
|
form: {
|
||||||
name: '',
|
visitorName: '',
|
||||||
phone: '',
|
visitorPhone: '',
|
||||||
idCard: '',
|
// idCard: '',
|
||||||
avatar: '',
|
facePictures: '',
|
||||||
purpose: '',
|
visitingReason: '',
|
||||||
room: '',
|
// room: '',
|
||||||
time: '',
|
visitingBeginTime: '2025-07-29',
|
||||||
parking: false,
|
bookingParkingSpace: false,
|
||||||
carNumber: ''
|
licensePlate: ''
|
||||||
},
|
},
|
||||||
purposes: ['商务合作', '园区参观', '面试签到', '装修放行', '家政服务', '送货上门'],
|
purposes: ['商务合作', '园区参观', '面试签到', '装修放行', '家政服务', '送货上门'],
|
||||||
times: ['今天(2025-07-04)', '明天(2025-07-04)']
|
times: ['今天(2025-07-04)', '明天(2025-07-04)']
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
onShow() {
|
||||||
|
uni.$once('selectPlate', plate => {
|
||||||
|
this.form.licensePlate = plate;
|
||||||
|
});
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 新增:处理图片上传
|
||||||
|
async chooseAvatar() {
|
||||||
|
try {
|
||||||
|
// 调用MediaSelector选择图片,最多选择3张
|
||||||
|
const images = await MediaSelector.choose({
|
||||||
|
type: MediaType.IMAGE,
|
||||||
|
count: 1 // 根据剩余数量选择
|
||||||
|
});
|
||||||
|
// 将选择的图片添加到selectedImages数组
|
||||||
|
this.form.facePictures = images[0].path
|
||||||
|
|
||||||
chooseAvatar() {
|
} catch (error) {
|
||||||
// 这里可集成uni.chooseImage
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async submit(){
|
||||||
|
let images = [''];
|
||||||
|
let filePath = this.form.facePictures.replace('file://', '');
|
||||||
|
images[0] = filePath;
|
||||||
|
console.log("t1",images)
|
||||||
|
const result = await uploadFiles({
|
||||||
|
files: images,
|
||||||
|
url: this.vuex_config.baseUrl + '/resource/oss/upload',
|
||||||
|
name: 'file',
|
||||||
|
vm: this // 关键:用于注入 token 等
|
||||||
|
});
|
||||||
|
console.log("t1",result)
|
||||||
},
|
},
|
||||||
chooseRoom() {
|
chooseRoom() {
|
||||||
// 这里可弹出选择房间号
|
// 这里可弹出选择房间号
|
||||||
},
|
},
|
||||||
chooseCarNumber() {
|
chooseCarNumber() {
|
||||||
// 这里可弹出选择车牌号
|
// 这里可弹出选择车牌号
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/sys/user/myPayment/myCarCode'
|
||||||
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -206,8 +246,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.cv-avatar-img {
|
.cv-avatar-img {
|
||||||
width: 120rpx;
|
width: 163rpx;
|
||||||
height: 120rpx;
|
height: 183rpx;
|
||||||
border-radius: 12rpx;
|
border-radius: 12rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -301,6 +341,7 @@
|
|||||||
margin-left: 30rpx;
|
margin-left: 30rpx;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cv-radio-label2 {
|
.cv-radio-label2 {
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
color: #0B0B0B;
|
color: #0B0B0B;
|
||||||
@@ -336,9 +377,11 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cv-parking-num {
|
.cv-parking-num {
|
||||||
color: #007CFF;
|
color: #007CFF;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cv-parking-total {
|
.cv-parking-total {
|
||||||
color: #0B0B0B;
|
color: #0B0B0B;
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user