by2025/SmailParks_visitoer_H5
9
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: by2025:6636b4f1b29c8e7d812c96e85701b089e36de5f3
Branches Tags
by2025:master
...
compare: by2025:master
Branches Tags
by2025:master

7 Commits
6636b4f1b2 ... master

Author SHA1 Message Date
merak1237
6ec38cfd31 页面修改 2025-08-26 16:27:52 +08:00
merak1237
ed68fafa5d 页面修改 2025-08-26 16:08:30 +08:00
liyuanchao
c74e635212 页面修改 2025-08-23 18:32:30 +08:00
liyuanchao
50dbd27f51 问题处理 2025-08-21 16:15:37 +08:00
bichangxiong
f1c1e9d905 更新 pages/sys/msg/index.vue 2025-08-21 14:22:30 +08:00
liyuanchao
d927f79768 页面调整 2025-08-20 11:34:43 +08:00
liyuanchao
845c5593ba 页面调整 2025-08-20 11:33:31 +08:00
4 changed files with 825 additions and 716 deletions
Expand all files Collapse all files

3
common/config.js
View File

@@ -26,5 +26,6 @@ const config = {
// 设置后台接口服务的基础地址 // 设置后台接口服务的基础地址
// config.baseUrl = 'http://tc.cqsznc.com:7080'; // config.baseUrl = 'http://tc.cqsznc.com:7080';
// config.baseUrl = 'http://192.168.71.139:8080'; // config.baseUrl = 'http://192.168.71.139:8080';
config.baseUrl = '/api'; config.baseUrl = 'http://183.230.235.66:11010/api';
// config.baseUrl = '/api';
export default config; export default config;

3
common/http.api.js
View File

@@ -9,6 +9,9 @@ const install = (Vue, vm) => {
// 将各个定义的接口名称，统一放进对象挂载到vm.$u.api(因为vm就是this，也即this.$u.api)下 // 将各个定义的接口名称，统一放进对象挂载到vm.$u.api(因为vm就是this，也即this.$u.api)下
vm.$u.api = { vm.$u.api = {
//获取单位列表
getUnits:(params = {}) => vm.$u.get(config.adminPath+'/property/enum-fetcher/enum-values/getUnit',params),
codesub: (params = {}) => vm.$u.get(config.adminPath+'/property/visitorManagement/useqr', params), codesub: (params = {}) => vm.$u.get(config.adminPath+'/property/visitorManagement/useqr', params),
uploadimg: (params = {}) => vm.$u.post(config.adminPath+'/resource/oss/upload', params), uploadimg: (params = {}) => vm.$u.post(config.adminPath+'/resource/oss/upload', params),
fksub: (params = {}) => vm.$u.post(config.adminPath+'/property/visitorManagement/add', params), fksub: (params = {}) => vm.$u.post(config.adminPath+'/property/visitorManagement/add', params),

47
package-lock.json generated
View File

@@ -1,32 +1,49 @@
{ {
"name": "Aidex", "name": "Aidex",
"version": "2.3.0", "version": "2.3.0",
"lockfileVersion": 1, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": {
"": {
"name": "Aidex",
"version": "2.3.0",
"license": "MIT",
"dependencies": { "dependencies": {
"@icon-park/vue": { "@icon-park/vue": "^1.3.5",
"version": "1.3.5", "vue-i18n": "^8.20.0"
"resolved": "https://registry.nlark.com/@icon-park/vue/download/@icon-park/vue-1.3.5.tgz",
"integrity": "sha1-twRuLCtdpexNZz/7Wta8gL6loTs=",
"requires": {
"@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
"csstype": "^3.0.3"
} }
}, },
"@vue/babel-helper-vue-jsx-merge-props": { "node_modules/@icon-park/vue": {
"version": "1.3.5",
"resolved": "https://registry.npmmirror.com/@icon-park/vue/download/@icon-park/vue-1.3.5.tgz",
"integrity": "sha1-twRuLCtdpexNZz/7Wta8gL6loTs=",
"dependencies": {
"@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
"csstype": "^3.0.3"
},
"engines": {
"node": ">= 8.0.0",
"npm": ">= 5.0.0"
},
"peerDependencies": {
"vue": "2.x"
}
},
"node_modules/@vue/babel-helper-vue-jsx-merge-props": {
"version": "1.2.1", "version": "1.2.1",
"resolved": "https://registry.npm.taobao.org/@vue/babel-helper-vue-jsx-merge-props/download/@vue/babel-helper-vue-jsx-merge-props-1.2.1.tgz", "resolved": "https://registry.npmmirror.com/@vue/babel-helper-vue-jsx-merge-props/download/@vue/babel-helper-vue-jsx-merge-props-1.2.1.tgz",
"integrity": "sha1-MWJKelBfsU2h1YAjclpMXycOaoE=" "integrity": "sha1-MWJKelBfsU2h1YAjclpMXycOaoE="
}, },
"csstype": { "node_modules/csstype": {
"version": "3.0.9", "version": "3.0.9",
"resolved": "https://registry.nlark.com/csstype/download/csstype-3.0.9.tgz?cache=0&sync_timestamp=1631540658518&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fcsstype%2Fdownload%2Fcsstype-3.0.9.tgz", "resolved": "https://registry.npmmirror.com/csstype/download/csstype-3.0.9.tgz",
"integrity": "sha1-ZBCvMbJr0FIJM9AsvGT86c4/vws=" "integrity": "sha1-ZBCvMbJr0FIJM9AsvGT86c4/vws="
}, },
"vue-i18n": { "node_modules/vue-i18n": {
"version": "8.20.0", "version": "8.20.0",
"resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.20.0.tgz", "resolved": "https://registry.npmmirror.com/vue-i18n/download/vue-i18n-8.20.0.tgz",
"integrity": "sha512-ZiAOoeR4d/JtKpbjipx3I80ey7cYG1ki5gQ7HwzWm4YFio9brA15BEYHjalEoBaEfzF5OBEZP+Y2MvAaWnyXXg==" "integrity": "sha512-ZiAOoeR4d/JtKpbjipx3I80ey7cYG1ki5gQ7HwzWm4YFio9brA15BEYHjalEoBaEfzF5OBEZP+Y2MvAaWnyXXg==",
"deprecated": "Vue I18n v8.x has reached EOL and is no longer actively maintained. About maintenance status, see https://vue-i18n.intlify.dev/guide/maintenance.html"
} }
} }
} }

388
pages/sys/msg/index.vue
View File

@@ -8,21 +8,28 @@
<view class="form-item"> <view class="form-item">
<text class="label required">访客姓名</text> <text class="label required">访客姓名</text>
<view class="input-wrapper"> <view class="input-wrapper">
<input type="text" placeholder="请输入您的姓名" v-model="formData.visitorName" /> <input type="text" placeholder="请输入您的姓名" v-model="formData.visitorName"/>
</view>
</view>
<view class="form-item">
<text class="label required">证件号</text>
<view class="input-wrapper">
<input type="text" placeholder="请输入您的证件号" v-model="formData.idCard"/>
</view> </view>
</view> </view>
<view class="form-item"> <view class="form-item">
<text class="label">所属公司</text> <text class="label">所属公司</text>
<view class="input-wrapper"> <view class="input-wrapper">
<input type="text" placeholder="请输入您的公司名称" v-model="formData.visitorUnit" /> <input type="text" placeholder="请输入您的公司名称" v-model="formData.visitorUnit"/>
</view> </view>
</view> </view>
<view class="form-item"> <view class="form-item">
<text class="label required">联系电话</text> <text class="label required">联系电话</text>
<view class="input-wrapper"> <view class="input-wrapper">
<input type="number" placeholder="请输入您的手机号码" v-model="formData.visitorPhone" /> <input type="number" placeholder="请输入您的手机号码" v-model="formData.visitorPhone"/>
</view> </view>
</view> </view>
@@ -31,9 +38,9 @@
<!-- <view class="input-wrapper"> <!-- <view class="input-wrapper">
<input type="text" placeholder="请简要描述拜访目的" v-model="formData.visitingReason" /> <input type="text" placeholder="请简要描述拜访目的" v-model="formData.visitingReason" />
</view> --> </view> -->
<view class="select-wrapper" @click.stop="showTypeDialog = true"> <view class="select-wrapper" :class="{active: showTypeDialog}" @click.stop="showTypeDialog = true">
<text>{{ formData.visitingReason || '请选择拜访事由' }}</text> <text>{{ formData.visitingReason || '请选择拜访事由' }}</text>
<image class="filter-img" src="/static/ic_down_arrow_g.png" /> <image class="filter-img" src="/static/ic_down_arrow_g.png"/>
<view v-if="showTypeDialog" class="dropdown"> <view v-if="showTypeDialog" class="dropdown">
<view class="dropdown-list"> <view class="dropdown-list">
<view v-for="(item, index) in typeList" :key="index" class="dropdown-item" <view v-for="(item, index) in typeList" :key="index" class="dropdown-item"
@@ -46,27 +53,35 @@
</view> </view>
<!-- 被访人信息 --> <!-- 被访人信息 -->
<view class="section-title">被访人信息</view> <view class="section-title">被访人信息</view>
<view class="form-item"> <view class="form-item">
<text class="label">被访人姓名</text> <text class="label">被访人姓名</text>
<view class="input-wrapper"> <view class="input-wrapper">
<input type="text" placeholder="请输入被访人姓名" v-model="formData.interviewedPerson" /> <input type="text" placeholder="请输入被访人姓名" v-model="formData.interviewedPerson"/>
</view> </view>
</view> </view>
<view class="form-item"> <view class="form-item">
<text class="label">被访单位</text> <text class="label">被访单位</text>
<view class="input-wrapper"> <view class="select-wrapper" :class="{active: showUnitDialog}" @click.stop="showUnitDialog = true">
<input type="text" placeholder="请输入被访单位名称" v-model="formData.interviewedUnit" /> <text>{{ formData.interviewedUnit || '请选择被访单位' }}</text>
<image class="filter-img" src="/static/ic_down_arrow_g.png"/>
<view v-if="showUnitDialog" class="dropdown">
<view class="dropdown-list">
<view v-for="(item, index) in unitList" :key="index" class="dropdown-item"
@click.stop="selectInterviewedUnit(item)">
{{ item.name }}
</view>
</view>
</view>
</view> </view>
</view> </view>
<view class="form-item"> <view class="form-item">
<text class="label">被访人电话</text> <text class="label">被访人电话</text>
<view class="input-wrapper"> <view class="input-wrapper">
<input type="number" placeholder="请输入被访人联系电话" v-model="formData.interviewedPhone" /> <input type="number" placeholder="请输入被访人联系电话" v-model="formData.interviewedPhone"/>
</view> </view>
</view> </view>
@@ -77,12 +92,12 @@
<view class="picker-wrapper"> <view class="picker-wrapper">
<picker mode="date" :value="formData.visitingBeginDate" start="2020-01-01" end="2030-12-31" <picker mode="date" :value="formData.visitingBeginDate" start="2020-01-01" end="2030-12-31"
@change="onBeginDateChange"> @change="onBeginDateChange">
<view class="picker-value">{{formData.visitingBeginDate}}</view> <view class="picker-value">{{ formData.visitingBeginDate }}</view>
</picker> </picker>
</view> </view>
<view class="picker-wrapper time-picker"> <view class="picker-wrapper time-picker">
<picker mode="time" :value="formData.visitingBeginTime" @change="onBeginTimeChange"> <picker mode="time" :value="formData.visitingBeginTime" @change="onBeginTimeChange">
<view class="picker-value">{{formData.visitingBeginTime}}</view> <view class="picker-value">{{ formData.visitingBeginTime }}</view>
</picker> </picker>
</view> </view>
</view> </view>
@@ -92,18 +107,18 @@
<view class="picker-wrapper"> <view class="picker-wrapper">
<picker mode="date" :value="formData.visitingEndDate" start="2020-01-01" end="2030-12-31" <picker mode="date" :value="formData.visitingEndDate" start="2020-01-01" end="2030-12-31"
@change="onEndDateChange"> @change="onEndDateChange">
<view class="picker-value">{{formData.visitingEndDate}}</view> <view class="picker-value">{{ formData.visitingEndDate }}</view>
</picker> </picker>
</view> </view>
<view class="picker-wrapper time-picker"> <view class="picker-wrapper time-picker">
<picker mode="time" :value="formData.visitingEndTime" @change="onEndTimeChange"> <picker mode="time" :value="formData.visitingEndTime" @change="onEndTimeChange">
<view class="picker-value">{{formData.visitingEndTime}}</view> <view class="picker-value">{{ formData.visitingEndTime }}</view>
</picker> </picker>
</view> </view>
</view> </view>
<!-- 预约信息 --> <!-- 预约信息 -->
<!-- <view class="section-title">预约信息</view> <!-- <view class="section-title">预约信息</view>
<view class="form-item"> <view class="form-item">
<text class="label">预约车位</text> <text class="label">预约车位</text>
<view class="picker-wrapper"> <view class="picker-wrapper">
@@ -114,7 +129,7 @@
</view> --> </view> -->
<!-- 条件显示：预约车位时显示车牌号 --> <!-- 条件显示：预约车位时显示车牌号 -->
<!-- <view class="form-item" v-if="formData.bookingParkingSpace"> <!-- <view class="form-item" v-if="formData.bookingParkingSpace">
<text class="label required">车牌号</text> <text class="label required">车牌号</text>
<view class="input-wrapper"> <view class="input-wrapper">
<input type="text" placeholder="请输入车牌号" v-model="formData.licensePlate" /> <input type="text" placeholder="请输入车牌号" v-model="formData.licensePlate" />
@@ -132,6 +147,11 @@
</view> </view>
</view> </view>
</view> </view>
<view class="form-item">
<view class="face-tip-wrapper">
<text class="face-tip">请确保无遮挡、光线明亮、正脸拍摄</text>
</view>
</view>
<!-- <view class="form-item"> <!-- <view class="form-item">
<text class="label">预约状态</text> <text class="label">预约状态</text>
@@ -151,7 +171,7 @@
</template> </template>
<script> <script>
export default { export default {
data() { data() {
const now = new Date(); const now = new Date();
const date = now.getFullYear() + '-' + const date = now.getFullYear() + '-' +
@@ -162,13 +182,14 @@
return { return {
formData: { formData: {
visitorName: '1', visitorName: '',
visitorUnit: '1', visitorUnit: '',
visitorPhone: '15555555555', idCard: '',
visitorPhone: '',
visitingReason: '', visitingReason: '',
interviewedPerson: '1', interviewedPerson: '',
interviewedUnit: '1', interviewedUnit: '',
interviewedPhone: '15555555555', interviewedPhone: '',
visitingBeginDate: date, visitingBeginDate: date,
visitingBeginTime: time, visitingBeginTime: time,
visitingEndDate: date, visitingEndDate: date,
@@ -186,8 +207,10 @@
2: '已取消', 2: '已取消',
3: '已完成' 3: '已完成'
}, },
typeList:['业务洽谈','会议参与','面试应聘','技术支持','办事咨询','调研考察'], typeList: ['业务洽谈', '会议参与', '面试应聘', '技术支持', '办事咨询', '调研考察'],
showTypeDialog:false unitList: [],
showTypeDialog: false,
showUnitDialog: false
} }
}, },
onLoad(options) { onLoad(options) {
@@ -211,23 +234,47 @@
// #ifdef APP-PLUS // #ifdef APP-PLUS
plus.screen.lockOrientation('default'); plus.screen.lockOrientation('default');
// #endif // #endif
// 获取单位列表
this.getUnits();
}, },
onReady() { onReady() {
// #ifdef APP-PLUS // #ifdef APP-PLUS
plus.screen.lockOrientation('landscape-primary'); plus.screen.lockOrientation('landscape-primary');
// #endif // #endif
}, },
mounted() {
document.addEventListener('click', this.handleClickOutside);
// 调用getUnits方法获取被访单位数据
this.getUnits();
},
beforeDestroy() {
document.removeEventListener('click', this.handleClickOutside);
},
methods: { methods: {
async getUnits() {
let res = await this.$u.api.getUnits();
if (res.code == '200') {
this.unitList = res.data;
}
},
// 添加选择拜访事由方法 // 添加选择拜访事由方法
selectVisitingReason(reason) { selectVisitingReason(reason) {
this.formData.visitingReason = reason; this.formData.visitingReason = reason;
this.showTypeDialog = false; this.showTypeDialog = false;
}, },
// 添加选择被访单位方法
selectInterviewedUnit(unit) {
this.formData.interviewedUnit = unit.name;
this.formData.interviewedUnitId = unit.value;
this.showUnitDialog = false;
},
// 点击外部关闭下拉菜单 // 点击外部关闭下拉菜单
handleClickOutside() { handleClickOutside() {
this.showTypeDialog = false; this.showTypeDialog = false;
this.showUnitDialog = false;
}, },
// 处理日期时间选择 // 处理日期时间选择
@@ -265,6 +312,20 @@
success: (res) => { success: (res) => {
// console.log(res.tempFilePaths[0]) // console.log(res.tempFilePaths[0])
this.formData.facePictures = res.tempFilePaths[0]; this.formData.facePictures = res.tempFilePaths[0];
// 压缩图片
uni.compressImage({
src: this.formData.facePictures, // 原图路径
quality: 70, // 压缩质量 0-100
success: (res) => {
this.formData.facePictures = res.tempFilePath
},
fail: (err) => {
uni.showToast({
title: '拍照失败',
icon: 'none'
});
}
});
}, },
fail: (err) => { fail: (err) => {
uni.showToast({ uni.showToast({
@@ -281,9 +342,11 @@
qrCodeId, qrCodeId,
visitorName, visitorName,
visitorUnit, visitorUnit,
idCard,
visitorPhone, visitorPhone,
visitingReason, visitingReason,
interviewedPerson, interviewedPerson,
interviewedUnit,
bookingParkingSpace, bookingParkingSpace,
licensePlate, licensePlate,
facePictures, facePictures,
@@ -299,8 +362,13 @@
} }
// 验证公司 // 验证公司
if (!visitorUnit) { if (!idCard) {
return '请输入所属公司'; return '请输入证件号';
}
// 验证被访单位
if (!interviewedUnit) {
return '请选择被访单位';
} }
// 验证电话 // 验证电话
@@ -319,9 +387,9 @@
} }
// 验证被访人 // 验证被访人
if (!interviewedPerson) { // if (!interviewedPerson) {
return '请输入被访人姓名'; // return '请输入被访人姓名';
} // }
// 验证车牌号（如果需要预约车位） // 验证车牌号（如果需要预约车位）
// if (bookingParkingSpace && !licensePlate) { // if (bookingParkingSpace && !licensePlate) {
@@ -359,12 +427,7 @@
this.formData.visitingBeginTime = `${this.formData.visitingBeginDate} ${this.formData.visitingBeginTime}`; this.formData.visitingBeginTime = `${this.formData.visitingBeginDate} ${this.formData.visitingBeginTime}`;
this.formData.visitingEndTime = `${this.formData.visitingEndDate} ${this.formData.visitingEndTime}`; this.formData.visitingEndTime = `${this.formData.visitingEndDate} ${this.formData.visitingEndTime}`;
// 准备提交数据
const submitData = {
...this.formData,
bookingParkingSpace: this.formData.bookingParkingSpace ? 0 : 1
};
console.log(submitData)
// 显示加载提示 // 显示加载提示
uni.showLoading({ uni.showLoading({
@@ -374,7 +437,7 @@
// 模拟API请求 // 模拟API请求
setTimeout(() => { setTimeout(() => {
uni.request({url:this.formData.facePictures}) uni.request({url: this.formData.facePictures})
// .then(response => response.blob()) // .then(response => response.blob())
.then(blob => { .then(blob => {
// 此时得到了原始Blob对象 // 此时得到了原始Blob对象
@@ -397,25 +460,59 @@
formData: { formData: {
'code': this.formData.qrCodeId // 示例：其他表单字段 'code': this.formData.qrCodeId // 示例：其他表单字段
}, },
// 上传进度回调 // // 上传进度回调
onProgressUpdate: (res) => { // onProgressUpdate: (res) => {
this.progress = res.progress; // this.progress = res.progress;
console.log('上传进度:' + res.progress); // console.log('上传进度:' + res.progress);
}, // },
// 上传成功回调 // 上传成功回调
success: (res) => { success: (res) => {
console.log('上传成功', res); console.log('上传成功', res);
this.uploadResult = res.data;
uni.showToast({ uni.showToast({
title: '上传成功', title: "上传图片成功！",
icon: 'success' icon: "success"
})
// this.formData.facePictures = res.data.ossId;
// 准备提交数据
const submitData = {
...this.formData,
bookingParkingSpace: this.formData.bookingParkingSpace ? 0 : 1
};
const parsedData = JSON.parse(res.data);
if(parsedData.code == 200){
// 第二步：从解析后的数据中获取ossId
const ossId = parsedData.data.ossId;
console.log("ossId",ossId)
submitData.facePictures=ossId;
submitData.interviewedUnitId = this.formData.interviewedUnitId;
console.log(submitData)
this.$u.api.fksub(submitData).then(res => {
console.log(res)
if (res.code == 200) {
uni.showToast({
title: "提交成功，请等待审核！",
icon: "success"
})
}
})
}else{
uni.showToast({
title: '提交失败',
icon: 'none'
}); });
}
// uni.showToast({
// title: '上传成功',
// icon: 'success'
// });
}, },
// 上传失败回调 // 上传失败回调
fail: (err) => { fail: (err) => {
console.error('上传失败', err); console.error('提交失败', err);
uni.showToast({ uni.showToast({
title: '上传失败', title: '提交失败',
icon: 'none' icon: 'none'
}); });
}, },
@@ -441,20 +538,7 @@
}); });
this.$u.api.fksub(submitData).then(res => {
console.log(res)
if (res.code == 200) {
uni.showToast({
title: "提交成功，请等待审核！",
icon: "success"
})
} else {
uni.showToast({
title: "提交失败！",
icon: "error"
})
}
})
uni.hideLoading(); uni.hideLoading();
// 显示成功提示 // 显示成功提示
@@ -493,6 +577,7 @@
visitingReason: '', visitingReason: '',
interviewedPerson: '', interviewedPerson: '',
interviewedUnit: '', interviewedUnit: '',
interviewedUnitId: '',
interviewedPhone: '', interviewedPhone: '',
visitingBeginDate: date, visitingBeginDate: date,
visitingBeginTime: time, visitingBeginTime: time,
@@ -505,32 +590,32 @@
}; };
} }
} }
} }
</script> </script>
<style scoped> <style scoped>
.container { .container {
background-color: #f5f7fa; background-color: #f5f7fa;
min-height: 100vh; min-height: 100vh;
} }
.form-card { .form-card {
background-color: #fff; background-color: #fff;
border-radius: 12px; border-radius: 12px;
margin: 16px; margin: 16px;
padding: 20px; padding: 20px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
} }
.form-title { .form-title {
font-size: 20px; font-size: 20px;
font-weight: bold; font-weight: bold;
color: #333; color: #333;
text-align: center; text-align: center;
margin-bottom: 24px; margin-bottom: 24px;
} }
.section-title { .section-title {
font-size: 16px; font-size: 16px;
font-weight: 600; font-weight: 600;
color: #333; color: #333;
@@ -538,28 +623,28 @@
margin-bottom: 12px; margin-bottom: 12px;
padding-left: 8px; padding-left: 8px;
border-left: 3px solid #007aff; border-left: 3px solid #007aff;
} }
.form-item { .form-item {
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 16px; margin-bottom: 16px;
} }
.label { .label {
width: 96px; width: 96px;
font-size: 14px; font-size: 14px;
color: #666; color: #666;
margin-right: 12px; margin-right: 12px;
} }
.label.required::before { .label.required::before {
content: '*'; content: '*';
color: #ff4d4f; color: #ff4d4f;
margin-right: 4px; margin-right: 4px;
} }
.input-wrapper { .input-wrapper {
flex: 1; flex: 1;
height: 40px; height: 40px;
border: 1px solid #e5e6eb; border: 1px solid #e5e6eb;
@@ -568,9 +653,9 @@
display: flex; display: flex;
align-items: center; align-items: center;
position: relative; position: relative;
} }
.select-wrapper { .select-wrapper {
flex: 1; flex: 1;
height: 40px; height: 40px;
border: 1px solid #e5e6eb; border: 1px solid #e5e6eb;
@@ -580,69 +665,42 @@
align-items: center; align-items: center;
position: relative; position: relative;
cursor: pointer; cursor: pointer;
} }
.select-wrapper text { .select-wrapper text {
flex: 1; flex: 1;
font-size: 14px; font-size: 14px;
color: #333; color: #333;
} }
u-icon { .filter-img {
width: 18rpx;
height: 10rpx;
margin-left: 8rpx;
transition: transform 0.3s; transition: transform 0.3s;
} }
.select-wrapper.active u-icon { .select-wrapper.active .filter-img {
transform: rotate(180deg); transform: rotate(180deg);
} }
.dropdown { .input-wrapper input {
position: absolute;
top: calc(100% + 5px);
left: 0;
right: 0;
background: #fff;
border-radius: 6px;
box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.1);
z-index: 999;
max-height: 200px;
overflow-y: auto;
}
.dropdown-item {
padding: 12px;
font-size: 14px;
color: #333;
border-bottom: 1rpx solid #eee;
text-align: left;
cursor: pointer;
}
.dropdown-item:last-child {
border-bottom: none;
}
.dropdown-item:hover {
background-color: #f5f7fa;
}
.input-wrapper input {
flex: 1; flex: 1;
height: 100%; height: 100%;
font-size: 14px; font-size: 14px;
color: #333; color: #333;
} }
.filter-img { .input-wrapper .filter-img {
position: absolute; position: absolute;
right: 12px; right: 12px;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
width: 18px; /* Adjust based on your image size */ width: 18px; /* Adjust based on your image size */
height: 10px; /* Adjust based on your image size */ height: 10px; /* Adjust based on your image size */
} }
.picker-wrapper { .picker-wrapper {
flex: 1; flex: 1;
height: 40px; height: 40px;
border: 1px solid #e5e6eb; border: 1px solid #e5e6eb;
@@ -652,9 +710,9 @@
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
position: relative; position: relative;
} }
.picker-wrapper::after { .picker-wrapper::after {
content: ''; content: '';
width: 0; width: 0;
height: 0; height: 0;
@@ -663,25 +721,25 @@
border-top: 6px solid #999; border-top: 6px solid #999;
position: absolute; position: absolute;
right: 12px; right: 12px;
} }
.time-picker { .time-picker {
margin-left: 10px; margin-left: 10px;
} }
.picker-value { .picker-value {
font-size: 14px; font-size: 14px;
color: #333; color: #333;
flex: 1; flex: 1;
} }
.upload-wrapper { .upload-wrapper {
flex: 1; flex: 1;
display: flex; display: flex;
align-items: center; align-items: center;
} }
.upload-btn { .upload-btn {
width: 80px; width: 80px;
height: 80px; height: 80px;
background-color: #f5f7fa; background-color: #f5f7fa;
@@ -691,33 +749,33 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border: 1px dashed #e5e6eb; border: 1px dashed #e5e6eb;
} }
.upload-text { .upload-text {
font-size: 12px; font-size: 12px;
color: #999; color: #999;
margin-top: 4px; margin-top: 4px;
} }
.preview-image { .preview-image {
width: 80px; width: 80px;
height: 80px; height: 80px;
border-radius: 6px; border-radius: 6px;
margin-left: 12px; margin-left: 12px;
overflow: hidden; overflow: hidden;
border: 1px solid #e5e6eb; border: 1px solid #e5e6eb;
} }
.preview-image image { .preview-image image {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.submit-wrapper { .submit-wrapper {
margin-top: 32px; margin-top: 32px;
} }
.submit-btn { .submit-btn {
width: 100%; width: 100%;
height: 44px; height: 44px;
background-color: #007aff; background-color: #007aff;
@@ -728,9 +786,30 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.dropdown { .filter-btn {
padding: 15rpx 22rpx;
background: #f7f7f7;
border-radius: 25rpx;
height: 58rpx;
color: #9a9a9a;
font-size: 28rpx;
display: flex;
justify-content: center;
align-items: center;
margin-right: 24rpx;
position: relative;
cursor: pointer;
}
.filter-img {
width: 18rpx;
height: 10rpx;
margin-left: 8rpx;
}
.dropdown {
position: absolute; position: absolute;
top: calc(100% + 5px); top: calc(100% + 5px);
left: 0; left: 0;
@@ -741,22 +820,31 @@
z-index: 999; z-index: 999;
max-height: 200px; max-height: 200px;
overflow-y: auto; overflow-y: auto;
} }
.dropdown-item { .dropdown-item {
padding: 12px; padding: 12px;
font-size: 14px; font-size: 14px;
color: #333; color: #333;
border-bottom: 1rpx solid #eee; border-bottom: 1rpx solid #eee;
text-align: left; text-align: left;
cursor: pointer; cursor: pointer;
} }
.dropdown-item:last-child { .dropdown-item:last-child {
border-bottom: none; border-bottom: none;
}
.dropdown-item:hover {
background-color: #f5f7fa;
}
.face-tip-wrapper {
flex: 1;
margin-left: 108px; /* 与label宽度和margin一致 */
} }
.dropdown-item:hover { .face-tip {
background-color: #f5f7fa; font-size: 12px;
color: #999;
} }
</style> </style>