|
|
@@ -6,12 +6,12 @@
|
|
|
<up-grid :border="false" col="3">
|
|
|
<up-grid-item v-for="(item, index) in serveiceList" :key="index" @click="handleGridClick(item)">
|
|
|
<view class="grid-box">
|
|
|
- <view class="grid-icon">
|
|
|
+ <view class="grid-image">
|
|
|
<image :src="item.businessIcon" class="service-img" mode="aspectFit" />
|
|
|
</view>
|
|
|
<view class="grid-content">
|
|
|
<text class="grid-text">{{ item.businessName }}</text>
|
|
|
- <text>{{ item.businessDescribe }}</text>
|
|
|
+ <text class="grid-text-bone">{{ item.businessDescribe }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</up-grid-item>
|
|
|
@@ -34,20 +34,20 @@
|
|
|
|
|
|
<script setup>
|
|
|
import {
|
|
|
- ref,
|
|
|
- onMounted,
|
|
|
- watch,
|
|
|
- computed,
|
|
|
- provide
|
|
|
+ ref,
|
|
|
+ onMounted,
|
|
|
+ watch,
|
|
|
+ computed,
|
|
|
+ provide
|
|
|
} from 'vue';
|
|
|
import {
|
|
|
- workDate,
|
|
|
- getDataTime,
|
|
|
- getVolunteerInfo
|
|
|
+ workDate,
|
|
|
+ getDataTime,
|
|
|
+ getVolunteerInfo
|
|
|
} from '@/api/volunteer.js'
|
|
|
import {
|
|
|
- volunteerSeachgetTreeList,
|
|
|
- volunteerDataList
|
|
|
+ volunteerSeachgetTreeList,
|
|
|
+ volunteerDataList
|
|
|
} from "@/api/volunteerDetailsApi/details.js"
|
|
|
import { getTreeList } from '@/api/volunteer'
|
|
|
import Calendar from '../../components/uni-calendar/components/uni-calendar/uni-calendar.vue'
|
|
|
@@ -62,9 +62,9 @@ const userOrWorker = uni.getStorageSync('storage_data').vuex_userOrWorker //读
|
|
|
|
|
|
const calendar = ref(null)
|
|
|
const info = ref({
|
|
|
- lunar: true,
|
|
|
- range: true,
|
|
|
- insert: false,
|
|
|
+ lunar: true,
|
|
|
+ range: true,
|
|
|
+ insert: false,
|
|
|
})
|
|
|
const selected = ref([])
|
|
|
|
|
|
@@ -74,213 +74,201 @@ const serveiceList = ref([]);
|
|
|
|
|
|
// 宫格点击事件
|
|
|
const handleGridClick = async (service) => {
|
|
|
- // 用户
|
|
|
- if (userType == 1) {
|
|
|
-
|
|
|
- // 动态获取 parentId
|
|
|
- const params = {
|
|
|
- parentId: service.id,
|
|
|
- }
|
|
|
- const res = await volunteerSeachgetTreeList(params)
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pages_home/pages/client/details?dataList=${encodeURIComponent(JSON.stringify(res.data))}&serviceCategory=${service.id}`
|
|
|
- });
|
|
|
- }
|
|
|
- // 志愿者
|
|
|
- if (userType == 2) {
|
|
|
- const res = await getVolunteerInfo({
|
|
|
- serviceCategory: service.id
|
|
|
- });
|
|
|
- if (res.code === 200 && res.data) {
|
|
|
- //已有注册，跳转详情页面
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pages_home/pages/details/index?data=${encodeURIComponent(JSON.stringify({...service,key: service.id}))}`
|
|
|
- })
|
|
|
- return
|
|
|
- }
|
|
|
-
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pages_home/pages/register/index?data=${encodeURIComponent(JSON.stringify({...service,key: service.id}))}`
|
|
|
- })
|
|
|
-
|
|
|
- }
|
|
|
+ // 用户
|
|
|
+ if (userType == 1) {
|
|
|
+
|
|
|
+ // 动态获取 parentId
|
|
|
+ const params = {
|
|
|
+ parentId: service.id,
|
|
|
+ }
|
|
|
+ const res = await volunteerSeachgetTreeList(params)
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages_home/pages/client/details?dataList=${encodeURIComponent(JSON.stringify(res.data))}&serviceCategory=${service.id}`
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // 志愿者
|
|
|
+ if (userType == 2) {
|
|
|
+ const res = await getVolunteerInfo({
|
|
|
+ serviceCategory: service.id
|
|
|
+ });
|
|
|
+ if (res.code === 200 && res.data) {
|
|
|
+ //已有注册，跳转详情页面
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages_home/pages/details/index?data=${encodeURIComponent(JSON.stringify({ ...service, key: service.id }))}`
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages_home/pages/register/index?data=${encodeURIComponent(JSON.stringify({ ...service, key: service.id }))}`
|
|
|
+ })
|
|
|
+
|
|
|
+ }
|
|
|
};
|
|
|
|
|
|
const change = (e) => {
|
|
|
- console.log('change', e);
|
|
|
- let dates = [{
|
|
|
- date: e.fulldate,
|
|
|
- info: `${e.time.startTime}~${e.time.endTime}`,
|
|
|
- time: e.time
|
|
|
- }]
|
|
|
- if (e.range.before && e.range.after) {
|
|
|
- dates = e.range.data.map(item => {
|
|
|
- return {
|
|
|
- date: item,
|
|
|
- info: `${e.time.startTime}~${e.time.endTime}`,
|
|
|
- time: e.time
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- selected.value = [...selected.value, ...dates]
|
|
|
+ console.log('change', e);
|
|
|
+ let dates = [{
|
|
|
+ date: e.fulldate,
|
|
|
+ info: `${e.time.startTime}~${e.time.endTime}`,
|
|
|
+ time: e.time
|
|
|
+ }]
|
|
|
+ if (e.range.before && e.range.after) {
|
|
|
+ dates = e.range.data.map(item => {
|
|
|
+ return {
|
|
|
+ date: item,
|
|
|
+ info: `${e.time.startTime}~${e.time.endTime}`,
|
|
|
+ time: e.time
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ selected.value = [...selected.value, ...dates]
|
|
|
}
|
|
|
|
|
|
const onDelete = (e) => {
|
|
|
- selected.value = selected.value.filter(item => {
|
|
|
- console.log('item.fulldate !== e.date', item.date, e.fulldate);
|
|
|
+ selected.value = selected.value.filter(item => {
|
|
|
+ console.log('item.fulldate !== e.date', item.date, e.fulldate);
|
|
|
|
|
|
- return item.date !== e.fulldate
|
|
|
- })
|
|
|
- console.log(e, selected.value);
|
|
|
+ return item.date !== e.fulldate
|
|
|
+ })
|
|
|
+ console.log(e, selected.value);
|
|
|
}
|
|
|
|
|
|
|
|
|
//排班时间去重处理
|
|
|
const handleDates = computed(() => {
|
|
|
- const parmas = selected.value.map(item => {
|
|
|
- return {
|
|
|
- workDate: item.date,
|
|
|
- workStartTime: item.time.startTime,
|
|
|
- workEndTime: item.time.endTime
|
|
|
- }
|
|
|
- })
|
|
|
- return parmas.reduce((acc, current) => {
|
|
|
- const existing = acc.find(item => item.workDate === current.workDate);
|
|
|
- if (existing) {
|
|
|
- Object.assign(existing, current);
|
|
|
- } else {
|
|
|
- acc.push(current);
|
|
|
- }
|
|
|
- return acc;
|
|
|
- }, []);
|
|
|
+ const parmas = selected.value.map(item => {
|
|
|
+ return {
|
|
|
+ workDate: item.date,
|
|
|
+ workStartTime: item.time.startTime,
|
|
|
+ workEndTime: item.time.endTime
|
|
|
+ }
|
|
|
+ })
|
|
|
+ return parmas.reduce((acc, current) => {
|
|
|
+ const existing = acc.find(item => item.workDate === current.workDate);
|
|
|
+ if (existing) {
|
|
|
+ Object.assign(existing, current);
|
|
|
+ } else {
|
|
|
+ acc.push(current);
|
|
|
+ }
|
|
|
+ return acc;
|
|
|
+ }, []);
|
|
|
});
|
|
|
const confirm = (e) => {
|
|
|
- const parmas = handleDates.value;
|
|
|
- console.log('确定', parmas);
|
|
|
- workDate(parmas).then(res => {
|
|
|
- if (res.code == 200) {
|
|
|
- uni.showToast({
|
|
|
- title: '修改成功',
|
|
|
- icon: 'success',
|
|
|
- success: () => {
|
|
|
- setTimeout(() => {
|
|
|
- close();
|
|
|
- }, 1000)
|
|
|
- }
|
|
|
- })
|
|
|
-
|
|
|
- return;
|
|
|
- }
|
|
|
- uni.showToast({
|
|
|
- title: res.msg,
|
|
|
- icon: 'none'
|
|
|
- })
|
|
|
- })
|
|
|
+ const parmas = handleDates.value;
|
|
|
+ console.log('确定', parmas);
|
|
|
+ workDate(parmas).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '修改成功',
|
|
|
+ icon: 'success',
|
|
|
+ success: () => {
|
|
|
+ setTimeout(() => {
|
|
|
+ close();
|
|
|
+ }, 1000)
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ uni.showToast({
|
|
|
+ title: res.msg,
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ })
|
|
|
};
|
|
|
const close = () => {
|
|
|
- calendar.value.close();
|
|
|
+ calendar.value.close();
|
|
|
}
|
|
|
|
|
|
const init = () => {
|
|
|
- getTreeList({ parentId: '0' }).then(res => {
|
|
|
- console.log("TCL: init -> res", res)
|
|
|
- serveiceList.value = res.data;
|
|
|
- })
|
|
|
+ getTreeList({ parentId: '0' }).then(res => {
|
|
|
+ console.log("TCL: init -> res", res)
|
|
|
+ serveiceList.value = res.data;
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
const DataInit = () => {
|
|
|
- getDataTime().then(res => {
|
|
|
- console.log('res', res);
|
|
|
- if (res.code === 200) {
|
|
|
- selected.value = res.data.map(item => {
|
|
|
- return {
|
|
|
- date: item.workDate,
|
|
|
- info: `${item.workStartTime}~${item.workEndTime}`,
|
|
|
- time: {
|
|
|
- startTime: item.workStartTime,
|
|
|
- endTime: item.workEndTime
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- calendar.value.open();
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- })
|
|
|
+ getDataTime().then(res => {
|
|
|
+ console.log('res', res);
|
|
|
+ if (res.code === 200) {
|
|
|
+ selected.value = res.data.map(item => {
|
|
|
+ return {
|
|
|
+ date: item.workDate,
|
|
|
+ info: `${item.workStartTime}~${item.workEndTime}`,
|
|
|
+ time: {
|
|
|
+ startTime: item.workStartTime,
|
|
|
+ endTime: item.workEndTime
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ calendar.value.open();
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
onMounted(() => {
|
|
|
- init();
|
|
|
+ init();
|
|
|
});
|
|
|
</script>
|
|
|
|
|
|
-<style scoped>
|
|
|
-.Wrapper-grid {
|
|
|
- margin-top: 36rpx;
|
|
|
-}
|
|
|
-
|
|
|
-/* 图标样式 */
|
|
|
-.service-img {}
|
|
|
-
|
|
|
-/* 文本样式 */
|
|
|
-.grid-text {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #333;
|
|
|
- text-align: center;
|
|
|
- /* margin-top: 18rpx; */
|
|
|
-}
|
|
|
-
|
|
|
+<style scoped lang="scss">
|
|
|
.grid-box {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- /* flex-direction: column; */
|
|
|
- margin-bottom: 12rpx;
|
|
|
-}
|
|
|
-
|
|
|
-.grid-icon {
|
|
|
- width: 100rpx;
|
|
|
- height: 100rpx;
|
|
|
- opacity: 1;
|
|
|
- border-radius: 12rpx;
|
|
|
- /* background: rgba(251, 229, 225, 1); */
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
+ width: 226rpx;
|
|
|
+ height: 116rpx;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-start;
|
|
|
+ margin-right: 5rpx;
|
|
|
+ margin-left: 5rpx;
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 14rpx;
|
|
|
+ // background: red;
|
|
|
+ background: linear-gradient(180deg, #FFF9F3 0%, #FFFFFF 100%);
|
|
|
+ box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.04);
|
|
|
+ margin-top: 10rpx;
|
|
|
+
|
|
|
+ .grid-image {
|
|
|
+ width: 64rpx;
|
|
|
+ height: 68rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
-.grid-content{
|
|
|
+.grid-content {
|
|
|
display: flex;
|
|
|
- justify-content: center;
|
|
|
flex-direction: column;
|
|
|
-}
|
|
|
-
|
|
|
-.service-img {
|
|
|
- width: 78rpx;
|
|
|
- height: 78rpx;
|
|
|
-}
|
|
|
-
|
|
|
-.swiper {
|
|
|
- height: 340rpx;
|
|
|
-}
|
|
|
-
|
|
|
-.grid-text {
|
|
|
- font-size: 14px;
|
|
|
- color: #909399;
|
|
|
- /* padding: 10rpx 0 0 0rpx; */
|
|
|
-}
|
|
|
-
|
|
|
-.client-title {
|
|
|
- padding: 0 32rpx;
|
|
|
-}
|
|
|
-
|
|
|
-.paiban-sty {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- /* justify-content: center; */
|
|
|
- margin: 20rpx 0;
|
|
|
- padding: 0 20rpx;
|
|
|
+ align-items: flex-start;
|
|
|
+ justify-content: center;
|
|
|
+ .grid-text {
|
|
|
+ width: 112rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: 500;
|
|
|
+ line-height: 36rpx;
|
|
|
+ letter-spacing: normal;
|
|
|
+ color: #313131;
|
|
|
+ }
|
|
|
+
|
|
|
+ .grid-text-bone {
|
|
|
+ width: 130rpx;
|
|
|
+ height: 28rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-size: 22rpx;
|
|
|
+ font-weight: normal;
|
|
|
+ line-height: 28rpx;
|
|
|
+ letter-spacing: -0.02em;
|
|
|
+ color: #818181;
|
|
|
+ margin-left: 6rpx;
|
|
|
+ margin-top: 10rpx;
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
jiayubo
