139 lines
3.8 KiB
Vue
139 lines
3.8 KiB
Vue
<route lang="json5" type="page">
|
|
{
|
|
style: {
|
|
navigationBarTitleText: '专家',
|
|
},
|
|
needLogin: true,
|
|
}
|
|
</route>
|
|
<template>
|
|
<view class="h-screen flex flex-col bg-[#F9F9F9]">
|
|
<view class="flex-1 m-[32rpx] rounded-t-[32rpx] gap-[30rpx] flex flex-col">
|
|
<view
|
|
class="flex items-start gap-[24rpx] pl-[24rpx] pr-[38rpx] pt-[24rpx] pb-[12rpx] bg-[#fff]"
|
|
v-for="(item, index) in list"
|
|
:key="item.id"
|
|
>
|
|
<view class="flex flex-col gap-[24rpx]">
|
|
<image :src="item.pic" mode="aspectFit" class="w-[112rpx] h-[112rpx] rounded-full" />
|
|
<button
|
|
:class="`appointment-btn ${item.isAppointment ? 'bg-[#1580ff]!' : ''}`"
|
|
@click="handleAppointment(item, index)"
|
|
>
|
|
<text v-if="!item.isAppointment">预约</text>
|
|
<view class="i-carbon-checkmark text-[#fff] font-semibold" v-else></view>
|
|
</button>
|
|
</view>
|
|
|
|
<view class="flex flex-col">
|
|
<text class="text-[36rpx] font-semibold text-[#333]">{{ item.name }}</text>
|
|
|
|
<view class="flex gap-[8rpx] mt-[14rpx]">
|
|
<view
|
|
v-for="(major, majorIndex) in item.majorTags.slice(0, 3)"
|
|
:key="majorIndex"
|
|
class="bg-[#f8f8f8] rounded-[4rpx] px-[16rpx] py-[4rpx] text-[#999] text-[20rpx]"
|
|
>
|
|
{{ major }}
|
|
</view>
|
|
</view>
|
|
|
|
<view class="text-[22rpx] text-[#999] mt-[16rpx]">{{ item.summary }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<TabBar :current-page="1"></TabBar>
|
|
<FabButton :initial-x="0" :initial-y="100" />
|
|
</view>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import TabBar from '@/components/bar/TabBar.vue'
|
|
import FabButton from '@/components/fab/FabButton.vue'
|
|
import {
|
|
addSpecial,
|
|
deleteMyAppointment,
|
|
getBusSpecialListGroup,
|
|
getMySpecialList,
|
|
} from '@/service/index/api'
|
|
import { useUserStore } from '@/store/user'
|
|
|
|
const list = ref<any[]>([])
|
|
const userStore = useUserStore()
|
|
const show = ref(true)
|
|
|
|
onLoad(() => {
|
|
getMySpecialList({
|
|
openId: userStore.userInfo?.estimatedAchievement.wxId.toString(),
|
|
}).then((_res) => {
|
|
if (_res.code === 200) {
|
|
let _mySpecialList = _res.result as any[]
|
|
getBusSpecialListGroup().then((res) => {
|
|
if (res.code === 200) {
|
|
list.value = res.result as any[]
|
|
list.value = list.value.map((item) => {
|
|
let _mySpecial = _mySpecialList.find((_item) => _item.sId === item.id)
|
|
return {
|
|
...item,
|
|
isAppointment: !!_mySpecial,
|
|
appointId: _mySpecial?.id,
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
})
|
|
})
|
|
|
|
const handleAppointment = (
|
|
item: { id: number; isAppointment: boolean; appointId: number },
|
|
index: number,
|
|
) => {
|
|
if (item.isAppointment) {
|
|
deleteMyAppointment({ id: item.appointId }).then((res) => {
|
|
if (res.code === 200) {
|
|
list.value[index].isAppointment = !item.isAppointment
|
|
}
|
|
})
|
|
} else {
|
|
addSpecial({
|
|
sId: item.id,
|
|
openId: userStore.userInfo?.estimatedAchievement.wxId.toString(),
|
|
appointmentTime: '2025-07-31',
|
|
isDelete: item.isAppointment,
|
|
}).then((res) => {
|
|
if (res.code === 200) {
|
|
list.value[index].isAppointment = !item.isAppointment
|
|
uni.showToast({
|
|
title: item.isAppointment ? '预约成功' : '取消预约成功',
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
title: res.message,
|
|
icon: 'none',
|
|
})
|
|
}
|
|
})
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.appointment-btn {
|
|
background-color: rgba(255, 255, 255, 0.1);
|
|
border-radius: 70rpx;
|
|
border: 2rpx solid #1580ff;
|
|
line-height: 1;
|
|
font-size: 24rpx;
|
|
color: #1580ff;
|
|
width: 96rpx;
|
|
height: 44rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
</style>
|