Browse Source

feat: 添加用户信息参数并优化日期选择功能

- 在多个API中添加`params`参数以支持用户信息传递
- 优化日期选择功能,支持多选和编辑模式
- 更新表单字段和验证逻辑,提升用户体验
master
前端-胡立永 5 days ago
parent
commit
dd4a4c2d2d
8 changed files with 287 additions and 126 deletions
  1. +11
    -0
      api/address/address.js
  2. +2
    -1
      api/date/index.js
  3. +3
    -2
      api/pet/index.js
  4. +82
    -18
      otherPages/authentication/connectAddress/detail.vue
  5. +13
    -8
      otherPages/authentication/connectAddress/index.vue
  6. +126
    -81
      otherPages/authentication/serve/index.vue
  7. +34
    -10
      otherPages/myOrdersManage/date/detail.vue
  8. +16
    -6
      otherPages/userManage/pet/index.vue

+ 11
- 0
api/address/address.js View File

@ -47,4 +47,15 @@ export const udpateAddress = (data) => {
method: "post", method: "post",
data data
}) })
}
// 地址-地址修改
export const addressDetail = (data) => {
return request({
url: '/applet/address/addressDetail/' + data,
headers: {
isToken: true
},
method: "get",
})
} }

+ 2
- 1
api/date/index.js View File

@ -20,10 +20,11 @@ export function insertOutDate(data) {
} }
// 接单地址-不接单日期列表数据查询 // 接单地址-不接单日期列表数据查询
export function outDateList() {
export function outDateList(params) {
return request({ return request({
'url': '/applet/outDate/outDateList', 'url': '/applet/outDate/outDateList',
'method': 'get', 'method': 'get',
params
}) })
} }


+ 3
- 2
api/pet/index.js View File

@ -1,13 +1,14 @@
import request from '@/utils/request' import request from '@/utils/request'
// 查询我的宠物列表 // 查询我的宠物列表
export function getpetList() {
export function getpetList(params) {
return request({ return request({
headers: { headers: {
"isToken": true "isToken": true
}, },
url: "/applet/pet/list", url: "/applet/pet/list",
method: 'get'
method: 'get',
params
}) })
} }


+ 82
- 18
otherPages/authentication/connectAddress/detail.vue View File

@ -30,21 +30,37 @@
<text>{{ !!form.status ? '开启' : '关闭' }}</text> <text>{{ !!form.status ? '开启' : '关闭' }}</text>
</view> </view>
</up-form-item> </up-form-item>
<up-form-item label="接单范围" prop="searchValue">
<up-input v-model="form.searchValue" placeholder="请输入内容" inputAlign="right" border="none">
<up-form-item label="接单范围" prop="rangeNo">
<up-input v-model="form.rangeNo" placeholder="请输入内容" inputAlign="right" border="none">
<template #suffix> <template #suffix>
<text>Km</text> <text>Km</text>
</template> </template>
</up-input> </up-input>
</up-form-item> </up-form-item>
<up-form-item @click="toNoOrderDate" label="不接单日期(选填)" prop="disabledDate" labelWidth="300rpx">
<up-form-item @click="toNoOrderDate"
v-if="eidtItem"
label="不接单日期(选填)" prop="disabledDate" labelWidth="300rpx">
<view class="" style="display: flex;width: 380rpx;">
<view class="text-ellipsis"
style="margin-left: auto;"
v-if="eidtItem.appletOutDate && eidtItem.appletOutDate.length">
{{ getDisabledDateDesc(eidtItem.appletOutDate) }}
</view>
<view class="text-ellipsis"
style="margin-left: auto;" v-else>
暂无不可接单日期
</view>
>
</view>
</up-form-item> </up-form-item>
</view> </view>
</view> </view>
</up-form> </up-form>
<view>
<view style="margin-top: 40rpx;">
<up-parse class="size-28" :content="configList.adress_statement.paramValueArea" containerStyle="{ <up-parse class="size-28" :content="configList.adress_statement.paramValueArea" containerStyle="{
color: '#707070', color: '#707070',
fontSize: '22rpx', fontSize: '22rpx',
@ -63,17 +79,21 @@
<script setup> <script setup>
import { import {
ref, ref,
getCurrentInstance
getCurrentInstance,
computed,
} from 'vue' } from 'vue'
import dayjs from 'dayjs'
import { import {
store store
} from '@/store' } from '@/store'
import { import {
insertAddress, insertAddress,
udpateAddress
udpateAddress,
addressDetail,
} from "@/api/address/address.js" } from "@/api/address/address.js"
import { import {
onLoad
onLoad,
onShow
} from '@dcloudio/uni-app' } from '@dcloudio/uni-app'
const instance = getCurrentInstance(); const instance = getCurrentInstance();
@ -89,20 +109,31 @@
distance: null, distance: null,
disabledDate: [], disabledDate: [],
}) })
const userInfo = computed(() => {
return store.getters.userInfo;
})
const rules = ref({}) const rules = ref({})
const eidtItem = ref(null); const eidtItem = ref(null);
const addressId = ref(0)
onLoad((options) => { onLoad((options) => {
eidtItem.value = options?.item ? JSON.parse(options.item) : null;
form.value = {
id: eidtItem?.value?.id || null,
area: eidtItem?.value?.area || null,
address: eidtItem?.value?.address || null,
status: eidtItem?.value?.status == 'true' || null,
latitude: eidtItem?.value?.latitude || null,
longitude: eidtItem?.value?.longitude || null
}
addressId.value = options.addressId
// eidtItem.value = options?.item ? JSON.parse(options.item) : null;
// form.value = {
// id: eidtItem?.value?.id || null,
// area: eidtItem?.value?.area || null,
// address: eidtItem?.value?.address || null,
// status: eidtItem?.value?.status == 'true' || null,
// latitude: eidtItem?.value?.latitude || null,
// longitude: eidtItem?.value?.longitude || null
// }
}); });
onShow(() => {
getDetail()
})
const setAddress = (res) => { const setAddress = (res) => {
form.value.latitude = res.latitude form.value.latitude = res.latitude
@ -136,13 +167,15 @@
let code = null; let code = null;
if (eidtItem?.value?.id) { if (eidtItem?.value?.id) {
let result = await udpateAddress({ let result = await udpateAddress({
...form.value
...form.value,
userId : userInfo.value.userId,
}) })
code = result.code code = result.code
} else { } else {
// //
let result = await insertAddress({ let result = await insertAddress({
...form.value
...form.value,
userId : userInfo.value.userId,
}) })
code = result.code code = result.code
} }
@ -150,6 +183,30 @@
uni.navigateBack() uni.navigateBack()
} }
} }
function getDetail(){
addressDetail(addressId.value).
then(res => {
console.log(res.data);
eidtItem.value = res.data
form.value = {
id: eidtItem?.value?.id || null,
area: eidtItem?.value?.area || null,
address: eidtItem?.value?.address || null,
status: eidtItem?.value?.status == 'true' || null,
latitude: eidtItem?.value?.latitude || null,
longitude: eidtItem?.value?.longitude || null
}
})
}
const getDisabledDateDesc = (dateArr) => {
if (!dateArr?.length) {
return '暂无不可接单日期'
}
return dateArr.map(date => dayjs(date.date).format('MM-DD')).join('、')
}
const toNoOrderDate = () => { const toNoOrderDate = () => {
if (eidtItem?.value?.id) { if (eidtItem?.value?.id) {
@ -191,4 +248,11 @@
color: #707070; color: #707070;
} }
} }
.text-ellipsis {
text-align: right;
overflow: hidden; //
text-overflow: ellipsis; //
white-space: nowrap; //
width: 330rpx;
}
</style> </style>

+ 13
- 8
otherPages/authentication/connectAddress/index.vue View File

@ -16,8 +16,8 @@
<view class="size-30"> <view class="size-30">
{{ item.area }} {{ item.area }}
</view> </view>
<view class="size-22 color-777 mt16" v-if="item.searchValue">
{{ `接单范围:${item.searchValue}km` }}
<view class="size-22 color-777 mt16" v-if="item.rangeNo">
{{ `接单范围:${item.rangeNo}km` }}
</view> </view>
<view class="size-22 color-777 mt16" v-else> <view class="size-22 color-777 mt16" v-else>
接单范围未设置 接单范围未设置
@ -31,11 +31,11 @@
</view> </view>
</view> </view>
<view class="color-999 size-22 mt16 flex-rowl"> <view class="color-999 size-22 mt16 flex-rowl">
<text v-if="item.disabledDate">
{{ `${item.disabledDate?.length}天:` }}
<text v-if="item.appletOutDate">
{{ `${item.appletOutDate?.length}天:` }}
</text> </text>
<text class="text-ellipsis" style="flex: 1;"> <text class="text-ellipsis" style="flex: 1;">
{{ getDisabledDateDesc(item.disabledDate) }}
{{ getDisabledDateDesc(item.appletOutDate) }}
</text> </text>
</view> </view>
</view> </view>
@ -112,6 +112,9 @@
const configList = computed(() => { const configList = computed(() => {
return store.getters.configList return store.getters.configList
}) })
const userInfo = computed(() => {
return store.getters.userInfo;
})
const list = ref([]) const list = ref([])
const modal = ref(null) const modal = ref(null)
@ -119,7 +122,9 @@
const fetchAddressList = async () => { const fetchAddressList = async () => {
try { try {
let response = await getAddressList();
let response = await getAddressList({
userId : userInfo.value.userId
});
list.value = response.data || [] list.value = response.data || []
} catch (err) { } catch (err) {
@ -144,13 +149,13 @@
return '暂无不可接单日期' return '暂无不可接单日期'
} }
return dateArr.map(date => dayjs(date).format('MM-DD')).join('、')
return dateArr.map(date => dayjs(date.date).format('MM-DD')).join('、')
} }
const toAdd = (item) => { const toAdd = (item) => {
if (item) { if (item) {
uni.navigateTo({ uni.navigateTo({
url: `/otherPages/authentication/connectAddress/detail?item=${JSON.stringify(item)}`
url: `/otherPages/authentication/connectAddress/detail?addressId=${item.id}`
}) })
} else { } else {
uni.navigateTo({ uni.navigateTo({


+ 126
- 81
otherPages/authentication/serve/index.vue View File

@ -24,7 +24,27 @@
</button> </button>
</view> </view>
<view class="form"> <view class="form">
<view class="form-item flex-rowb">
<view class="size-28">昵称</view>
<view class="flex-rowr">
<input type="text" placeholder="请输入" v-model="form.nickname" class="input-right" />
</view>
</view>
<view class="form-item flex-rowb">
<view class="size-28">手机号</view>
<view class="flex-rowr">
<text>{{baseInfo.info.userTelephone || ''}}</text>
</view>
</view>
<view class="form-item flex-rowb">
<view class="size-28">性别</view>
<view class="flex-rowr" @click="openGenderSelect">
<text>{{form.gender || '请选择'}}</text>
<up-icon name="arrow-right" color="#999999" size="32rpx"></up-icon>
</view>
</view>
</view> </view>
</view> </view>
@ -34,6 +54,28 @@
<text class="size-22 color-ffb fw700">(重要)</text> <text class="size-22 color-ffb fw700">(重要)</text>
</view> </view>
<view class="form"> <view class="form">
<view class="form-item flex-rowb">
<view class="size-28">个人简介</view>
<view class="flex-rowr">
<textarea v-model="form.introduction" placeholder="请输入" class="textarea-full" maxlength="200"></textarea>
</view>
</view>
<view class="form-item flex-rowb">
<view class="size-28">养宠经验</view>
<view class="flex-rowr">
<input type="number" v-model="form.petExperience" placeholder="请输入您的养宠年限" class="input-right" />
<text class="ml10"></text>
</view>
</view>
<view class="form-item flex-rowb">
<view class="size-28">服务记录</view>
<view class="flex-rowr" @click="jumpToServeRecord">
<text>{{ `${serviceCount}` }}</text>
<up-icon name="arrow-right" color="#999999" size="32rpx"></up-icon>
</view>
</view>
</view> </view>
</view> </view>
@ -42,6 +84,28 @@
服务资料 服务资料
</view> </view>
<view class="form"> <view class="form">
<view class="form-item flex-rowb">
<view class="size-28">服务宠物类型</view>
<view class="flex-rowr" @click="openTypeSelectPopup">
<text>{{ typeDesc }}</text>
<up-icon name="arrow-right" color="#999999" size="32rpx"></up-icon>
</view>
</view>
<view class="form-item flex-rowb">
<view class="size-28">基础服务</view>
<view class="flex-rowr">
<text>宠物喂养 上门遛狗</text>
</view>
</view>
<view class="form-item flex-rowb">
<view class="size-28">增值服务</view>
<view class="flex-rowr" @click="openServeSelectPopup">
<text>{{ serveDesc }}</text>
<up-icon name="arrow-right" color="#999999" size="32rpx"></up-icon>
</view>
</view>
</view> </view>
</view> </view>
@ -88,6 +152,10 @@
const form = reactive({ const form = reactive({
headImage: null, headImage: null,
nickname: '',
gender: '',
introduction: '',
petExperience: '',
type: [], type: [],
serve: [], serve: [],
}) })
@ -105,84 +173,6 @@
const displayInfoRef = ref(null) const displayInfoRef = ref(null)
const serveInfoRef = ref(null) const serveInfoRef = ref(null)
const state = reactive({
baseInfoList: [{
type: "input",
label: "昵称",
key: "userName",
placeholder: "请输入",
},
{
type: "input",
label: "手机号",
key: "userTelephone",
placeholder: "请输入",
},
{
type: "select",
label: "性别",
key: "sex",
placeholder: "请选择",
options: [
{
name: "男",
value : '男',
},
{
name: "女",
value : '男',
}
]
}
],
displayInfoList: [{
type: "input",
label: "个人简介",
key: "jianjie",
placeholder: "请输入",
},
{
type: "input",
label: "养宠经验",
unit: "年",
key: "jingyan",
placeholder: "请输入",
},
{
type: "custom",
label: "服务记录",
key: "jilu",
placeholder: "请选择",
options: [{
name: "男"
},
{
name: "女"
}
]
}
],
serveInfoList: [{
type: "custom",
label: "服务宠物类型",
key: "type",
placeholder: "请选择",
},
{
type: "input",
label: "基础服务",
key: "base",
placeholder: "宠物喂养上门遛狗",
},
{
type: "custom",
label: "增值服务",
key: "zenz",
placeholder: "请选择",
}
],
})
const jumpToServeRecord = () => { const jumpToServeRecord = () => {
uni.navigateTo({ uni.navigateTo({
url: "/otherPages/authentication/serve/record" url: "/otherPages/authentication/serve/record"
@ -246,7 +236,42 @@
}) })
} }
const genderOptions = [
{ text: '男', value: '男' },
{ text: '女', value: '女' }
]
const openGenderSelect = () => {
uni.showActionSheet({
itemList: genderOptions.map(item => item.text),
success: function (res) {
form.gender = genderOptions[res.tapIndex].value
fetchUpdate()
}
})
}
const fetchUpdate = () => {
//
console.log('更新数据', form)
}
function submit(){ function submit(){
//
if (!form.nickname) {
uni.showToast({
title: '请输入昵称',
icon: 'none'
})
return
}
//
console.log('提交表单数据', form)
uni.showToast({
title: '保存成功',
icon: 'success'
})
} }
onShow(() => { onShow(() => {
@ -258,8 +283,11 @@
onMounted(()=> { onMounted(()=> {
// todo: fetch data and init data // todo: fetch data and init data
serveInfoRef.value.setDataByKey('base', configList.value.pet_basic_services.paramValueText)
//
if (baseInfo.value && baseInfo.value.info) {
form.nickname = baseInfo.value.info.userName || ''
form.gender = baseInfo.value.info.gender || ''
}
}) })
</script> </script>
@ -280,9 +308,26 @@
align-items: center; align-items: center;
} }
.flex-rowb {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20rpx 0;
}
.ml10 { .ml10 {
margin-left: 10rpx; margin-left: 10rpx;
} }
.input-right {
text-align: right;
}
.textarea-full {
width: 100%;
min-height: 120rpx;
text-align: right;
}
} }
.page { .page {


+ 34
- 10
otherPages/myOrdersManage/date/detail.vue View File

@ -21,7 +21,7 @@
共不接单时间 共不接单时间
</view> </view>
<view class="level center_item"> <view class="level center_item">
<view >
<view @click="calendarShowEdit = true">
<!-- <up-icon name="edit-pen" color="#2979ff" size="22"></up-icon> --> <!-- <up-icon name="edit-pen" color="#2979ff" size="22"></up-icon> -->
修改 修改
</view> </view>
@ -46,8 +46,19 @@
</view> </view>
<up-action-sheet :actions="list" @select="selectClick" :show="show" :round="10"></up-action-sheet> <up-action-sheet :actions="list" @select="selectClick" :show="show" :round="10"></up-action-sheet>
<up-calendar :show="calendarShow" color="#FFBF60" :round="10" :showTitle="false" :mode="mode" @confirm="confirm"
@close="closeCandler" :minDate="minDate" :maxDate="maxDate"></up-calendar>
<up-calendar
:show="calendarShow" color="#FFBF60" :round="10" :showTitle="false" :mode="mode" @confirm="confirm"
@close="closeCandler"
:maxDate="maxDate"></up-calendar>
<up-calendar
:show="calendarShowEdit" color="#FFBF60"
:defaultDate="selectDateList"
@close="calendarShowEdit = false"
:round="10" :showTitle="false" mode="multiple" @confirm="calendarShowEditConfirm"
:maxDate="maxDate"></up-calendar>
</template> </template>
<script setup> <script setup>
@ -63,6 +74,7 @@
insertOutDate, insertOutDate,
outDateList outDateList
} from "@/api/date/index.js" } from "@/api/date/index.js"
import dayjs from "dayjs";
onLoad((options) => { onLoad((options) => {
addressId.value = options.addressId addressId.value = options.addressId
@ -89,21 +101,21 @@
const show = ref(false); const show = ref(false);
const calendarShow = ref(false); const calendarShow = ref(false);
const calendarShowEdit = ref(false);
const mode = ref('range'); const mode = ref('range');
const selectDateList = ref([]); const selectDateList = ref([]);
const groupedDates = ref({}); // const groupedDates = ref({}); //
const d = new Date(); const d = new Date();
const currentYear = d.getFullYear();
const minDate = `${currentYear}-01-01`;
const currentYear = d.getFullYear() + 10;
const maxDate = `${currentYear}-12-31`; const maxDate = `${currentYear}-12-31`;
// //
const selectClick = (selectItem) => { const selectClick = (selectItem) => {
if (selectItem.index == 0) { if (selectItem.index == 0) {
mode.value = 'range';
mode.value = 'range';//multiple range
calendarShow.value = true; calendarShow.value = true;
} else if (selectItem.index == 1) { } else if (selectItem.index == 1) {
mode.value = 'single';
mode.value = 'multiple';
calendarShow.value = true; calendarShow.value = true;
} }
show.value = false; show.value = false;
@ -112,9 +124,20 @@
const confirm = (e) => { const confirm = (e) => {
const list = [...selectDateList.value, ...e]; const list = [...selectDateList.value, ...e];
selectDateList.value = [...new Set(list)]; selectDateList.value = [...new Set(list)];
selectDateList.value.sort((a, b) => {
return dayjs(a).valueOf() - dayjs(b).valueOf();
});
gruopDate(selectDateList.value); gruopDate(selectDateList.value);
calendarShow.value = false; calendarShow.value = false;
}; };
function calendarShowEditConfirm(data){
selectDateList.value = data
calendarShowEdit.value = false
gruopDate(selectDateList.value);
}
const closeCandler = () => { const closeCandler = () => {
calendarShow.value = false; calendarShow.value = false;
@ -168,7 +191,7 @@
} }
let response = await insertOutDate({ let response = await insertOutDate({
addressId: addressId.value, addressId: addressId.value,
date: selectDateList.value.toString()
dataJson : selectDateList.value.toString()
}) })
if (response.code == 200) { if (response.code == 200) {
uni.showToast({ uni.showToast({
@ -180,13 +203,14 @@
} }
const getOutDateList = async () => { const getOutDateList = async () => {
let response = await outDateList();
let response = await outDateList({
addressId: addressId.value,
});
if (response.code == 200 && response.data) { if (response.code == 200 && response.data) {
let list = response.data.filter(item => item.date !== null && item.date !== undefined); let list = response.data.filter(item => item.date !== null && item.date !== undefined);
list = list.map(item => item.date); list = list.map(item => item.date);
// //
selectDateList.value = [...new Set(list)]; selectDateList.value = [...new Set(list)];
console.log(selectDateList)
gruopDate(selectDateList.value); gruopDate(selectDateList.value);
} }
} }


+ 16
- 6
otherPages/userManage/pet/index.vue View File

@ -78,7 +78,8 @@
<script setup> <script setup>
import { import {
ref, ref,
onMounted
onMounted,
computed
} from 'vue'; } from 'vue';
// import { // import {
// getDictList // getDictList
@ -94,7 +95,14 @@
onShow, onShow,
onPullDownRefresh onPullDownRefresh
} from '@dcloudio/uni-app' } from '@dcloudio/uni-app'
import {
useStore
} from "vuex"
const store = useStore();
const userInfo = computed(() => {
return store.getters.userInfo
})
const router = useRouter(); const router = useRouter();
const defaultPhoto = ref('https://catmdogf.oss-cn-shanghai.aliyuncs.com/CMDF/front/personal/pet/catdog.png'); const defaultPhoto = ref('https://catmdogf.oss-cn-shanghai.aliyuncs.com/CMDF/front/personal/pet/catdog.png');
@ -113,7 +121,9 @@
const getPetList = async () => { const getPetList = async () => {
petList.value = []; petList.value = [];
try { try {
const res = await getpetList();
const res = await getpetList({
userId: userInfo.value.userId
});
if (res && res.data) { if (res && res.data) {
petList.value = res.data; petList.value = res.data;
showDel.value = false; showDel.value = false;
@ -195,10 +205,10 @@
deleteId.value = ''; deleteId.value = '';
}; };
onMounted(() => {
// getPetTypeList();
getPetList();
});
// onMounted(() => {
// // getPetTypeList();
// getPetList();
// });
onShow(() => { onShow(() => {
getPetList(); getPetList();


Loading…
Cancel
Save