driverSchool/newPages/schoolDetail/index.vue
2025-04-11 18:06:20 +08:00

353 lines
11 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="page flex-col">
<view style="width: 100%;background: #f4f5f6;box-sizing: border-box;padding-top: 88px;">
<headers titles="驾校">
<uni-icons type="left" color="#000000" size="22px"></uni-icons>
</headers>
</view>
<view class="group_4 flex-col">
<image
style="width: 100%; height: 100%;"
referrerpolicy="no-referrer"
:src="imagesUrl + '/' + schoolInfo.photo"
/>
<!-- src="/static/lanhu_jiaxiaoxiangqing/FigmaDDSSlicePNGcd54efcc9a8c89af0ef99c8275464828.png" -->
</view>
<view class="group_5 flex-col">
<text class="text_3">{{ schoolInfo.corpName }}</text>
<text class="text_3_2">地址{{ schoolInfo.address }}</text>
<view class="text-wrapper_1 flex-row justify-between">
<text class="text_4">营业时间</text>
<!-- <text class="text_5">08:00-18:00</text> -->
<text class="text_5">{{ schoolInfo.businessStartTime }} - {{schoolInfo.businessEndTime}}</text>
</view>
<!-- <view class="block_2 flex-row">-->
<!-- <view class="text-group_1 flex-col justify-between">-->
<!-- <text class="text_6">{{ schoolDetails.address }}</text>-->
<!-- <text class="text_7">距离4.0km</text>-->
<!-- </view>-->
<!-- <view class="image-wrapper_2 flex-col">-->
<!-- <image-->
<!-- class="label_2"-->
<!-- referrerpolicy="no-referrer"-->
<!-- src="/static/lanhu_jiaxiaoxiangqing/FigmaDDSSlicePNGb598f2a62156745f7ba827352fd17464.png"-->
<!-- />-->
<!-- </view>-->
<!-- </view>-->
</view>
<!-- <view class="container">
<view class="section-title">
<text class="title">报名类型</text>
</view>
<view class="class-list">
<view class="class-item" v-for="(item, index) in schoolClassList" :key="index">
<image class="class-image" :src="item.photo" />
<view class="class-info">
<text class="class-name">{{ item.tittle }}</text>
<view class="class-details">
<text class="class-type">{{ item.name }}</text>
<text class="class-license">{{ item.type }}</text>
</view>
<view class="class-price">
<text class="price">¥{{ item.price - item.favour }}</text>
<text class="original-price">¥{{ item.price }}</text>
</view>
</view>
</view>
</view>
<view class="view-all" @click="goClassList()">
<text>查看全部班型 ({{ schoolClassList.length }})</text>
<image src="/static/arrow.png" class="arrow-icon" />
</view>
</view> -->
<view class="group_6 flex-col">
<view class="box_4 flex-row justify-between">
<view class="box_5 flex-col"></view>
<text class="text_8">报名类型</text>
</view>
<view v-if="schoolClassList.length > 0">
<view class="box_6 flex-row" v-for="(item, index) in schoolClassList" :key="index" @click="goToDetail(item.id)">
<view class="image-text_1 flex-row">
<image
class="image_2"
referrerpolicy="no-referrer"
:src="imagesUrl + '/' + item.photo"
/>
<view class="text-group_2 flex-col justify-between">
<text class="text_9">{{ item.name }}</text>
<view class="text-wrapper_2 flex-row justify-between">
<text class="text_10">¥{{ item.price }}</text>
</view>
</view>
<view class="text-wrapper_4 flex-col">
<view style="display: flex">
<text class="text_13" style="background-color: rgba(223, 235, 255, 1);padding: 5rpx 15rpx">{{
item.tittle
}}
</text>
<text class="text-wrapper_3 text_13" style="color: black;padding: 5rpx 10rpx">{{ item.type }}</text>
</view>
</view>
</view>
</view>
<view class="box_12 flex-row">
<view class="image-text_2 flex-row justify-between" @click="goClassList()">
<text class="text-group_3">查看全部班型({{ schoolAllClassList.length }})</text>
<image
class="thumbnail_2"
referrerpolicy="no-referrer"
src="/static/lanhu_jiaxiaoxiangqing/FigmaDDSSlicePNGb5045194768d2baa618848ea60e5a9e4.png"
/>
</view>
</view>
</view>
<view v-else>
<u-empty
mode="data"
text="该驾校没有课程..."
>
</u-empty>
</view>
</view>
<view class="group_8 flex-col">
<view class="group_9 flex-row justify-between">
<view class="block_3 flex-col"></view>
<text class="text_24">团队教练</text>
</view>
<view v-if="schoolCoachList.length > 0">
<view class="group_10 flex-row justify-between" v-for="(item, index) in schoolCoachList" :key="index">
<view class="image-text_3 flex-row justify-between">
<image
class="label_3"
referrerpolicy="no-referrer"
:src="imagesUrl + '/' + item.image"
/>
<view class="text-group_4 flex-col justify-between">
<text class="text_25">{{ item.name }}</text>
<text class="text_27">教龄&nbsp;{{ item.seniority }}</text>
</view>
</view>
</view>
</view>
<view v-else>
<u-empty
mode="list"
text="该驾校没有团队教练..."
>
</u-empty>
</view>
</view>
</view>
</template>
<script>
import request from "@/utils/request";
import config from "@/config.js"
import headers from "@/components/header/headers.vue";
export default {
components: {headers},
data() {
return {
imagesUrl: config.imagesUrl,
constants: {},
schoolId: undefined,
tenantId: undefined,
schoolName: undefined,
schoolDetails: {},
schoolInfo: [],
schoolClassList: [],
schoolAllClassList: [],
schoolCoachList: [],
};
},
async onShow() {
// const res = await this.getLocation();
// console.log('位置信息',res)
},
onLoad(options) {
if (options.id) {
this.schoolId = options.id;
this.tenantId = options.tenantId;
this.schoolName = options.schoolName;
// this.getSchoolDetails();
this.getSchoolInfo()
this.getSchoolClass();
this.getSchoolAllClass()
this.getSchoolCoach()
}
},
methods: {
handleBack() {
uni.navigateBack({
delta: 1
});
},
getSchoolDetails() {
request({
url: '/userClient/base/companySmallProgram/noTenantIdGet',
method: 'GET',
params: {
id: this.schoolId
},
tenantIdFlag: false
}).then(res => {
this.schoolDetails = res.data;
this.tenantId = res.data.tenantId
}).catch(err => {
console.error('获取驾校详情失败', err);
});
},
getSchoolInfo(){
request({
url:'/userClient/base/companySmallProgram/getCompanyByTenantId',
method: 'GET',
params: {
tenantId: this.tenantId,
systemCode: 'jiaxiao',
}
}).then(res => {
this.schoolInfo = res.data
})
},
getSchoolClass() {
request({
url: '/app-api/dl-drive-school-course-small/noTenantIdPage',
method: 'GET',
params: {
pageNo: 1,
pageSize: 3,
tenantId: this.tenantId,
},
tenantIdFlag: false
}).then(res => {
this.schoolClassList = res.data.records;
this.total = res.data.total;
})
},
//获取当前位置
getLocation() {
let location = {
lat: 0,
lng: 0,
}
return new Promise((reserve, reject) => {//因为获取位置是异步接口所以需要使用promise
uni.getLocation({
success(res) {
console.log('成功')
location.lat = res.latitude
location.lng = res.longitude,
reserve(location);
},
fail(err) {
console.log('失败', err)
reject(location);//获取失败则返回经纬坐标为0
}
})
})
},
// 计算两点间距离(单位:米)
calculateDistance(loc1, loc2) {
const {latitude: lat1, longitude: lng1} = loc1;
const {latitude: lat2, longitude: lng2} = loc2;
const rad = (d) => d * Math.PI / 180.0;
const radLat1 = rad(lat1);
const radLat2 = rad(lat2);
const a = radLat1 - radLat2;
const b = rad(lng1) - rad(lng2);
const distance = 2 * Math.asin(Math.sqrt(
Math.pow(Math.sin(a / 2), 2) +
Math.cos(radLat1) *
Math.cos(radLat2) *
Math.pow(Math.sin(b / 2), 2)
));
const EARTH_RADIUS = 6378.137; // 地球半径(千米)
// 修改计算结果(原米制 → 公里制)
const result = (distance * EARTH_RADIUS).toFixed(2); // 直接得到公里保留2位小数
console.log('距离:', result + 'km');
return result;
},
wxGeocoder(address) {
return new Promise((resolve, reject) => {
// 需要先通过chooseLocation获取坐标用户交互触发
uni.chooseLocation({
success: (res) => {
resolve({
latitude: res.latitude,
longitude: res.longitude
});
},
fail: (err) => reject(err)
});
});
},
getSchoolAllClass() {
request({
url: '/app-api/dl-drive-school-course-small/list',
method: 'GET',
params: {
tenantId: this.tenantId,
},
tenantIdFlag: false
}).then(res => {
this.schoolAllClassList = res.data;
this.total = res.data.total;
})
},
getSchoolCoach() {
request({
url: '/app-api/dl-drive-school-coach-small/page',
method: 'GET',
params: {
tenantId: this.tenantId,
},
tenantIdFlag: false
}).then(res => {
// 对数据进行排序
const sortedList = res.data.records.sort((a, b) => b.seniority - a.seniority);
// 取排序后的前三条数据
this.schoolCoachList = sortedList.slice(0, 3);
this.total = res.data.total;
})
},
goClassList() {
uni.navigateTo({
url: '/newPages/courseList/index?tenantId=' + this.tenantId,
});
},
// 跳转到详情页
goToDetail(courseId) {
uni.navigateTo({
url: `/newPages/courseDetail/index?courseId=${courseId}&tenantId=${this.tenantId}`,
});
},
}
};
</script>
<style lang='scss'>
@import '../common/common.scss';
@import './assets/style/index.rpx.scss';
</style>