feat: 找大学其他页面编写
parent
112276f47c
commit
3e768c6477
|
|
@ -25,12 +25,3 @@ export const useWxInfo = ({ code, openId }) => {
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
export const universityBaseInfo = ref()
|
|
||||||
export const useUniversityInfo = (provinceCode: number) => {
|
|
||||||
getUniversityInfo({ Id: provinceCode }).then((res) => {
|
|
||||||
if (res.code === 200) {
|
|
||||||
universityBaseInfo.value = res.result
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
|
||||||
|
|
@ -109,7 +109,10 @@ const getUserInfo = async (code: string) => {
|
||||||
|
|
||||||
// 根据微信的信息获取用户信息
|
// 根据微信的信息获取用户信息
|
||||||
getWxUserInfo().then((resp) => {
|
getWxUserInfo().then((resp) => {
|
||||||
const infoData = resp.result as unknown as { userExtend: { provinceCode: string } }
|
const infoData = resp.result as unknown as {
|
||||||
|
userExtend: { provinceCode: string }
|
||||||
|
zyBatches: any[]
|
||||||
|
}
|
||||||
userStore.setEstimatedAchievement(infoData.userExtend)
|
userStore.setEstimatedAchievement(infoData.userExtend)
|
||||||
if (resp.code === 200) {
|
if (resp.code === 200) {
|
||||||
// 根据用户信息中的城市设置对应城市的分数等信息
|
// 根据用户信息中的城市设置对应城市的分数等信息
|
||||||
|
|
|
||||||
|
|
@ -1,44 +1,65 @@
|
||||||
<template>
|
<template>
|
||||||
<view class="flex flex-col p-[32rpx] bg-[#fff] mt-16rpx">
|
<view class="flex flex-col p-[32rpx] bg-[#fff] mt-16rpx">
|
||||||
<text class="text-[32rpx] font-semibold text-[#333]">特色专业·23</text>
|
<text class="text-[32rpx] font-semibold text-[#333]">院系设置</text>
|
||||||
|
|
||||||
<wd-table :data="tableData">
|
<WXXTable :columns="columns" :tableData="tableData.slice(0, 4)" class="my-[24rpx]"></WXXTable>
|
||||||
<wd-table-col prop="college" label="学院" width="30%" align="center"></wd-table-col>
|
|
||||||
<wd-table-col prop="major" label="所含专业" width="70%" align="center"></wd-table-col>
|
|
||||||
</wd-table>
|
|
||||||
<wd-button
|
<wd-button
|
||||||
block
|
block
|
||||||
custom-class="mt-[24rpx] rounded-[8rpx]! bg-[#f8f8f8]! w-full text-[#303030]!"
|
custom-class="mt-[24rpx] rounded-[8rpx]! bg-[#f8f8f8]! w-full text-[#303030]!"
|
||||||
@click="show = true"
|
@click="handleMore"
|
||||||
>
|
>
|
||||||
查看全部
|
查看全部
|
||||||
<wd-icon name="arrow-right"></wd-icon>
|
<wd-icon name="arrow-right"></wd-icon>
|
||||||
</wd-button>
|
</wd-button>
|
||||||
|
</view>
|
||||||
<MessageBox v-model:show="show" title="院系设置">
|
<MessageBox v-model:show="show" title="院系设置">
|
||||||
<template>
|
<template>
|
||||||
<view class="max-h-600rpx mb-[32rpx]">
|
<scroll-view class="max-h-600rpx mb-[32rpx] overflow-y-auto" :scroll-y="true">
|
||||||
<wd-table :data="tableData.concat(tableData)" height="600rpx">
|
<WXXTable :columns="columns" :tableData="tableData"></WXXTable>
|
||||||
<wd-table-col prop="college" label="学院" width="30%" align="center"></wd-table-col>
|
</scroll-view>
|
||||||
<wd-table-col prop="major" label="所含专业" width="70%" align="center"></wd-table-col>
|
|
||||||
</wd-table>
|
|
||||||
</view>
|
|
||||||
</template>
|
</template>
|
||||||
</MessageBox>
|
</MessageBox>
|
||||||
</view>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import MessageBox from './MessageBox.vue'
|
import MessageBox from './MessageBox.vue'
|
||||||
|
import WXXTable from '@/pages-sub/home/components/Table.vue'
|
||||||
|
import { getUniversityListByProvince } from '@/service/index/api'
|
||||||
|
|
||||||
const tableData = [
|
const props = defineProps({
|
||||||
{ college: '计算机学院', major: '计算机科学与技术' },
|
id: {
|
||||||
{ college: '计算机学院', major: '软件工程' },
|
type: Number,
|
||||||
{ college: '计算机学院', major: '网络工程' },
|
default: 0,
|
||||||
{ college: '计算机学院', major: '电子信息工程' },
|
},
|
||||||
{ college: '计算机学院', major: '物联网工程' },
|
})
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.id,
|
||||||
|
(newVal) => {
|
||||||
|
getUniversityListByProvince({ id: newVal }).then((resp) => {
|
||||||
|
if (resp.code === 200) {
|
||||||
|
let _res = (originTableData = resp.result as { name: string; item: { name: string }[] }[])
|
||||||
|
_res.forEach((college) => {
|
||||||
|
let _college = { name: college.name, major: '' }
|
||||||
|
_college.major = college.item.map((item) => item.name).join(',')
|
||||||
|
tableData.value.push(_college)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
)
|
||||||
|
|
||||||
|
const columns = [
|
||||||
|
{ name: '学院', key: 'name', width: '30%' },
|
||||||
|
{ name: '所含专业', key: 'major', width: '70%' },
|
||||||
]
|
]
|
||||||
|
const tableData = ref([])
|
||||||
const show = ref(false)
|
const show = ref(false)
|
||||||
|
let originTableData = []
|
||||||
|
|
||||||
|
const handleMore = () => {
|
||||||
|
show.value = true
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped></style>
|
<style lang="scss" scoped></style>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,53 @@
|
||||||
|
<template>
|
||||||
|
<scroll-view class="pb-safe" :scroll-y="false">
|
||||||
|
<view class="mx-[32rpx] border-item" v-for="item in recruits" :key="item.id">
|
||||||
|
<view class="text-[#303030] text-[28rpx] font-normal py-[32rpx]" @click="navigateTo(item.id)">
|
||||||
|
{{ item.title }}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { getRecruits } from '@/service/index/api'
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
id: {
|
||||||
|
type: Number,
|
||||||
|
default: 0,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
type UniversityEnrollmentRegulation = {
|
||||||
|
base_college_id: number
|
||||||
|
college_name: string
|
||||||
|
id: number
|
||||||
|
title: string
|
||||||
|
year: string
|
||||||
|
}
|
||||||
|
const recruits = ref<UniversityEnrollmentRegulation[]>([])
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.id,
|
||||||
|
(newVal) => {
|
||||||
|
getRecruits(newVal).then((resp) => {
|
||||||
|
if (resp.code === 200) {
|
||||||
|
const result = resp.result as UniversityEnrollmentRegulation[]
|
||||||
|
recruits.value = result
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
)
|
||||||
|
|
||||||
|
const navigateTo = (id: number) => {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages-sub/home/college/enrollmentIntroDetail?id=${id}`,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.border-item {
|
||||||
|
border-bottom: 1px solid #ededed;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,157 @@
|
||||||
|
<template>
|
||||||
|
<view class="flex flex-col pt-[32rpx] px-[32rpx] bg-[#fff]">
|
||||||
|
<view class="flex flex-wrap justify-between items-center">
|
||||||
|
<view
|
||||||
|
@click="handleShow(1)"
|
||||||
|
class="px-[24rpx] py-[8rpx] bg-[#f8f8f8] rounded-[8rpx] flex justify-between items-center text-[24rpx]"
|
||||||
|
>
|
||||||
|
{{ year }}
|
||||||
|
<wd-icon name="arrow-down" size="16rpx" custom-class="ml-[80rpx]"></wd-icon>
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
@click="handleShow(2)"
|
||||||
|
class="px-[24rpx] py-[8rpx] bg-[#f8f8f8] rounded-[8rpx] flex justify-between items-center text-[24rpx]"
|
||||||
|
>
|
||||||
|
{{ batche }}
|
||||||
|
<wd-icon name="arrow-down" size="16rpx" custom-class="ml-[80rpx]"></wd-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<scroll-view class="mt-[38rpx] flex-1 pb-safe">
|
||||||
|
<WXXTable :columns="columns" :tableData="tableData"></WXXTable>
|
||||||
|
</scroll-view>
|
||||||
|
|
||||||
|
<wd-action-sheet v-model="show" title="">
|
||||||
|
<view class="px-[32rpx]">
|
||||||
|
<wd-picker-view :columns="pickList" v-model="pickValue" custom-class="picker-wrapper" />
|
||||||
|
</view>
|
||||||
|
<view class="flex items-center justify-between px-[32rpx]">
|
||||||
|
<view class="cancel-btn" @click="show = false">取消</view>
|
||||||
|
<view class="submit-btn" @click="handleConfirm">确认</view>
|
||||||
|
</view>
|
||||||
|
</wd-action-sheet>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import WXXTable from '@/pages-sub/home/components/Table.vue'
|
||||||
|
import { getPlanProList } from '@/service/index/api'
|
||||||
|
import { useUserStore } from '@/store'
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
id: {
|
||||||
|
type: Number,
|
||||||
|
default: 0,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
const userStore = useUserStore()
|
||||||
|
|
||||||
|
const batchList = []
|
||||||
|
const batche = ref(batchList[0])
|
||||||
|
const batches = ref(batchList)
|
||||||
|
const provinceName = userStore.userInfo.estimatedAchievement.provinceName
|
||||||
|
|
||||||
|
const year = ref('')
|
||||||
|
const yearList = ref([])
|
||||||
|
|
||||||
|
const pickList = ref([])
|
||||||
|
const pickValue = ref('')
|
||||||
|
let pickType = 1
|
||||||
|
|
||||||
|
const tableData = ref([])
|
||||||
|
|
||||||
|
const columns = [
|
||||||
|
{ name: '年份', key: 'years', width: '10%' },
|
||||||
|
{ name: '院校/批次', key: 'batchName', width: '19%' },
|
||||||
|
{ name: '选考要求', key: 'selectsubject', width: '16%' },
|
||||||
|
{ name: '录取数', key: 'plancount', width: '13%' },
|
||||||
|
{ name: '分数', key: 'lowscore', width: '24%' },
|
||||||
|
{ name: '最低位次', key: 'lowscorerank', width: '18%' },
|
||||||
|
]
|
||||||
|
|
||||||
|
let isFirst = true
|
||||||
|
watch(
|
||||||
|
() => props.id,
|
||||||
|
(newVal) => {
|
||||||
|
getPlanProListData(newVal)
|
||||||
|
},
|
||||||
|
)
|
||||||
|
|
||||||
|
const show = ref(false)
|
||||||
|
const handleShow = (type: number) => {
|
||||||
|
show.value = true
|
||||||
|
pickType = type
|
||||||
|
|
||||||
|
if (type === 1) {
|
||||||
|
pickList.value = yearList.value
|
||||||
|
pickValue.value = year.value
|
||||||
|
} else if (type === 2) {
|
||||||
|
pickList.value = batches.value
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const getPlanProListData = async (newVal) => {
|
||||||
|
getPlanProList({
|
||||||
|
years: year.value === '全部年份' ? '' : year.value,
|
||||||
|
_uid: newVal,
|
||||||
|
batchName: batche.value === '全部分类' ? '' : batche.value,
|
||||||
|
locationCode: userStore.userInfo.estimatedAchievement.provinceCode,
|
||||||
|
}).then((resp) => {
|
||||||
|
const _res = resp.result as {
|
||||||
|
batches: { batchName: string }[]
|
||||||
|
yearsDtos: string[]
|
||||||
|
plans: any[]
|
||||||
|
}
|
||||||
|
yearList.value = ['全部年份', ..._res.yearsDtos]
|
||||||
|
batches.value = ['全部分类', ..._res.batches.map((item) => item.batchName)]
|
||||||
|
tableData.value = _res.plans
|
||||||
|
|
||||||
|
if (isFirst) {
|
||||||
|
year.value = yearList.value[0]
|
||||||
|
batche.value = batches.value[0]
|
||||||
|
}
|
||||||
|
isFirst = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleConfirm = () => {
|
||||||
|
if (pickType === 1) {
|
||||||
|
year.value = pickValue.value
|
||||||
|
} else if (pickType === 2) {
|
||||||
|
batche.value = pickValue.value
|
||||||
|
}
|
||||||
|
show.value = false
|
||||||
|
getPlanProListData(props.id)
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.submit-btn {
|
||||||
|
width: 332rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
background: #1580ff;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cancel-btn {
|
||||||
|
width: 332rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
background: #f5f5f5;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #1580ff;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,159 @@
|
||||||
|
<template>
|
||||||
|
<view class="flex flex-col pt-[32rpx] px-[32rpx] bg-[#fff]">
|
||||||
|
<view class="flex flex-wrap justify-between items-center">
|
||||||
|
<text class="font-semibold text-[#303030] text-[32rpx] w-full text-center mb-[20rpx]">
|
||||||
|
招生计划({{ provinceName }})
|
||||||
|
</text>
|
||||||
|
<view
|
||||||
|
@click="handleShow(1)"
|
||||||
|
class="px-[24rpx] py-[8rpx] bg-[#f8f8f8] rounded-[8rpx] flex justify-between items-center text-[24rpx]"
|
||||||
|
>
|
||||||
|
{{ year }}
|
||||||
|
<wd-icon name="arrow-down" size="16rpx" custom-class="ml-[80rpx]"></wd-icon>
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
@click="handleShow(2)"
|
||||||
|
class="px-[24rpx] py-[8rpx] bg-[#f8f8f8] rounded-[8rpx] flex justify-between items-center text-[24rpx]"
|
||||||
|
>
|
||||||
|
{{ batche }}
|
||||||
|
<wd-icon name="arrow-down" size="16rpx" custom-class="ml-[80rpx]"></wd-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<scroll-view class="mt-[38rpx] flex-1 pb-safe">
|
||||||
|
<WXXTable :columns="columns" :tableData="tableData"></WXXTable>
|
||||||
|
</scroll-view>
|
||||||
|
|
||||||
|
<wd-action-sheet v-model="show" title="">
|
||||||
|
<view class="px-[32rpx]">
|
||||||
|
<wd-picker-view :columns="pickList" v-model="pickValue" custom-class="picker-wrapper" />
|
||||||
|
</view>
|
||||||
|
<view class="flex items-center justify-between px-[32rpx]">
|
||||||
|
<view class="cancel-btn" @click="show = false">取消</view>
|
||||||
|
<view class="submit-btn" @click="handleConfirm">确认</view>
|
||||||
|
</view>
|
||||||
|
</wd-action-sheet>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import WXXTable from '@/pages-sub/home/components/Table.vue'
|
||||||
|
import { getPlanProList } from '@/service/index/api'
|
||||||
|
import { useUserStore } from '@/store'
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
id: {
|
||||||
|
type: Number,
|
||||||
|
default: 0,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
const userStore = useUserStore()
|
||||||
|
|
||||||
|
const batchList = []
|
||||||
|
const batche = ref(batchList[0])
|
||||||
|
const batches = ref(batchList)
|
||||||
|
const provinceName = userStore.userInfo.estimatedAchievement.provinceName
|
||||||
|
|
||||||
|
const year = ref('')
|
||||||
|
const yearList = ref([])
|
||||||
|
|
||||||
|
const pickList = ref([])
|
||||||
|
const pickValue = ref('')
|
||||||
|
let pickType = 1
|
||||||
|
|
||||||
|
const tableData = ref([])
|
||||||
|
|
||||||
|
const columns = [
|
||||||
|
{ name: '院校名称', key: 'universityName', width: '25%' },
|
||||||
|
{ name: '招生专业', key: 'major', width: '37%' },
|
||||||
|
{ name: '计划数', key: 'plancount', width: '13%' },
|
||||||
|
{ name: '学制', key: 'academic', width: '10%' },
|
||||||
|
{ name: '学费', key: 'fee', width: '15%' },
|
||||||
|
]
|
||||||
|
|
||||||
|
let isFirst = true
|
||||||
|
watch(
|
||||||
|
() => props.id,
|
||||||
|
(newVal) => {
|
||||||
|
getPlanProListData(newVal)
|
||||||
|
},
|
||||||
|
)
|
||||||
|
|
||||||
|
const show = ref(false)
|
||||||
|
const handleShow = (type: number) => {
|
||||||
|
show.value = true
|
||||||
|
pickType = type
|
||||||
|
|
||||||
|
if (type === 1) {
|
||||||
|
pickList.value = yearList.value
|
||||||
|
pickValue.value = year.value
|
||||||
|
} else if (type === 2) {
|
||||||
|
pickList.value = batches.value
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const getPlanProListData = async (newVal) => {
|
||||||
|
getPlanProList({
|
||||||
|
years: year.value === '全部年份' ? '' : year.value,
|
||||||
|
_uid: newVal,
|
||||||
|
batchName: batche.value === '全部分类' ? '' : batche.value,
|
||||||
|
locationCode: userStore.userInfo.estimatedAchievement.provinceCode,
|
||||||
|
}).then((resp) => {
|
||||||
|
const _res = resp.result as {
|
||||||
|
batches: { batchName: string }[]
|
||||||
|
yearsDtos: string[]
|
||||||
|
plans: any[]
|
||||||
|
}
|
||||||
|
yearList.value = ['全部年份', ..._res.yearsDtos]
|
||||||
|
batches.value = ['全部分类', ..._res.batches.map((item) => item.batchName)]
|
||||||
|
tableData.value = _res.plans
|
||||||
|
|
||||||
|
if (isFirst) {
|
||||||
|
year.value = yearList.value[0]
|
||||||
|
batche.value = batches.value[0]
|
||||||
|
}
|
||||||
|
isFirst = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleConfirm = () => {
|
||||||
|
if (pickType === 1) {
|
||||||
|
year.value = pickValue.value
|
||||||
|
} else if (pickType === 2) {
|
||||||
|
batche.value = pickValue.value
|
||||||
|
}
|
||||||
|
show.value = false
|
||||||
|
getPlanProListData(props.id)
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.submit-btn {
|
||||||
|
width: 332rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
background: #1580ff;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cancel-btn {
|
||||||
|
width: 332rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
background: #f5f5f5;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #1580ff;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -34,6 +34,23 @@
|
||||||
<wd-icon name="arrow-right"></wd-icon>
|
<wd-icon name="arrow-right"></wd-icon>
|
||||||
</wd-button>
|
</wd-button>
|
||||||
</view>
|
</view>
|
||||||
|
<view class="flex flex-col p-[32rpx] bg-[#fff] mt-[16rpx]">
|
||||||
|
<text class="text-[32rpx] font-semibold text-[#333]">
|
||||||
|
特色专业·{{ featureSubjectList.length }}
|
||||||
|
</text>
|
||||||
|
<text class="text-[22rpx] font-normal text-[#636363] my-[24rpx]">
|
||||||
|
{{ featureSubjectList.join(',') }}
|
||||||
|
</text>
|
||||||
|
<wd-button
|
||||||
|
block
|
||||||
|
custom-class="mt-[24rpx] rounded-[8rpx]! bg-[#f8f8f8]! w-full text-[#303030]!"
|
||||||
|
@click="handleFullFun(3)"
|
||||||
|
>
|
||||||
|
查看全部
|
||||||
|
<wd-icon name="arrow-right"></wd-icon>
|
||||||
|
</wd-button>
|
||||||
|
</view>
|
||||||
|
|
||||||
<MessageBox v-model:show="show" :title="title">
|
<MessageBox v-model:show="show" :title="title">
|
||||||
<template>
|
<template>
|
||||||
<view class="text-[22rpx] text-[#636363] max-h-600rpx mb-[32rpx]">{{ innerContent }}</view>
|
<view class="text-[22rpx] text-[#636363] max-h-600rpx mb-[32rpx]">{{ innerContent }}</view>
|
||||||
|
|
@ -47,6 +64,7 @@ import MessageBox from './MessageBox.vue'
|
||||||
|
|
||||||
const subjectIntroduceList = ref([])
|
const subjectIntroduceList = ref([])
|
||||||
const assessmentSubjectList = ref([])
|
const assessmentSubjectList = ref([])
|
||||||
|
const featureSubjectList = ref([])
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
id: {
|
id: {
|
||||||
type: Number,
|
type: Number,
|
||||||
|
|
@ -59,9 +77,14 @@ watch(
|
||||||
async (newVal) => {
|
async (newVal) => {
|
||||||
getSubjectIntroduceList(newVal).then((resp) => {
|
getSubjectIntroduceList(newVal).then((resp) => {
|
||||||
if (resp.code === 200) {
|
if (resp.code === 200) {
|
||||||
const res = resp.result as { double_subject_list: any[]; assessment_subject_list: any[] }
|
const res = resp.result as {
|
||||||
|
double_subject_list: any[]
|
||||||
|
assessment_subject_list: any[]
|
||||||
|
feature_subject_list: any[]
|
||||||
|
}
|
||||||
subjectIntroduceList.value = res.double_subject_list
|
subjectIntroduceList.value = res.double_subject_list
|
||||||
assessmentSubjectList.value = res.assessment_subject_list
|
assessmentSubjectList.value = res.assessment_subject_list
|
||||||
|
featureSubjectList.value = res.feature_subject_list
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
@ -76,9 +99,12 @@ const handleFullFun = (type: number) => {
|
||||||
if (type === 1) {
|
if (type === 1) {
|
||||||
title.value = `双一流学科·${subjectIntroduceList.value.length}`
|
title.value = `双一流学科·${subjectIntroduceList.value.length}`
|
||||||
innerContent.value = subjectIntroduceList.value.join(',')
|
innerContent.value = subjectIntroduceList.value.join(',')
|
||||||
} else {
|
} else if (type === 2) {
|
||||||
title.value = `学科评估·${assessmentSubjectList.value.length}`
|
title.value = `学科评估·${assessmentSubjectList.value.length}`
|
||||||
innerContent.value = assessmentSubjectList.value.join(',')
|
innerContent.value = assessmentSubjectList.value.join(',')
|
||||||
|
} else if (type === 3) {
|
||||||
|
title.value = `特色专业·${featureSubjectList.value.length}`
|
||||||
|
innerContent.value = featureSubjectList.value.join(',')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -1,14 +0,0 @@
|
||||||
<template>
|
|
||||||
<view class="flex flex-col p-[32rpx] bg-[#fff] mt-[16rpx]">
|
|
||||||
<text class="text-[32rpx] font-semibold text-[#333]">特色专业·23</text>
|
|
||||||
<text class="text-[22rpx] font-normal text-[#636363] my-[24rpx]">
|
|
||||||
法学,政治学,马克思主义理论,数学,法学,政治学,马克思主义理论,数学,法学,政治学,马克思主义理论,数学,法学,政治学,马克思主义理论,数学,材料科学与工程学,政治学,马克思主义理论,数学,法学,政治学,马克思主义理
|
|
||||||
</text>
|
|
||||||
<wd-button block custom-class="mt-[24rpx] rounded-[8rpx]! bg-[#f8f8f8]! w-full text-[#303030]!">
|
|
||||||
查看全部
|
|
||||||
<wd-icon name="arrow-right"></wd-icon>
|
|
||||||
</wd-button>
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts" setup></script>
|
|
||||||
|
|
@ -0,0 +1,157 @@
|
||||||
|
<template>
|
||||||
|
<view class="flex flex-col pt-[32rpx] px-[32rpx] bg-[#fff]">
|
||||||
|
<view class="flex flex-wrap justify-between items-center">
|
||||||
|
<view
|
||||||
|
@click="handleShow(1)"
|
||||||
|
class="px-[24rpx] py-[8rpx] bg-[#f8f8f8] rounded-[8rpx] flex justify-between items-center text-[24rpx]"
|
||||||
|
>
|
||||||
|
{{ year }}
|
||||||
|
<wd-icon name="arrow-down" size="16rpx" custom-class="ml-[80rpx]"></wd-icon>
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
@click="handleShow(2)"
|
||||||
|
class="px-[24rpx] py-[8rpx] bg-[#f8f8f8] rounded-[8rpx] flex justify-between items-center text-[24rpx]"
|
||||||
|
>
|
||||||
|
{{ batche }}
|
||||||
|
<wd-icon name="arrow-down" size="16rpx" custom-class="ml-[80rpx]"></wd-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<scroll-view class="mt-[38rpx] flex-1 pb-safe">
|
||||||
|
<WXXTable :columns="columns" :tableData="tableData"></WXXTable>
|
||||||
|
</scroll-view>
|
||||||
|
|
||||||
|
<wd-action-sheet v-model="show" title="">
|
||||||
|
<view class="px-[32rpx]">
|
||||||
|
<wd-picker-view :columns="pickList" v-model="pickValue" custom-class="picker-wrapper" />
|
||||||
|
</view>
|
||||||
|
<view class="flex items-center justify-between px-[32rpx]">
|
||||||
|
<view class="cancel-btn" @click="show = false">取消</view>
|
||||||
|
<view class="submit-btn" @click="handleConfirm">确认</view>
|
||||||
|
</view>
|
||||||
|
</wd-action-sheet>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import WXXTable from '@/pages-sub/home/components/Table.vue'
|
||||||
|
import { getPlanProList } from '@/service/index/api'
|
||||||
|
import { useUserStore } from '@/store'
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
id: {
|
||||||
|
type: Number,
|
||||||
|
default: 0,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
const userStore = useUserStore()
|
||||||
|
|
||||||
|
const batchList = []
|
||||||
|
const batche = ref(batchList[0])
|
||||||
|
const batches = ref(batchList)
|
||||||
|
const provinceName = userStore.userInfo.estimatedAchievement.provinceName
|
||||||
|
|
||||||
|
const year = ref('')
|
||||||
|
const yearList = ref([])
|
||||||
|
|
||||||
|
const pickList = ref([])
|
||||||
|
const pickValue = ref('')
|
||||||
|
let pickType = 1
|
||||||
|
|
||||||
|
const tableData = ref([])
|
||||||
|
|
||||||
|
const columns = [
|
||||||
|
{ name: '年份', key: 'years', width: '10%' },
|
||||||
|
{ name: '院校/批次', key: 'batchName', width: '19%' },
|
||||||
|
{ name: '选考要求', key: 'selectsubject', width: '16%' },
|
||||||
|
{ name: '录取数', key: 'plancount', width: '13%' },
|
||||||
|
{ name: '分数', key: 'lowscore', width: '24%' },
|
||||||
|
{ name: '最低位次', key: 'lowscorerank', width: '18%' },
|
||||||
|
]
|
||||||
|
|
||||||
|
let isFirst = true
|
||||||
|
watch(
|
||||||
|
() => props.id,
|
||||||
|
(newVal) => {
|
||||||
|
getPlanProListData(newVal)
|
||||||
|
},
|
||||||
|
)
|
||||||
|
|
||||||
|
const show = ref(false)
|
||||||
|
const handleShow = (type: number) => {
|
||||||
|
show.value = true
|
||||||
|
pickType = type
|
||||||
|
|
||||||
|
if (type === 1) {
|
||||||
|
pickList.value = yearList.value
|
||||||
|
pickValue.value = year.value
|
||||||
|
} else if (type === 2) {
|
||||||
|
pickList.value = batches.value
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const getPlanProListData = async (newVal) => {
|
||||||
|
getPlanProList({
|
||||||
|
years: year.value === '全部年份' ? '' : year.value,
|
||||||
|
_uid: newVal,
|
||||||
|
batchName: batche.value === '全部分类' ? '' : batche.value,
|
||||||
|
locationCode: userStore.userInfo.estimatedAchievement.provinceCode,
|
||||||
|
}).then((resp) => {
|
||||||
|
const _res = resp.result as {
|
||||||
|
batches: { batchName: string }[]
|
||||||
|
yearsDtos: string[]
|
||||||
|
plans: any[]
|
||||||
|
}
|
||||||
|
yearList.value = ['全部年份', ..._res.yearsDtos]
|
||||||
|
batches.value = ['全部分类', ..._res.batches.map((item) => item.batchName)]
|
||||||
|
tableData.value = _res.plans
|
||||||
|
|
||||||
|
if (isFirst) {
|
||||||
|
year.value = yearList.value[0]
|
||||||
|
batche.value = batches.value[0]
|
||||||
|
}
|
||||||
|
isFirst = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleConfirm = () => {
|
||||||
|
if (pickType === 1) {
|
||||||
|
year.value = pickValue.value
|
||||||
|
} else if (pickType === 2) {
|
||||||
|
batche.value = pickValue.value
|
||||||
|
}
|
||||||
|
show.value = false
|
||||||
|
getPlanProListData(props.id)
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.submit-btn {
|
||||||
|
width: 332rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
background: #1580ff;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cancel-btn {
|
||||||
|
width: 332rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
background: #f5f5f5;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #1580ff;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,59 @@
|
||||||
|
<route lang="json5" type="page">
|
||||||
|
{
|
||||||
|
layout: 'page',
|
||||||
|
style: {
|
||||||
|
navigationStyle: 'custom',
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</route>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<view class="flex flex-col">
|
||||||
|
<wd-navbar
|
||||||
|
safeAreaInsetTop
|
||||||
|
custom-class="custom-background"
|
||||||
|
:bordered="false"
|
||||||
|
left-arrow
|
||||||
|
fixed
|
||||||
|
placeholder
|
||||||
|
@click-left="navigatorBack"
|
||||||
|
title="招生简章"
|
||||||
|
></wd-navbar>
|
||||||
|
<text class="font-semibold text-[28rpx] text-[#1F2329] mx-auto">
|
||||||
|
{{ detail?.title }}
|
||||||
|
</text>
|
||||||
|
<wd-divider custom-class="my-[16rpx]"></wd-divider>
|
||||||
|
<scroll-view class="flex-1 flex justify-center" :scroll-y="true" :scroll-x="true">
|
||||||
|
<view class="px-[32rpx]" v-html="detail?.content"></view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { getRecruitsDetail } from '@/service/index/api'
|
||||||
|
|
||||||
|
const navigatorBack = () => {
|
||||||
|
uni.navigateBack()
|
||||||
|
}
|
||||||
|
|
||||||
|
type UniversityEnrollmentBrochure = {
|
||||||
|
artsys_url: string
|
||||||
|
base_college_id: number
|
||||||
|
college_name: string
|
||||||
|
content: string
|
||||||
|
create_time: number
|
||||||
|
id: number
|
||||||
|
is_artsys: number
|
||||||
|
title: string
|
||||||
|
year: string
|
||||||
|
}
|
||||||
|
|
||||||
|
const detail = ref<UniversityEnrollmentBrochure>()
|
||||||
|
|
||||||
|
onLoad((options) => {
|
||||||
|
const _id = options.id || 0
|
||||||
|
getRecruitsDetail({ id: _id }).then((resp) => {
|
||||||
|
detail.value = resp.result as UniversityEnrollmentBrochure
|
||||||
|
})
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
@ -4,6 +4,10 @@
|
||||||
navigationStyle: 'custom',
|
navigationStyle: 'custom',
|
||||||
},
|
},
|
||||||
needLogin: true,
|
needLogin: true,
|
||||||
|
usingComponents: {
|
||||||
|
'wd-checkbox-group': 'wot-design-uni/components/wd-checkbox-group/wd-checkbox-group.vue',
|
||||||
|
'wd-checkbox': 'wot-design-uni/components/wd-checkbox/wd-checkbox.vue',
|
||||||
|
},
|
||||||
}
|
}
|
||||||
</route>
|
</route>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@
|
||||||
</route>
|
</route>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<view class="h-screen pb-safe flex flex-col">
|
<view class="h-screen flex flex-col">
|
||||||
<view class="relative">
|
<view class="relative">
|
||||||
<wd-navbar
|
<wd-navbar
|
||||||
safeAreaInsetTop
|
safeAreaInsetTop
|
||||||
|
|
@ -22,7 +22,7 @@
|
||||||
<view class="custom-background h-[200rpx] w-full absolute top-0 left-0 z-[1]"></view>
|
<view class="custom-background h-[200rpx] w-full absolute top-0 left-0 z-[1]"></view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<scroll-view class="flex-1" :scroll-y="true">
|
<scroll-view class="flex-1 flex flex-col" :scroll-y="true">
|
||||||
<view class="flex items-center p-[32rpx]" hover-class="none">
|
<view class="flex items-center p-[32rpx]" hover-class="none">
|
||||||
<image
|
<image
|
||||||
class="w-[104rpx] h-[104rpx]"
|
class="w-[104rpx] h-[104rpx]"
|
||||||
|
|
@ -42,7 +42,7 @@
|
||||||
{{ universityBaseInfo?.universityResult.features.slice(0, 4).join('/ ') }}
|
{{ universityBaseInfo?.universityResult.features.slice(0, 4).join('/ ') }}
|
||||||
</text>
|
</text>
|
||||||
</view>
|
</view>
|
||||||
<wd-button icon="star" custom-class="collect-btn" plain>收藏</wd-button>
|
<wd-button icon="star" custom-class="collect-btn" plain @click="handleStar">收藏</wd-button>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="card-swiper mb-[32rpx]">
|
<view class="card-swiper mb-[32rpx]">
|
||||||
|
|
@ -68,47 +68,65 @@
|
||||||
:slidable-num="4"
|
:slidable-num="4"
|
||||||
:offset-top="90"
|
:offset-top="90"
|
||||||
>
|
>
|
||||||
<block v-for="(item, index) in tabs" :key="index">
|
<wd-tab :title="`院校简介`" :name="0">
|
||||||
<wd-tab :title="`${item.name}`" :name="item.id">
|
<view class="bg-[#f8f8f8]">
|
||||||
<view class="bg-[#f8f8f8]" v-show="tabIndex === 0">
|
|
||||||
<Profile :university-result="universityBaseInfo?.universityResult" />
|
<Profile :university-result="universityBaseInfo?.universityResult" />
|
||||||
<FirstClass :id="collegeId" />
|
<FirstClass :id="collegeId" />
|
||||||
<Major :id="collegeId" />
|
|
||||||
<Colleges :id="collegeId" />
|
<Colleges :id="collegeId" />
|
||||||
</view>
|
</view>
|
||||||
|
<!-- 招生计划 -->
|
||||||
|
</wd-tab>
|
||||||
|
<wd-tab title="招生计划" :name="1">
|
||||||
|
<view class="bg-[#f8f8f8]">
|
||||||
|
<EnrollmentPlan :id="collegeId"></EnrollmentPlan>
|
||||||
|
</view>
|
||||||
|
</wd-tab>
|
||||||
|
|
||||||
|
<wd-tab title="招生简章" :name="2">
|
||||||
|
<!-- 招生简章 -->
|
||||||
|
<EnrollmentIntro :id="collegeId" />
|
||||||
|
</wd-tab>
|
||||||
|
<wd-tab title="录取分数线" :name="3">
|
||||||
|
<EnrollmentMark :id="collegeId" />
|
||||||
|
</wd-tab>
|
||||||
|
<wd-tab title="查扩缩招" :name="4">
|
||||||
|
<Situation :id="collegeId" />
|
||||||
</wd-tab>
|
</wd-tab>
|
||||||
</block>
|
|
||||||
</wd-tabs>
|
</wd-tabs>
|
||||||
</scroll-view>
|
</scroll-view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { useUniversityInfo, universityBaseInfo } from '@/hooks/useUserInfo'
|
|
||||||
import Profile from './components/Profile.vue'
|
import Profile from './components/Profile.vue'
|
||||||
import FirstClass from './components/FirstClass.vue'
|
import FirstClass from './components/FirstClass.vue'
|
||||||
import Colleges from './components/Colleges.vue'
|
import Colleges from './components/Colleges.vue'
|
||||||
import Major from './components/Major.vue'
|
import EnrollmentPlan from './components/EnrollmentPlan.vue'
|
||||||
|
import EnrollmentIntro from './components/EnrollmentIntro.vue'
|
||||||
|
import EnrollmentMark from './components/EnrollmentMark.vue'
|
||||||
|
import Situation from './components/Situation.vue'
|
||||||
|
import { getUniversityInfo } from '@/service/index/api'
|
||||||
|
|
||||||
const navigatorBack = () => {
|
const navigatorBack = () => {
|
||||||
uni.navigateBack()
|
uni.navigateBack()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const universityBaseInfo = ref()
|
||||||
|
|
||||||
const collegeId = ref(0)
|
const collegeId = ref(0)
|
||||||
|
|
||||||
onLoad((options) => {
|
onLoad((options) => {
|
||||||
collegeId.value = Number(options.collegeId) || 0
|
collegeId.value = Number(options.collegeId) || 0
|
||||||
useUniversityInfo(collegeId.value)
|
getUniversityInfo({ Id: collegeId.value }).then((res) => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
universityBaseInfo.value = res.result
|
||||||
|
}
|
||||||
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
const tabs = [
|
|
||||||
{ id: 0, name: '院校简介' },
|
|
||||||
{ id: 1, name: '招生计划' },
|
|
||||||
{ id: 2, name: '招生简章' },
|
|
||||||
{ id: 3, name: '录取分数线' },
|
|
||||||
{ id: 4, name: '查扩缩招' },
|
|
||||||
]
|
|
||||||
|
|
||||||
const tabIndex = ref<number>(0)
|
const tabIndex = ref<number>(0)
|
||||||
|
|
||||||
|
const handleStar = () => {}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|
@ -171,6 +189,7 @@ const tabIndex = ref<number>(0)
|
||||||
:deep(.tabs-wrapper) {
|
:deep(.tabs-wrapper) {
|
||||||
--wot-tabs-nav-fs: 28rpx;
|
--wot-tabs-nav-fs: 28rpx;
|
||||||
--wot-tabs-nav-height: 80rpx;
|
--wot-tabs-nav-height: 80rpx;
|
||||||
|
flex: 1 1 auto;
|
||||||
}
|
}
|
||||||
:deep(.wd-tabs__line) {
|
:deep(.wd-tabs__line) {
|
||||||
bottom: 0 !important;
|
bottom: 0 !important;
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,90 @@
|
||||||
|
<template>
|
||||||
|
<view class="table">
|
||||||
|
<!-- Table Header -->
|
||||||
|
<view class="table-header">
|
||||||
|
<view
|
||||||
|
v-for="(column, index) in columns"
|
||||||
|
:key="index"
|
||||||
|
class="table-cell"
|
||||||
|
:style="{ width: column.width || 'auto' }"
|
||||||
|
>
|
||||||
|
<text>{{ column.name }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-for="(item, index) in tableData" :key="index" class="table-row">
|
||||||
|
<view
|
||||||
|
v-for="(column, colIndex) in columns"
|
||||||
|
:key="colIndex"
|
||||||
|
class="table-cell"
|
||||||
|
:style="{ width: column.width || 'auto' }"
|
||||||
|
>
|
||||||
|
<text>{{ item[column.key] }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="text-center p-[32rpx]" v-show="tableData.length === 0">暂无数据</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
// Columns definition: array of column objects
|
||||||
|
columns: {
|
||||||
|
type: Array,
|
||||||
|
required: true,
|
||||||
|
default: () => [],
|
||||||
|
},
|
||||||
|
// Table data: array of rows
|
||||||
|
tableData: {
|
||||||
|
type: Array,
|
||||||
|
required: true,
|
||||||
|
default: () => [],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.table {
|
||||||
|
overflow: hidden;
|
||||||
|
width: calc(100% - 4rpx);
|
||||||
|
border: 2rpx solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-header {
|
||||||
|
display: flex;
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-cell {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 16rpx;
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-header .table-cell {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-row {
|
||||||
|
display: flex;
|
||||||
|
border-top: 1px solid #ddd;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-row .table-cell {
|
||||||
|
text-align: center;
|
||||||
|
padding: 16rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-row:first-child {
|
||||||
|
border-top: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-cell:not(:last-child) {
|
||||||
|
border-right: 1px solid #ddd;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -3,6 +3,10 @@
|
||||||
layout: 'page',
|
layout: 'page',
|
||||||
style: {
|
style: {
|
||||||
navigationStyle: 'custom',
|
navigationStyle: 'custom',
|
||||||
|
usingComponents: {
|
||||||
|
'wd-checkbox-group': 'wot-design-uni/components/wd-checkbox-group/wd-checkbox-group.vue',
|
||||||
|
'wd-checkbox': 'wot-design-uni/components/wd-checkbox/wd-checkbox.vue',
|
||||||
|
},
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</route>
|
</route>
|
||||||
|
|
|
||||||
|
|
@ -144,13 +144,25 @@
|
||||||
"navigationStyle": "custom"
|
"navigationStyle": "custom"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"path": "home/college/enrollmentIntroDetail",
|
||||||
|
"type": "page",
|
||||||
|
"layout": "page",
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"path": "home/college/index",
|
"path": "home/college/index",
|
||||||
"type": "page",
|
"type": "page",
|
||||||
"style": {
|
"style": {
|
||||||
"navigationStyle": "custom"
|
"navigationStyle": "custom"
|
||||||
},
|
},
|
||||||
"needLogin": true
|
"needLogin": true,
|
||||||
|
"usingComponents": {
|
||||||
|
"wd-checkbox-group": "wot-design-uni/components/wd-checkbox-group/wd-checkbox-group.vue",
|
||||||
|
"wd-checkbox": "wot-design-uni/components/wd-checkbox/wd-checkbox.vue"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"path": "home/college/info",
|
"path": "home/college/info",
|
||||||
|
|
@ -177,7 +189,11 @@
|
||||||
"type": "page",
|
"type": "page",
|
||||||
"layout": "page",
|
"layout": "page",
|
||||||
"style": {
|
"style": {
|
||||||
"navigationStyle": "custom"
|
"navigationStyle": "custom",
|
||||||
|
"usingComponents": {
|
||||||
|
"wd-checkbox-group": "wot-design-uni/components/wd-checkbox-group/wd-checkbox-group.vue",
|
||||||
|
"wd-checkbox": "wot-design-uni/components/wd-checkbox/wd-checkbox.vue"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -1,13 +0,0 @@
|
||||||
/* eslint-disable */
|
|
||||||
// @ts-ignore
|
|
||||||
import * as API from './types';
|
|
||||||
|
|
||||||
export function displayStatusEnum(field: API.IStatusEnum) {
|
|
||||||
return { available: 'available', pending: 'pending', sold: 'sold' }[field];
|
|
||||||
}
|
|
||||||
|
|
||||||
export function displayStatusEnum2(field: API.IStatusEnum2) {
|
|
||||||
return { placed: 'placed', approved: 'approved', delivered: 'delivered' }[
|
|
||||||
field
|
|
||||||
];
|
|
||||||
}
|
|
||||||
|
|
@ -1,11 +1,4 @@
|
||||||
/* eslint-disable */
|
/* eslint-disable */
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
export * from './types';
|
export * from './types';
|
||||||
export * from './displayEnumLabel';
|
|
||||||
|
|
||||||
export * from './pet';
|
|
||||||
export * from './pet.vuequery';
|
|
||||||
export * from './store';
|
|
||||||
export * from './store.vuequery';
|
|
||||||
export * from './user';
|
|
||||||
export * from './user.vuequery';
|
|
||||||
|
|
|
||||||
|
|
@ -1,193 +0,0 @@
|
||||||
/* eslint-disable */
|
|
||||||
// @ts-ignore
|
|
||||||
import request from '@/utils/request';
|
|
||||||
import { CustomRequestOptions } from '@/interceptors/request';
|
|
||||||
|
|
||||||
import * as API from './types';
|
|
||||||
|
|
||||||
/** Update an existing pet PUT /pet */
|
|
||||||
export async function updatePet({
|
|
||||||
body,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
body: API.Pet;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return request<unknown>('/pet', {
|
|
||||||
method: 'PUT',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
data: body,
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Add a new pet to the store POST /pet */
|
|
||||||
export async function addPet({
|
|
||||||
body,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
body: API.Pet;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return request<unknown>('/pet', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
data: body,
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Find pet by ID Returns a single pet GET /pet/${param0} */
|
|
||||||
export async function getPetById({
|
|
||||||
params,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.getPetByIdParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
const { petId: param0, ...queryParams } = params;
|
|
||||||
|
|
||||||
return request<API.Pet>(`/pet/${param0}`, {
|
|
||||||
method: 'GET',
|
|
||||||
params: { ...queryParams },
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Updates a pet in the store with form data POST /pet/${param0} */
|
|
||||||
export async function updatePetWithForm({
|
|
||||||
params,
|
|
||||||
body,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.updatePetWithFormParams;
|
|
||||||
body: {
|
|
||||||
/** Updated name of the pet */
|
|
||||||
name?: string;
|
|
||||||
/** Updated status of the pet */
|
|
||||||
status?: string;
|
|
||||||
};
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
const { petId: param0, ...queryParams } = params;
|
|
||||||
|
|
||||||
return request<unknown>(`/pet/${param0}`, {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/x-www-form-urlencoded',
|
|
||||||
},
|
|
||||||
params: { ...queryParams },
|
|
||||||
data: body,
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Deletes a pet DELETE /pet/${param0} */
|
|
||||||
export async function deletePet({
|
|
||||||
params,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.deletePetParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
const { petId: param0, ...queryParams } = params;
|
|
||||||
|
|
||||||
return request<unknown>(`/pet/${param0}`, {
|
|
||||||
method: 'DELETE',
|
|
||||||
params: { ...queryParams },
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** uploads an image POST /pet/${param0}/uploadImage */
|
|
||||||
export async function uploadFile({
|
|
||||||
params,
|
|
||||||
body,
|
|
||||||
file,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.uploadFileParams;
|
|
||||||
body: {
|
|
||||||
/** Additional data to pass to server */
|
|
||||||
additionalMetadata?: string;
|
|
||||||
};
|
|
||||||
file?: File;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
const { petId: param0, ...queryParams } = params;
|
|
||||||
const formData = new FormData();
|
|
||||||
|
|
||||||
if (file) {
|
|
||||||
formData.append('file', file);
|
|
||||||
}
|
|
||||||
|
|
||||||
Object.keys(body).forEach((ele) => {
|
|
||||||
const item = (body as { [key: string]: any })[ele];
|
|
||||||
|
|
||||||
if (item !== undefined && item !== null) {
|
|
||||||
if (typeof item === 'object' && !(item instanceof File)) {
|
|
||||||
if (item instanceof Array) {
|
|
||||||
item.forEach((f) => formData.append(ele, f || ''));
|
|
||||||
} else {
|
|
||||||
formData.append(ele, JSON.stringify(item));
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
formData.append(ele, item);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
return request<API.ApiResponse>(`/pet/${param0}/uploadImage`, {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'multipart/form-data',
|
|
||||||
},
|
|
||||||
params: { ...queryParams },
|
|
||||||
data: formData,
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Finds Pets by status Multiple status values can be provided with comma separated strings GET /pet/findByStatus */
|
|
||||||
export async function findPetsByStatus({
|
|
||||||
params,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.findPetsByStatusParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return request<API.Pet[]>('/pet/findByStatus', {
|
|
||||||
method: 'GET',
|
|
||||||
params: {
|
|
||||||
...params,
|
|
||||||
},
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Finds Pets by tags Multiple tags can be provided with comma separated strings. Use tag1, tag2, tag3 for testing. GET /pet/findByTags */
|
|
||||||
export async function findPetsByTags({
|
|
||||||
params,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.findPetsByTagsParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return request<API.Pet[]>('/pet/findByTags', {
|
|
||||||
method: 'GET',
|
|
||||||
params: {
|
|
||||||
...params,
|
|
||||||
},
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
@ -1,151 +0,0 @@
|
||||||
/* eslint-disable */
|
|
||||||
// @ts-ignore
|
|
||||||
import { queryOptions, useMutation } from '@tanstack/vue-query';
|
|
||||||
import type { DefaultError } from '@tanstack/vue-query';
|
|
||||||
import request from '@/utils/request';
|
|
||||||
import { CustomRequestOptions } from '@/interceptors/request';
|
|
||||||
|
|
||||||
import * as apis from './pet';
|
|
||||||
import * as API from './types';
|
|
||||||
|
|
||||||
/** Update an existing pet PUT /pet */
|
|
||||||
export function useUpdatePetMutation(options?: {
|
|
||||||
onSuccess?: (value?: unknown) => void;
|
|
||||||
onError?: (error?: DefaultError) => void;
|
|
||||||
}) {
|
|
||||||
const { onSuccess, onError } = options || {};
|
|
||||||
|
|
||||||
const response = useMutation({
|
|
||||||
mutationFn: apis.updatePet,
|
|
||||||
onSuccess(data: unknown) {
|
|
||||||
onSuccess?.(data);
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
onError?.(error);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return response;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Add a new pet to the store POST /pet */
|
|
||||||
export function useAddPetMutation(options?: {
|
|
||||||
onSuccess?: (value?: unknown) => void;
|
|
||||||
onError?: (error?: DefaultError) => void;
|
|
||||||
}) {
|
|
||||||
const { onSuccess, onError } = options || {};
|
|
||||||
|
|
||||||
const response = useMutation({
|
|
||||||
mutationFn: apis.addPet,
|
|
||||||
onSuccess(data: unknown) {
|
|
||||||
onSuccess?.(data);
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
onError?.(error);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return response;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Find pet by ID Returns a single pet GET /pet/${param0} */
|
|
||||||
export function getPetByIdQueryOptions(options: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.getPetByIdParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return queryOptions({
|
|
||||||
queryFn: async ({ queryKey }) => {
|
|
||||||
return apis.getPetById(queryKey[1] as typeof options);
|
|
||||||
},
|
|
||||||
queryKey: ['getPetById', options],
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Updates a pet in the store with form data POST /pet/${param0} */
|
|
||||||
export function useUpdatePetWithFormMutation(options?: {
|
|
||||||
onSuccess?: (value?: unknown) => void;
|
|
||||||
onError?: (error?: DefaultError) => void;
|
|
||||||
}) {
|
|
||||||
const { onSuccess, onError } = options || {};
|
|
||||||
|
|
||||||
const response = useMutation({
|
|
||||||
mutationFn: apis.updatePetWithForm,
|
|
||||||
onSuccess(data: unknown) {
|
|
||||||
onSuccess?.(data);
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
onError?.(error);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return response;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Deletes a pet DELETE /pet/${param0} */
|
|
||||||
export function useDeletePetMutation(options?: {
|
|
||||||
onSuccess?: (value?: unknown) => void;
|
|
||||||
onError?: (error?: DefaultError) => void;
|
|
||||||
}) {
|
|
||||||
const { onSuccess, onError } = options || {};
|
|
||||||
|
|
||||||
const response = useMutation({
|
|
||||||
mutationFn: apis.deletePet,
|
|
||||||
onSuccess(data: unknown) {
|
|
||||||
onSuccess?.(data);
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
onError?.(error);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return response;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** uploads an image POST /pet/${param0}/uploadImage */
|
|
||||||
export function useUploadFileMutation(options?: {
|
|
||||||
onSuccess?: (value?: API.ApiResponse) => void;
|
|
||||||
onError?: (error?: DefaultError) => void;
|
|
||||||
}) {
|
|
||||||
const { onSuccess, onError } = options || {};
|
|
||||||
|
|
||||||
const response = useMutation({
|
|
||||||
mutationFn: apis.uploadFile,
|
|
||||||
onSuccess(data: API.ApiResponse) {
|
|
||||||
onSuccess?.(data);
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
onError?.(error);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return response;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Finds Pets by status Multiple status values can be provided with comma separated strings GET /pet/findByStatus */
|
|
||||||
export function findPetsByStatusQueryOptions(options: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.findPetsByStatusParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return queryOptions({
|
|
||||||
queryFn: async ({ queryKey }) => {
|
|
||||||
return apis.findPetsByStatus(queryKey[1] as typeof options);
|
|
||||||
},
|
|
||||||
queryKey: ['findPetsByStatus', options],
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Finds Pets by tags Multiple tags can be provided with comma separated strings. Use tag1, tag2, tag3 for testing. GET /pet/findByTags */
|
|
||||||
export function findPetsByTagsQueryOptions(options: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.findPetsByTagsParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return queryOptions({
|
|
||||||
queryFn: async ({ queryKey }) => {
|
|
||||||
return apis.findPetsByTags(queryKey[1] as typeof options);
|
|
||||||
},
|
|
||||||
queryKey: ['findPetsByTags', options],
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
@ -1,72 +0,0 @@
|
||||||
/* eslint-disable */
|
|
||||||
// @ts-ignore
|
|
||||||
import request from '@/utils/request';
|
|
||||||
import { CustomRequestOptions } from '@/interceptors/request';
|
|
||||||
|
|
||||||
import * as API from './types';
|
|
||||||
|
|
||||||
/** Returns pet inventories by status Returns a map of status codes to quantities GET /store/inventory */
|
|
||||||
export async function getInventory({
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return request<Record<string, unknown>>('/store/inventory', {
|
|
||||||
method: 'GET',
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Place an order for a pet POST /store/order */
|
|
||||||
export async function placeOrder({
|
|
||||||
body,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
body: API.Order;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return request<API.Order>('/store/order', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
data: body,
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Find purchase order by ID For valid response try integer IDs with value >= 1 and <= 10. Other values will generated exceptions GET /store/order/${param0} */
|
|
||||||
export async function getOrderById({
|
|
||||||
params,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.getOrderByIdParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
const { orderId: param0, ...queryParams } = params;
|
|
||||||
|
|
||||||
return request<API.Order>(`/store/order/${param0}`, {
|
|
||||||
method: 'GET',
|
|
||||||
params: { ...queryParams },
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Delete purchase order by ID For valid response try integer IDs with positive integer value. Negative or non-integer values will generate API errors DELETE /store/order/${param0} */
|
|
||||||
export async function deleteOrder({
|
|
||||||
params,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.deleteOrderParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
const { orderId: param0, ...queryParams } = params;
|
|
||||||
|
|
||||||
return request<unknown>(`/store/order/${param0}`, {
|
|
||||||
method: 'DELETE',
|
|
||||||
params: { ...queryParams },
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
@ -1,75 +0,0 @@
|
||||||
/* eslint-disable */
|
|
||||||
// @ts-ignore
|
|
||||||
import { queryOptions, useMutation } from '@tanstack/vue-query';
|
|
||||||
import type { DefaultError } from '@tanstack/vue-query';
|
|
||||||
import request from '@/utils/request';
|
|
||||||
import { CustomRequestOptions } from '@/interceptors/request';
|
|
||||||
|
|
||||||
import * as apis from './store';
|
|
||||||
import * as API from './types';
|
|
||||||
|
|
||||||
/** Returns pet inventories by status Returns a map of status codes to quantities GET /store/inventory */
|
|
||||||
export function getInventoryQueryOptions(options: {
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return queryOptions({
|
|
||||||
queryFn: async ({ queryKey }) => {
|
|
||||||
return apis.getInventory(queryKey[1] as typeof options);
|
|
||||||
},
|
|
||||||
queryKey: ['getInventory', options],
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Place an order for a pet POST /store/order */
|
|
||||||
export function usePlaceOrderMutation(options?: {
|
|
||||||
onSuccess?: (value?: API.Order) => void;
|
|
||||||
onError?: (error?: DefaultError) => void;
|
|
||||||
}) {
|
|
||||||
const { onSuccess, onError } = options || {};
|
|
||||||
|
|
||||||
const response = useMutation({
|
|
||||||
mutationFn: apis.placeOrder,
|
|
||||||
onSuccess(data: API.Order) {
|
|
||||||
onSuccess?.(data);
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
onError?.(error);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return response;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Find purchase order by ID For valid response try integer IDs with value >= 1 and <= 10. Other values will generated exceptions GET /store/order/${param0} */
|
|
||||||
export function getOrderByIdQueryOptions(options: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.getOrderByIdParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return queryOptions({
|
|
||||||
queryFn: async ({ queryKey }) => {
|
|
||||||
return apis.getOrderById(queryKey[1] as typeof options);
|
|
||||||
},
|
|
||||||
queryKey: ['getOrderById', options],
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Delete purchase order by ID For valid response try integer IDs with positive integer value. Negative or non-integer values will generate API errors DELETE /store/order/${param0} */
|
|
||||||
export function useDeleteOrderMutation(options?: {
|
|
||||||
onSuccess?: (value?: unknown) => void;
|
|
||||||
onError?: (error?: DefaultError) => void;
|
|
||||||
}) {
|
|
||||||
const { onSuccess, onError } = options || {};
|
|
||||||
|
|
||||||
const response = useMutation({
|
|
||||||
mutationFn: apis.deleteOrder,
|
|
||||||
onSuccess(data: unknown) {
|
|
||||||
onSuccess?.(data);
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
onError?.(error);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return response;
|
|
||||||
}
|
|
||||||
|
|
@ -1,150 +0,0 @@
|
||||||
/* eslint-disable */
|
|
||||||
// @ts-ignore
|
|
||||||
import request from '@/utils/request';
|
|
||||||
import { CustomRequestOptions } from '@/interceptors/request';
|
|
||||||
|
|
||||||
import * as API from './types';
|
|
||||||
|
|
||||||
/** Create user This can only be done by the logged in user. 返回值: successful operation POST /user */
|
|
||||||
export async function createUser({
|
|
||||||
body,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
body: API.User;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return request<unknown>('/user', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
data: body,
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Get user by user name GET /user/${param0} */
|
|
||||||
export async function getUserByName({
|
|
||||||
params,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.getUserByNameParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
const { username: param0, ...queryParams } = params;
|
|
||||||
|
|
||||||
return request<API.User>(`/user/${param0}`, {
|
|
||||||
method: 'GET',
|
|
||||||
params: { ...queryParams },
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Updated user This can only be done by the logged in user. PUT /user/${param0} */
|
|
||||||
export async function updateUser({
|
|
||||||
params,
|
|
||||||
body,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.updateUserParams;
|
|
||||||
body: API.User;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
const { username: param0, ...queryParams } = params;
|
|
||||||
|
|
||||||
return request<unknown>(`/user/${param0}`, {
|
|
||||||
method: 'PUT',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
params: { ...queryParams },
|
|
||||||
data: body,
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Delete user This can only be done by the logged in user. DELETE /user/${param0} */
|
|
||||||
export async function deleteUser({
|
|
||||||
params,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.deleteUserParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
const { username: param0, ...queryParams } = params;
|
|
||||||
|
|
||||||
return request<unknown>(`/user/${param0}`, {
|
|
||||||
method: 'DELETE',
|
|
||||||
params: { ...queryParams },
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Creates list of users with given input array 返回值: successful operation POST /user/createWithArray */
|
|
||||||
export async function createUsersWithArrayInput({
|
|
||||||
body,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
body: API.User[];
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return request<unknown>('/user/createWithArray', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
data: body,
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Creates list of users with given input array 返回值: successful operation POST /user/createWithList */
|
|
||||||
export async function createUsersWithListInput({
|
|
||||||
body,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
body: API.User[];
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return request<unknown>('/user/createWithList', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
data: body,
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Logs user into the system GET /user/login */
|
|
||||||
export async function loginUser({
|
|
||||||
params,
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.loginUserParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return request<string>('/user/login', {
|
|
||||||
method: 'GET',
|
|
||||||
params: {
|
|
||||||
...params,
|
|
||||||
},
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Logs out current logged in user session 返回值: successful operation GET /user/logout */
|
|
||||||
export async function logoutUser({
|
|
||||||
options,
|
|
||||||
}: {
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return request<unknown>('/user/logout', {
|
|
||||||
method: 'GET',
|
|
||||||
...(options || {}),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
@ -1,149 +0,0 @@
|
||||||
/* eslint-disable */
|
|
||||||
// @ts-ignore
|
|
||||||
import { queryOptions, useMutation } from '@tanstack/vue-query';
|
|
||||||
import type { DefaultError } from '@tanstack/vue-query';
|
|
||||||
import request from '@/utils/request';
|
|
||||||
import { CustomRequestOptions } from '@/interceptors/request';
|
|
||||||
|
|
||||||
import * as apis from './user';
|
|
||||||
import * as API from './types';
|
|
||||||
|
|
||||||
/** Create user This can only be done by the logged in user. 返回值: successful operation POST /user */
|
|
||||||
export function useCreateUserMutation(options?: {
|
|
||||||
onSuccess?: (value?: unknown) => void;
|
|
||||||
onError?: (error?: DefaultError) => void;
|
|
||||||
}) {
|
|
||||||
const { onSuccess, onError } = options || {};
|
|
||||||
|
|
||||||
const response = useMutation({
|
|
||||||
mutationFn: apis.createUser,
|
|
||||||
onSuccess(data: unknown) {
|
|
||||||
onSuccess?.(data);
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
onError?.(error);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return response;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Get user by user name GET /user/${param0} */
|
|
||||||
export function getUserByNameQueryOptions(options: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.getUserByNameParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return queryOptions({
|
|
||||||
queryFn: async ({ queryKey }) => {
|
|
||||||
return apis.getUserByName(queryKey[1] as typeof options);
|
|
||||||
},
|
|
||||||
queryKey: ['getUserByName', options],
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Updated user This can only be done by the logged in user. PUT /user/${param0} */
|
|
||||||
export function useUpdateUserMutation(options?: {
|
|
||||||
onSuccess?: (value?: unknown) => void;
|
|
||||||
onError?: (error?: DefaultError) => void;
|
|
||||||
}) {
|
|
||||||
const { onSuccess, onError } = options || {};
|
|
||||||
|
|
||||||
const response = useMutation({
|
|
||||||
mutationFn: apis.updateUser,
|
|
||||||
onSuccess(data: unknown) {
|
|
||||||
onSuccess?.(data);
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
onError?.(error);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return response;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Delete user This can only be done by the logged in user. DELETE /user/${param0} */
|
|
||||||
export function useDeleteUserMutation(options?: {
|
|
||||||
onSuccess?: (value?: unknown) => void;
|
|
||||||
onError?: (error?: DefaultError) => void;
|
|
||||||
}) {
|
|
||||||
const { onSuccess, onError } = options || {};
|
|
||||||
|
|
||||||
const response = useMutation({
|
|
||||||
mutationFn: apis.deleteUser,
|
|
||||||
onSuccess(data: unknown) {
|
|
||||||
onSuccess?.(data);
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
onError?.(error);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return response;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Creates list of users with given input array 返回值: successful operation POST /user/createWithArray */
|
|
||||||
export function useCreateUsersWithArrayInputMutation(options?: {
|
|
||||||
onSuccess?: (value?: unknown) => void;
|
|
||||||
onError?: (error?: DefaultError) => void;
|
|
||||||
}) {
|
|
||||||
const { onSuccess, onError } = options || {};
|
|
||||||
|
|
||||||
const response = useMutation({
|
|
||||||
mutationFn: apis.createUsersWithArrayInput,
|
|
||||||
onSuccess(data: unknown) {
|
|
||||||
onSuccess?.(data);
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
onError?.(error);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return response;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Creates list of users with given input array 返回值: successful operation POST /user/createWithList */
|
|
||||||
export function useCreateUsersWithListInputMutation(options?: {
|
|
||||||
onSuccess?: (value?: unknown) => void;
|
|
||||||
onError?: (error?: DefaultError) => void;
|
|
||||||
}) {
|
|
||||||
const { onSuccess, onError } = options || {};
|
|
||||||
|
|
||||||
const response = useMutation({
|
|
||||||
mutationFn: apis.createUsersWithListInput,
|
|
||||||
onSuccess(data: unknown) {
|
|
||||||
onSuccess?.(data);
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
onError?.(error);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return response;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Logs user into the system GET /user/login */
|
|
||||||
export function loginUserQueryOptions(options: {
|
|
||||||
// 叠加生成的Param类型 (非body参数openapi默认没有生成对象)
|
|
||||||
params: API.loginUserParams;
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return queryOptions({
|
|
||||||
queryFn: async ({ queryKey }) => {
|
|
||||||
return apis.loginUser(queryKey[1] as typeof options);
|
|
||||||
},
|
|
||||||
queryKey: ['loginUser', options],
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Logs out current logged in user session 返回值: successful operation GET /user/logout */
|
|
||||||
export function logoutUserQueryOptions(options: {
|
|
||||||
options?: CustomRequestOptions;
|
|
||||||
}) {
|
|
||||||
return queryOptions({
|
|
||||||
queryFn: async ({ queryKey }) => {
|
|
||||||
return apis.logoutUser(queryKey[1] as typeof options);
|
|
||||||
},
|
|
||||||
queryKey: ['logoutUser', options],
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
@ -101,3 +101,37 @@ export const getUniversityInfo = (params: { Id: number }) => {
|
||||||
export const getSubjectIntroduceList = (id: number) => {
|
export const getSubjectIntroduceList = (id: number) => {
|
||||||
return http.get('/api/zhiYuan/subjectIntroducelist', { id })
|
return http.get('/api/zhiYuan/subjectIntroducelist', { id })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 院校
|
||||||
|
export const getUniversityListByProvince = (params: { id: number }) => {
|
||||||
|
return http.get('/api/zhiYuan/zfacultylist', params)
|
||||||
|
}
|
||||||
|
|
||||||
|
export const getPlanProList = (params: {
|
||||||
|
_uid: number
|
||||||
|
years: string
|
||||||
|
batchName: string
|
||||||
|
locationCode: string
|
||||||
|
}) => {
|
||||||
|
return http.get('/api/PlanPro/v2/list', params)
|
||||||
|
}
|
||||||
|
|
||||||
|
export const getRecruits = (uid: number) => {
|
||||||
|
return http.get('/api/zhiYuan/recruits', { uid })
|
||||||
|
}
|
||||||
|
|
||||||
|
export const getRecruitsDetail = (params: { id: number }) => {
|
||||||
|
return http.get('/api/zhiYuan/recruitdetail', params)
|
||||||
|
}
|
||||||
|
|
||||||
|
export const addUnCollection = (params: { wxId: number; uId: number }) => {
|
||||||
|
return http.post('/api/unCollection/add', params)
|
||||||
|
}
|
||||||
|
|
||||||
|
export const getUnCollectionList = (params: {
|
||||||
|
SearchKey: string
|
||||||
|
Page: number
|
||||||
|
PageSize: number
|
||||||
|
}) => {
|
||||||
|
return http.get('/api/unCollection/list', params)
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
import { http } from '@/utils/http'
|
|
||||||
export interface IFooItem {
|
|
||||||
id: string
|
|
||||||
name: string
|
|
||||||
}
|
|
||||||
|
|
||||||
/** GET 请求 */
|
|
||||||
export const getFooAPI = (name: string) => {
|
|
||||||
return http.get<IFooItem>('/foo', { name })
|
|
||||||
}
|
|
||||||
|
|
||||||
/** POST 请求 */
|
|
||||||
export const postFooAPI = (name: string) => {
|
|
||||||
return http.post<IFooItem>('/foo', { name }, { name })
|
|
||||||
}
|
|
||||||
|
|
@ -202,7 +202,6 @@ declare module 'vue' {
|
||||||
readonly toRefs: UnwrapRef<typeof import('vue')['toRefs']>
|
readonly toRefs: UnwrapRef<typeof import('vue')['toRefs']>
|
||||||
readonly toValue: UnwrapRef<typeof import('vue')['toValue']>
|
readonly toValue: UnwrapRef<typeof import('vue')['toValue']>
|
||||||
readonly triggerRef: UnwrapRef<typeof import('vue')['triggerRef']>
|
readonly triggerRef: UnwrapRef<typeof import('vue')['triggerRef']>
|
||||||
readonly universityBaseInfo: UnwrapRef<typeof import('../hooks/useUserInfo')['universityBaseInfo']>
|
|
||||||
readonly unref: UnwrapRef<typeof import('vue')['unref']>
|
readonly unref: UnwrapRef<typeof import('vue')['unref']>
|
||||||
readonly useAttrs: UnwrapRef<typeof import('vue')['useAttrs']>
|
readonly useAttrs: UnwrapRef<typeof import('vue')['useAttrs']>
|
||||||
readonly useCityInfo: UnwrapRef<typeof import('../hooks/useCityInfoHook')['useCityInfo']>
|
readonly useCityInfo: UnwrapRef<typeof import('../hooks/useCityInfoHook')['useCityInfo']>
|
||||||
|
|
@ -220,7 +219,6 @@ declare module 'vue' {
|
||||||
readonly useSlots: UnwrapRef<typeof import('vue')['useSlots']>
|
readonly useSlots: UnwrapRef<typeof import('vue')['useSlots']>
|
||||||
readonly useTemplateRef: UnwrapRef<typeof import('vue')['useTemplateRef']>
|
readonly useTemplateRef: UnwrapRef<typeof import('vue')['useTemplateRef']>
|
||||||
readonly useUnSortType: UnwrapRef<typeof import('../hooks/useUnSortType')['useUnSortType']>
|
readonly useUnSortType: UnwrapRef<typeof import('../hooks/useUnSortType')['useUnSortType']>
|
||||||
readonly useUniversityInfo: UnwrapRef<typeof import('../hooks/useUserInfo')['useUniversityInfo']>
|
|
||||||
readonly useUniversityLevel: UnwrapRef<typeof import('../hooks/useFilterSchool')['useUniversityLevel']>
|
readonly useUniversityLevel: UnwrapRef<typeof import('../hooks/useFilterSchool')['useUniversityLevel']>
|
||||||
readonly useUniversityRank: UnwrapRef<typeof import('../hooks/useUnSortType')['useUniversityRank']>
|
readonly useUniversityRank: UnwrapRef<typeof import('../hooks/useUnSortType')['useUniversityRank']>
|
||||||
readonly useUniversityType: UnwrapRef<typeof import('../hooks/useFilterSchool')['useUniversityType']>
|
readonly useUniversityType: UnwrapRef<typeof import('../hooks/useFilterSchool')['useUniversityType']>
|
||||||
|
|
|
||||||
|
|
@ -14,6 +14,7 @@ interface NavigateToOptions {
|
||||||
"/pages-sub/home/autoFill/index" |
|
"/pages-sub/home/autoFill/index" |
|
||||||
"/pages-sub/home/career/index" |
|
"/pages-sub/home/career/index" |
|
||||||
"/pages-sub/home/city/index" |
|
"/pages-sub/home/city/index" |
|
||||||
|
"/pages-sub/home/college/enrollmentIntroDetail" |
|
||||||
"/pages-sub/home/college/index" |
|
"/pages-sub/home/college/index" |
|
||||||
"/pages-sub/home/college/info" |
|
"/pages-sub/home/college/info" |
|
||||||
"/pages-sub/home/distinguish/index" |
|
"/pages-sub/home/distinguish/index" |
|
||||||
|
|
|
||||||
|
|
@ -1,9 +0,0 @@
|
||||||
## 0.3.0（2024-10-21）
|
|
||||||
支持鸿蒙Next
|
|
||||||
## 0.2.7（2024-07-18）
|
|
||||||
1.`新增` 支持切换rpx&px
|
|
||||||
2.`修复` 宽度小于屏幕时底部tabs位置不正确的问题
|
|
||||||
3.`修复` 偶现的Cannot read property 'left' of undefind的问题
|
|
||||||
|
|
||||||
## 0.2.5（2023-01-09）
|
|
||||||
修复可能出现的可能出现的与swiper联动时报错node不存在的bug
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
// z-tabs全局配置文件，注意避免更新时此文件被覆盖，若被覆盖，可在此文件中右键->点击本地历史记录，找回覆盖前的配置
|
|
||||||
export default {
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
@ -1,791 +0,0 @@
|
||||||
<!-- z-tabs v0.3.0 by-ZXLee -->
|
|
||||||
<!-- github地址:https://github.com/SmileZXLee/uni-z-tabs -->
|
|
||||||
<!-- dcloud地址:https://ext.dcloud.net.cn/plugin?name=z-tabs -->
|
|
||||||
<!-- 反馈QQ群：371624008 -->
|
|
||||||
|
|
||||||
<template name="z-tabs">
|
|
||||||
<view class="z-tabs-conatiner" :style="[{background:bgColor}, {height: unit==='rpx' ? '80rpx' : '40px'}, tabsStyle]">
|
|
||||||
<view class="z-tabs-left">
|
|
||||||
<slot name="left" />
|
|
||||||
</view>
|
|
||||||
<view ref="z-tabs-scroll-view-conatiner" class="z-tabs-scroll-view-conatiner">
|
|
||||||
<scroll-view ref="z-tabs-scroll-view" class="z-tabs-scroll-view" :scroll-x="true" :scroll-left="scrollLeft" :show-scrollbar="false" :scroll-with-animation="isFirstLoaded" @scroll="scroll">
|
|
||||||
<view class="z-tabs-list-container" :style="[tabsListStyle]">
|
|
||||||
<view class="z-tabs-list" :style="[tabsListStyle, {marginTop: -finalBottomSpace+'px'}]">
|
|
||||||
<view :ref="`z-tabs-item-${index}`" :id="`z-tabs-item-${index}`" class="z-tabs-item" :style="[tabStyle]" v-for="(item,index) in list" :key="index" @click="tabsClick(index,item)">
|
|
||||||
<view class="z-tabs-item-title-container">
|
|
||||||
<text :class="{'z-tabs-item-title-rpx':unit==='rpx','z-tabs-item-title-px':unit==='px','z-tabs-item-title-disabled':item.disabled}"
|
|
||||||
:style="[{color:item.disabled?disabledColor:(currentIndex===index?activeColor:inactiveColor)},item.disabled?disabledStyle:(currentIndex===index?activeStyle:inactiveStyle)]">
|
|
||||||
{{item[nameKey]||item}}
|
|
||||||
</text>
|
|
||||||
<text v-if="item.badge&&_formatCount(item.badge.count).length" class="z-tabs-item-badge" :class="{'z-tabs-item-badge-rpx':unit==='rpx','z-tabs-item-badge-px':unit==='px'}" :style="[badgeStyle]">{{_formatCount(item.badge.count)}}</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="z-tabs-bottom" :style="[{width: tabsContainerWidth+'px', bottom: finalBottomSpace+'px'}]">
|
|
||||||
<view ref="z-tabs-bottom-dot" class="z-tabs-bottom-dot"
|
|
||||||
<!-- #ifndef APP-NVUE -->
|
|
||||||
:style="[{transform:`translateX(${bottomDotX}px)`,transition:dotTransition,background:activeColor},finalDotStyle]"
|
|
||||||
<!-- #endif -->
|
|
||||||
<!-- #ifdef APP-NVUE -->
|
|
||||||
:style="[{background:activeColor},finalDotStyle]"
|
|
||||||
<!-- #endif -->
|
|
||||||
/>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</scroll-view>
|
|
||||||
</view>
|
|
||||||
<view class="z-tabs-right">
|
|
||||||
<slot name="right" />
|
|
||||||
</view>
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// #ifdef APP-NVUE
|
|
||||||
const weexDom = weex.requireModule('dom');
|
|
||||||
const weexAnimation = weex.requireModule('animation');
|
|
||||||
// #endif
|
|
||||||
import zTabsConfig from './config/index'
|
|
||||||
|
|
||||||
// #ifdef APP-HARMONY
|
|
||||||
let screenWidth = 0;
|
|
||||||
// #endif
|
|
||||||
// 获取默认配置信息
|
|
||||||
function _gc(key, defaultValue) {
|
|
||||||
let config = null;
|
|
||||||
if (zTabsConfig && Object.keys(zTabsConfig).length) {
|
|
||||||
config = zTabsConfig;
|
|
||||||
} else {
|
|
||||||
return defaultValue;
|
|
||||||
}
|
|
||||||
const value = config[_toKebab(key)];
|
|
||||||
return value === undefined ? defaultValue : value;
|
|
||||||
}
|
|
||||||
// 驼峰转短横线
|
|
||||||
function _toKebab(value) {
|
|
||||||
return value.replace(/([A-Z])/g, "-$1").toLowerCase();
|
|
||||||
}
|
|
||||||
// rpx => px，兼容鸿蒙
|
|
||||||
function rpx2px(rpx) {
|
|
||||||
// #ifdef APP-HARMONY
|
|
||||||
if (!screenWidth) {
|
|
||||||
screenWidth = uni.getSystemInfoSync().screenWidth;
|
|
||||||
}
|
|
||||||
return (screenWidth * Number.parseFloat(rpx)) / 750;
|
|
||||||
// #endif
|
|
||||||
// #ifndef APP-HARMONY
|
|
||||||
return uni.upx2px(rpx);
|
|
||||||
// #endif
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* z-tabs 标签
|
|
||||||
* @description 一个简单轻量的tabs标签，全平台兼容，支持nvue、vue3
|
|
||||||
* @tutorial https://ext.dcloud.net.cn/plugin?name=z-tabs
|
|
||||||
* @property {Array} list 数据源数组，支持形如['tab1','tab2']的格式或[{name:'tab1',value:1}]的格式
|
|
||||||
* @property {Number|String} current 当前选中的index，默认为0
|
|
||||||
* @property {Number|String} scroll-count list数组长度超过scrollCount时滚动显示(不自动铺满全屏)，默认为5
|
|
||||||
* @property {Number|String} tab-width 自定义每个tab的宽度，默认为0，即代表根据内容自动撑开，单位rpx，支持传100、"100px"或"100rpx"
|
|
||||||
* @property {Number|String} bar-width 滑块宽度，单位rpx，支持传100、"100px"或"100rpx"
|
|
||||||
* @property {Number|String} bar-height 滑块高度，单位rpx，支持传100、"100px"或"100rpx"
|
|
||||||
* @property {Object} bar-style 滑块样式，其中的width和height将被bar-width和bar-height覆盖
|
|
||||||
* @property {Number|String} bottom-space tabs与底部的间距，单位rpx，支持传100、"100px"或"100rpx"
|
|
||||||
* @property {String} bar-animate-mode 切换tab时滑块动画模式，与swiper联动时有效，点击切换tab时无效，必须调用setDx。默认为line，即切换tab时滑块宽度保持不变，线性运动。可选值为worm，即为类似毛毛虫蠕动效果
|
|
||||||
* @property {String} name-key list中item的name(标题)的key，默认为name
|
|
||||||
* @property {String} value-key list中item的value的key，默认为value
|
|
||||||
* @property {String} active-color 激活状态tab的颜色
|
|
||||||
* @property {String} inactive-color 未激活状态tab的颜色
|
|
||||||
* @property {String} disabled-color 禁用状态tab的颜色
|
|
||||||
* @property {Object} active-style 激活状态tab的样式
|
|
||||||
* @property {Object} inactive-style 未激活状态tab的样式
|
|
||||||
* @property {Object} disabled-style 禁用状态tab的样式
|
|
||||||
* @property {Number|String} badge-max-count 徽标数最大数字限制，超过这个数字将变成badge-max-count+，默认为99
|
|
||||||
* @property {Object} badge-style 徽标样式，例如可自定义背景色，字体等等
|
|
||||||
* @property {String} bg-color z-tabs背景色
|
|
||||||
* @property {Object} tabs-style z-tabs样式
|
|
||||||
* @property {Boolean} init-trigger-change 初始化时是否自动触发change事件
|
|
||||||
* @property {String} unit z-tabs中布局的单位，默认为rpx
|
|
||||||
* @event {Function(index,value)} change tabs改变时触发，index:当前切换到的index；value:当前切换到的value
|
|
||||||
* @example <z-tabs :list="list"></z-tabs>
|
|
||||||
*/
|
|
||||||
export default {
|
|
||||||
name: 'z-tabs',
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
currentIndex: 0,
|
|
||||||
currentSwiperIndex: 0,
|
|
||||||
bottomDotX: -1,
|
|
||||||
bottomDotXForIndex: 0,
|
|
||||||
showBottomDot: false,
|
|
||||||
shouldSetDx: true,
|
|
||||||
|
|
||||||
barCalcedWidth: 0,
|
|
||||||
pxBarWidth: 0,
|
|
||||||
scrollLeft: 0,
|
|
||||||
tabsSuperWidth: rpx2px(750),
|
|
||||||
tabsWidth: rpx2px(750),
|
|
||||||
tabsHeight: rpx2px(80),
|
|
||||||
tabsLeft: 0,
|
|
||||||
tabsContainerWidth: 0,
|
|
||||||
itemNodeInfos: [],
|
|
||||||
isFirstLoaded: false,
|
|
||||||
currentScrollLeft: 0,
|
|
||||||
changeTriggerFailed: false,
|
|
||||||
currentChanged: false
|
|
||||||
};
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
//数据源数组，支持形如['tab1','tab2']的格式或[{name:'tab1',value:1}]的格式
|
|
||||||
list: {
|
|
||||||
type: Array,
|
|
||||||
default: function() {
|
|
||||||
return [];
|
|
||||||
}
|
|
||||||
},
|
|
||||||
//当前选中的index
|
|
||||||
current: {
|
|
||||||
type: [Number, String],
|
|
||||||
default: _gc('current',0)
|
|
||||||
},
|
|
||||||
//list数组长度超过scrollCount时滚动显示(不自动铺满全屏)
|
|
||||||
scrollCount: {
|
|
||||||
type: [Number, String],
|
|
||||||
default: _gc('scrollCount',5)
|
|
||||||
},
|
|
||||||
//z-tabs样式
|
|
||||||
tabsStyle: {
|
|
||||||
type: Object,
|
|
||||||
default: function() {
|
|
||||||
return _gc('tabsStyle',{})
|
|
||||||
}
|
|
||||||
},
|
|
||||||
//自定义每个tab的宽度，默认为0，即代表根据内容自动撑开，单位rpx，支持传100、"100px"或"100rpx"
|
|
||||||
tabWidth: {
|
|
||||||
type: [Number, String],
|
|
||||||
default: _gc('tabWidth',0)
|
|
||||||
},
|
|
||||||
//滑块宽度，单位rpx，支持传100、"100px"或"100rpx"
|
|
||||||
barWidth: {
|
|
||||||
type: [Number, String],
|
|
||||||
default: _gc('barWidth',45)
|
|
||||||
},
|
|
||||||
//滑块高度，单位rpx，支持传100、"100px"或"100rpx"
|
|
||||||
barHeight: {
|
|
||||||
type: [Number, String],
|
|
||||||
default: _gc('barHeight',8)
|
|
||||||
},
|
|
||||||
//swiper的宽度，单位rpx，支持传100、"100px"或"100rpx"，默认为"750rpx"
|
|
||||||
swiperWidth: {
|
|
||||||
type: [Number, String],
|
|
||||||
default: _gc('swiperWidth',750)
|
|
||||||
},
|
|
||||||
//滑块样式，其中的width和height将被barWidth和barHeight覆盖
|
|
||||||
barStyle: {
|
|
||||||
type: Object,
|
|
||||||
default: function() {
|
|
||||||
return _gc('barStyle',{});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
//tabs与底部的间距，单位rpx，支持传100、"100px"或"100rpx"
|
|
||||||
bottomSpace: {
|
|
||||||
type: [Number, String],
|
|
||||||
default: _gc('bottomSpace',8)
|
|
||||||
},
|
|
||||||
//切换tab时滑块动画模式，与swiper联动时有效，点击切换tab时无效，必须调用setDx。默认为line，即切换tab时滑块宽度保持不变，线性运动。可选值为worm，即为类似毛毛虫蠕动效果
|
|
||||||
barAnimateMode: {
|
|
||||||
type: String,
|
|
||||||
default: _gc('barAnimateMode','line')
|
|
||||||
},
|
|
||||||
//list中item的name(标题)的key
|
|
||||||
nameKey: {
|
|
||||||
type: String,
|
|
||||||
default: _gc('nameKey','name')
|
|
||||||
},
|
|
||||||
//list中item的value的key
|
|
||||||
valueKey: {
|
|
||||||
type: String,
|
|
||||||
default: _gc('valueKey','value')
|
|
||||||
},
|
|
||||||
//激活状态tab的颜色
|
|
||||||
activeColor: {
|
|
||||||
type: String,
|
|
||||||
default: _gc('activeColor','#007AFF')
|
|
||||||
},
|
|
||||||
//未激活状态tab的颜色
|
|
||||||
inactiveColor: {
|
|
||||||
type: String,
|
|
||||||
default: _gc('inactiveColor','#666666')
|
|
||||||
},
|
|
||||||
//禁用状态tab的颜色
|
|
||||||
disabledColor: {
|
|
||||||
type: String,
|
|
||||||
default: _gc('disabledColor','#bbbbbb')
|
|
||||||
},
|
|
||||||
//激活状态tab的样式
|
|
||||||
activeStyle: {
|
|
||||||
type: Object,
|
|
||||||
default: function() {
|
|
||||||
return _gc('activeStyle',{});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
//未激活状态tab的样式
|
|
||||||
inactiveStyle: {
|
|
||||||
type: Object,
|
|
||||||
default: function() {
|
|
||||||
return _gc('inactiveStyle',{});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
//禁用状态tab的样式
|
|
||||||
disabledStyle: {
|
|
||||||
type: Object,
|
|
||||||
default: function() {
|
|
||||||
return _gc('disabledStyle',{});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
//z-tabs背景色
|
|
||||||
bgColor: {
|
|
||||||
type: String,
|
|
||||||
default: _gc('bgColor','white')
|
|
||||||
},
|
|
||||||
//徽标数最大数字限制，超过这个数字将变成badgeMaxCount+
|
|
||||||
badgeMaxCount: {
|
|
||||||
type: [Number, String],
|
|
||||||
default: _gc('badgeMaxCount',99)
|
|
||||||
},
|
|
||||||
//徽标样式，例如可自定义背景色，字体等等
|
|
||||||
badgeStyle: {
|
|
||||||
type: Object,
|
|
||||||
default: function() {
|
|
||||||
return _gc('badgeStyle',{})
|
|
||||||
}
|
|
||||||
},
|
|
||||||
//初始化时是否自动触发change事件
|
|
||||||
initTriggerChange: {
|
|
||||||
type: Boolean,
|
|
||||||
default: _gc('initTriggerChange',false)
|
|
||||||
},
|
|
||||||
//z-tabs中布局的单位，默认为rpx
|
|
||||||
unit: {
|
|
||||||
type: String,
|
|
||||||
default: _gc('unit', 'rpx')
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.updateSubviewLayout();
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
current: {
|
|
||||||
handler(newVal) {
|
|
||||||
this.currentChanged && this._lockDx();
|
|
||||||
this.currentIndex = newVal;
|
|
||||||
this._preUpdateDotPosition(this.currentIndex);
|
|
||||||
if (this.initTriggerChange) {
|
|
||||||
if (newVal < this.list.length) {
|
|
||||||
this.$emit('change', newVal, this.list[newVal][this.valueKey]);
|
|
||||||
}else {
|
|
||||||
this.changeTriggerFailed = true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
this.currentChanged = true;
|
|
||||||
},
|
|
||||||
immediate: true
|
|
||||||
},
|
|
||||||
list: {
|
|
||||||
handler(newVal) {
|
|
||||||
this._handleListChange(newVal);
|
|
||||||
},
|
|
||||||
immediate: false
|
|
||||||
},
|
|
||||||
bottomDotX(newVal) {
|
|
||||||
if(newVal >= 0){
|
|
||||||
// #ifndef APP-NVUE
|
|
||||||
this.showBottomDot = true;
|
|
||||||
// #endif
|
|
||||||
this.$nextTick(() => {
|
|
||||||
// #ifdef APP-NVUE
|
|
||||||
weexAnimation.transition(this.$refs['z-tabs-bottom-dot'], {
|
|
||||||
styles: {
|
|
||||||
transform: `translateX(${newVal}px)`
|
|
||||||
},
|
|
||||||
duration: this.showAnimate ? 200 : 0,
|
|
||||||
delay: 0
|
|
||||||
})
|
|
||||||
setTimeout(() => {
|
|
||||||
this.showBottomDot = true;
|
|
||||||
},10)
|
|
||||||
// #endif
|
|
||||||
})
|
|
||||||
}
|
|
||||||
},
|
|
||||||
finalBarWidth: {
|
|
||||||
handler(newVal) {
|
|
||||||
this.barCalcedWidth = newVal;
|
|
||||||
this.pxBarWidth = this.barCalcedWidth;
|
|
||||||
},
|
|
||||||
immediate: true
|
|
||||||
},
|
|
||||||
currentIndex: {
|
|
||||||
handler(newVal) {
|
|
||||||
this.currentSwiperIndex = newVal;
|
|
||||||
},
|
|
||||||
immediate: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
shouldScroll(){
|
|
||||||
return this.list.length > this.scrollCount;
|
|
||||||
},
|
|
||||||
finalTabsHeight(){
|
|
||||||
return this.tabsHeight;
|
|
||||||
},
|
|
||||||
tabStyle(){
|
|
||||||
const stl = this.shouldScroll ? {'flex-shrink': 0} : {'flex': 1};
|
|
||||||
if(this.finalTabWidth > 0){
|
|
||||||
stl['width'] = this.finalTabWidth + 'px';
|
|
||||||
}else{
|
|
||||||
delete stl.width;
|
|
||||||
}
|
|
||||||
return stl;
|
|
||||||
},
|
|
||||||
tabsListStyle(){
|
|
||||||
return this.shouldScroll ? {} : {'flex':1};
|
|
||||||
},
|
|
||||||
showAnimate(){
|
|
||||||
return this.isFirstLoaded && !this.shouldSetDx;
|
|
||||||
},
|
|
||||||
dotTransition(){
|
|
||||||
return this.showAnimate ? 'transform .2s linear':'none';
|
|
||||||
},
|
|
||||||
finalDotStyle(){
|
|
||||||
return {...this.barStyle, width: this.barCalcedWidth + 'px', height: this.finalBarHeight + 'px', opacity: this.showBottomDot ? 1 : 0};
|
|
||||||
},
|
|
||||||
finalTabWidth(){
|
|
||||||
return this._convertTextToPx(this.tabWidth);
|
|
||||||
},
|
|
||||||
finalBarWidth(){
|
|
||||||
return this._convertTextToPx(this._addUnit(this.barWidth, this.unit));
|
|
||||||
},
|
|
||||||
finalBarHeight(){
|
|
||||||
return this._convertTextToPx(this._addUnit(this.barHeight, this.unit));
|
|
||||||
},
|
|
||||||
finalSwiperWidth(){
|
|
||||||
return this._convertTextToPx(this.swiperWidth);
|
|
||||||
},
|
|
||||||
finalBottomSpace(){
|
|
||||||
return this._convertTextToPx(this._addUnit(this.bottomSpace, this.unit));
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
//根据swiper的@transition实时更新底部dot位置
|
|
||||||
setDx(dx) {
|
|
||||||
if (!this.shouldSetDx) return;
|
|
||||||
const isLineMode = this.barAnimateMode === 'line';
|
|
||||||
const isWormMode = this.barAnimateMode === 'worm';
|
|
||||||
let dxRate = dx / this.finalSwiperWidth;
|
|
||||||
this.currentSwiperIndex = this.currentIndex + parseInt(dxRate);
|
|
||||||
const isRight = dxRate > 0;
|
|
||||||
const barWidth = this.pxBarWidth;
|
|
||||||
if(this.currentSwiperIndex !== this.currentIndex){
|
|
||||||
dxRate = dxRate - (this.currentSwiperIndex - this.currentIndex);
|
|
||||||
const currentNode = this.itemNodeInfos[this.currentSwiperIndex];
|
|
||||||
if (!!currentNode){
|
|
||||||
this.bottomDotXForIndex = this._getBottomDotX(currentNode, barWidth);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
const currentIndex = this.currentSwiperIndex;
|
|
||||||
let nextIndex = currentIndex + (isRight ? 1 : -1);
|
|
||||||
nextIndex = Math.max(0, nextIndex);
|
|
||||||
nextIndex = Math.min(nextIndex, this.itemNodeInfos.length - 1);
|
|
||||||
const currentNodeInfo = this.itemNodeInfos[currentIndex];
|
|
||||||
const nextNodeInfo = this.itemNodeInfos[nextIndex];
|
|
||||||
const nextBottomX = this._getBottomDotX(nextNodeInfo, barWidth);
|
|
||||||
if (isLineMode){
|
|
||||||
this.bottomDotX = this.bottomDotXForIndex + (nextBottomX - this.bottomDotXForIndex) * Math.abs(dxRate);
|
|
||||||
} else if (isWormMode) {
|
|
||||||
if ((isRight && currentIndex >= this.itemNodeInfos.length - 1) || (!isRight && currentIndex <= 0)) return;
|
|
||||||
const spaceOffset = isRight ? nextNodeInfo.right - currentNodeInfo.left : currentNodeInfo.right - nextNodeInfo.left;
|
|
||||||
let barCalcedWidth = barWidth + spaceOffset * Math.abs(dxRate);
|
|
||||||
if (isRight) {
|
|
||||||
if (barCalcedWidth > nextBottomX - this.bottomDotX + barWidth) {
|
|
||||||
const barMinusWidth = barWidth + spaceOffset * (1 - dxRate);
|
|
||||||
this.bottomDotX = this.bottomDotXForIndex + (barCalcedWidth - barMinusWidth) / 2;
|
|
||||||
barCalcedWidth = barMinusWidth;
|
|
||||||
}
|
|
||||||
}else if (!isRight) {
|
|
||||||
if (barCalcedWidth > this.bottomDotXForIndex + barWidth - nextBottomX){
|
|
||||||
const barMinusWidth = barWidth + spaceOffset * (1 + dxRate);
|
|
||||||
barCalcedWidth = barMinusWidth;
|
|
||||||
this.bottomDotX = nextBottomX;
|
|
||||||
} else{
|
|
||||||
this.bottomDotX = this.bottomDotXForIndex - (barCalcedWidth - barWidth);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
barCalcedWidth = Math.max(barCalcedWidth, barWidth);
|
|
||||||
this.barCalcedWidth = barCalcedWidth;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
//在swiper的@animationfinish中通知z-tabs结束多setDx的锁定，若在父组件中调用了setDx，则必须调用unlockDx
|
|
||||||
unlockDx() {
|
|
||||||
this.$nextTick(() => {
|
|
||||||
this.shouldSetDx = true;
|
|
||||||
})
|
|
||||||
},
|
|
||||||
//更新z-tabs内部布局
|
|
||||||
updateSubviewLayout(tryCount = 0) {
|
|
||||||
this.$nextTick(() => {
|
|
||||||
let delayTime = 10;
|
|
||||||
// #ifdef APP-NVUE || MP-BAIDU
|
|
||||||
delayTime = 50;
|
|
||||||
// #endif
|
|
||||||
setTimeout(() => {
|
|
||||||
this._getNodeClientRect('.z-tabs-scroll-view-conatiner').then(res=>{
|
|
||||||
if (res){
|
|
||||||
if (!res[0].width && tryCount < 10) {
|
|
||||||
setTimeout(() => {
|
|
||||||
tryCount ++;
|
|
||||||
this.updateSubviewLayout(tryCount);
|
|
||||||
}, 50);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.tabsWidth = res[0].width;
|
|
||||||
this.tabsHeight = res[0].height;
|
|
||||||
this.tabsLeft = res[0].left;
|
|
||||||
this._handleListChange(this.list);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this._getNodeClientRect('.z-tabs-conatiner').then(res=>{
|
|
||||||
if(res && res[0].width){
|
|
||||||
this.tabsSuperWidth = res[0].width;
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},delayTime)
|
|
||||||
})
|
|
||||||
},
|
|
||||||
//点击了tabs
|
|
||||||
tabsClick(index,item) {
|
|
||||||
if (item.disabled) return;
|
|
||||||
if (this.currentIndex != index) {
|
|
||||||
this.shouldSetDx = false;
|
|
||||||
this.$emit('change', index, item[this.valueKey]);
|
|
||||||
this.currentIndex = index;
|
|
||||||
this._preUpdateDotPosition(index);
|
|
||||||
} else {
|
|
||||||
this.$emit('secondClick',index, item[this.valueKey]);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
//scroll-view滚动
|
|
||||||
scroll(e){
|
|
||||||
this.currentScrollLeft = e.detail.scrollLeft;
|
|
||||||
},
|
|
||||||
//锁定dx，用于避免在swiper被动触发滚动时候执行setDx中的代码
|
|
||||||
_lockDx() {
|
|
||||||
this.shouldSetDx = false;
|
|
||||||
},
|
|
||||||
//更新底部dot位置之前的预处理
|
|
||||||
_preUpdateDotPosition(index) {
|
|
||||||
// #ifndef APP-NVUE
|
|
||||||
this.$nextTick(() => {
|
|
||||||
uni.createSelectorQuery().in(this).select(".z-tabs-scroll-view").fields({
|
|
||||||
scrollOffset: true
|
|
||||||
}, data => {
|
|
||||||
if (data) {
|
|
||||||
this.currentScrollLeft = data.scrollLeft;
|
|
||||||
this._updateDotPosition(index);
|
|
||||||
} else {
|
|
||||||
this._updateDotPosition(index);
|
|
||||||
}
|
|
||||||
}).exec();
|
|
||||||
})
|
|
||||||
// #endif
|
|
||||||
|
|
||||||
// #ifdef APP-NVUE
|
|
||||||
this._updateDotPosition(index);
|
|
||||||
// #endif
|
|
||||||
},
|
|
||||||
//更新底部dot位置
|
|
||||||
_updateDotPosition(index){
|
|
||||||
if(index >= this.itemNodeInfos.length) return;
|
|
||||||
this.$nextTick(async ()=>{
|
|
||||||
let node = this.itemNodeInfos[index];
|
|
||||||
let offset = 0;
|
|
||||||
let tabsContainerWidth = this.tabsContainerWidth;
|
|
||||||
if (JSON.stringify(this.activeStyle) !== '{}') {
|
|
||||||
const nodeRes = await this._getNodeClientRect(`#z-tabs-item-${index}`,true);
|
|
||||||
if (nodeRes) {
|
|
||||||
node = nodeRes[0];
|
|
||||||
offset = this.currentScrollLeft;
|
|
||||||
this.tabsHeight = Math.max(node.height + rpx2px(28), this.tabsHeight);
|
|
||||||
tabsContainerWidth = 0;
|
|
||||||
for(let i = 0;i < this.itemNodeInfos.length;i++){
|
|
||||||
let oldNode = this.itemNodeInfos[i];
|
|
||||||
tabsContainerWidth += i === index ? node.width : oldNode.width;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (node) {
|
|
||||||
this.bottomDotX = this._getBottomDotX(node, this.finalBarWidth, offset);
|
|
||||||
}
|
|
||||||
this.bottomDotXForIndex = this.bottomDotX;
|
|
||||||
if (this.tabsWidth) {
|
|
||||||
setTimeout(()=>{
|
|
||||||
let scrollLeft = this.bottomDotX - this.tabsWidth / 2 + this.finalBarWidth / 2;
|
|
||||||
scrollLeft = Math.max(0,scrollLeft);
|
|
||||||
if (tabsContainerWidth) {
|
|
||||||
scrollLeft = Math.min(scrollLeft,tabsContainerWidth - this.tabsWidth + 10);
|
|
||||||
}
|
|
||||||
if (this.shouldScroll && tabsContainerWidth > this.tabsWidth) {
|
|
||||||
this.scrollLeft = scrollLeft;
|
|
||||||
}
|
|
||||||
this.$nextTick(()=>{
|
|
||||||
this.isFirstLoaded = true;
|
|
||||||
})
|
|
||||||
},200)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
// 处理list改变
|
|
||||||
_handleListChange(newVal) {
|
|
||||||
this.$nextTick(async ()=>{
|
|
||||||
if(newVal.length){
|
|
||||||
let itemNodeInfos = [];
|
|
||||||
let tabsContainerWidth = 0;
|
|
||||||
let delayTime = 0;
|
|
||||||
// #ifdef MP-BAIDU
|
|
||||||
delayTime = 100;
|
|
||||||
// #endif
|
|
||||||
setTimeout(async()=>{
|
|
||||||
for(let i = 0;i < newVal.length;i++){
|
|
||||||
const nodeRes = await this._getNodeClientRect(`#z-tabs-item-${i}`,true);
|
|
||||||
if(nodeRes){
|
|
||||||
const node = nodeRes[0];
|
|
||||||
node.left += this.currentScrollLeft;
|
|
||||||
itemNodeInfos.push(node);
|
|
||||||
tabsContainerWidth += node.width;
|
|
||||||
}
|
|
||||||
if (i === this.currentIndex){
|
|
||||||
this.itemNodeInfos = itemNodeInfos;
|
|
||||||
this.tabsContainerWidth = tabsContainerWidth;
|
|
||||||
this._updateDotPosition(this.currentIndex);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
this.itemNodeInfos = itemNodeInfos;
|
|
||||||
this.tabsContainerWidth = tabsContainerWidth;
|
|
||||||
this._updateDotPosition(this.currentIndex);
|
|
||||||
},delayTime)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
if (this.initTriggerChange && this.changeTriggerFailed && newVal.length) {
|
|
||||||
if (this.current < newVal.length) {
|
|
||||||
this.$emit('change', this.current, newVal[this.current][this.valueKey]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
//根据node获取bottomX
|
|
||||||
_getBottomDotX(node, barWidth = this.finalBarWidth, offset = 0){
|
|
||||||
return node.left + node.width / 2 - barWidth / 2 + offset - this.tabsLeft;
|
|
||||||
},
|
|
||||||
//获取节点信息
|
|
||||||
_getNodeClientRect(select, withRefArr = false) {
|
|
||||||
// #ifdef APP-NVUE
|
|
||||||
select = select.replace('.', '').replace('#', '');
|
|
||||||
const ref = withRefArr ? this.$refs[select][0] : this.$refs[select];
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
if (ref) {
|
|
||||||
weexDom.getComponentRect(ref, option => {
|
|
||||||
if (option && option.result) {
|
|
||||||
resolve([option.size]);
|
|
||||||
} else resolve(false);
|
|
||||||
})
|
|
||||||
} else resolve(false);
|
|
||||||
});
|
|
||||||
return;
|
|
||||||
// #endif
|
|
||||||
const res = uni.createSelectorQuery().in(this);
|
|
||||||
res.select(select).boundingClientRect();
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
res.exec(data => {
|
|
||||||
resolve((data && data != '' && data != undefined && data.length) ? data : false);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
//格式化badge中的count
|
|
||||||
_formatCount(count) {
|
|
||||||
if (!count) return '';
|
|
||||||
if (count > this.badgeMaxCount) {
|
|
||||||
return this.badgeMaxCount + '+';
|
|
||||||
}
|
|
||||||
return count.toString();
|
|
||||||
},
|
|
||||||
//将文本的px或者rpx转为px的值
|
|
||||||
_convertTextToPx(text) {
|
|
||||||
const dataType = Object.prototype.toString.call(text);
|
|
||||||
if (dataType === '[object Number]') {
|
|
||||||
return rpx2px(text);
|
|
||||||
}
|
|
||||||
let isRpx = false;
|
|
||||||
if (text.indexOf('rpx') !== -1 || text.indexOf('upx') !== -1) {
|
|
||||||
text = text.replace('rpx', '').replace('upx', '');
|
|
||||||
isRpx = true;
|
|
||||||
} else if (text.indexOf('px') !== -1) {
|
|
||||||
text = text.replace('px', '');
|
|
||||||
} else {
|
|
||||||
text = rpx2px(text);
|
|
||||||
}
|
|
||||||
if (!isNaN(text)) {
|
|
||||||
if (isRpx) return Number(rpx2px(text));
|
|
||||||
return Number(text);
|
|
||||||
}
|
|
||||||
return 0;
|
|
||||||
},
|
|
||||||
// 添加单位
|
|
||||||
_addUnit(value, unit) {
|
|
||||||
if (Object.prototype.toString.call(value) === '[object String]') {
|
|
||||||
let tempValue = value;
|
|
||||||
tempValue = tempValue.replace('rpx', '').replace('upx', '').replace('px', '');
|
|
||||||
if (value.indexOf('rpx') === -1 && value.indexOf('upx') === -1 && value.indexOf('px') !== -1) {
|
|
||||||
tempValue = parseFloat(tempValue) * 2;
|
|
||||||
}
|
|
||||||
value = tempValue;
|
|
||||||
}
|
|
||||||
return unit === 'rpx' ? value + 'rpx' : (value / 2) + 'px';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.z-tabs-conatiner{
|
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
overflow: hidden;
|
|
||||||
display: flex;
|
|
||||||
width: 100%;
|
|
||||||
/* #endif */
|
|
||||||
/* #ifdef APP-NVUE */
|
|
||||||
width: 750rpx;
|
|
||||||
/* #endif */
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-scroll-view-conatiner{
|
|
||||||
flex: 1;
|
|
||||||
position: relative;
|
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
display: flex;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
/* #endif */
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
.z-tabs-scroll-view ::-webkit-scrollbar {
|
|
||||||
display: none;
|
|
||||||
-webkit-appearance: none;
|
|
||||||
width: 0 !important;
|
|
||||||
height: 0 !important;
|
|
||||||
background: transparent;
|
|
||||||
}
|
|
||||||
/* #endif */
|
|
||||||
|
|
||||||
.z-tabs-scroll-view{
|
|
||||||
flex-direction: row;
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
/* #endif */
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-list-container{
|
|
||||||
position: relative;
|
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
height: 100%;
|
|
||||||
/* #endif */
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-list,.z-tabs-list-container{
|
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
display: flex;
|
|
||||||
/* #endif */
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-item{
|
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
display: flex;
|
|
||||||
/* #endif */
|
|
||||||
flex-direction: row;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
padding: 0px 20rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-item-title-container{
|
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
display: flex;
|
|
||||||
/* #endif */
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-item-title-rpx{
|
|
||||||
font-size: 30rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-item-title-px{
|
|
||||||
font-size: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-item-title-disabled{
|
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
cursor: not-allowed;
|
|
||||||
/* #endif */
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-item-badge{
|
|
||||||
background-color: #ec5b56;
|
|
||||||
color: white;
|
|
||||||
border-radius: 100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-item-badge-rpx{
|
|
||||||
margin-left: 8rpx;
|
|
||||||
font-size: 22rpx;
|
|
||||||
padding: 0rpx 10rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-item-badge-px{
|
|
||||||
margin-left: 4px;
|
|
||||||
font-size: 11px;
|
|
||||||
padding: 0px 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-bottom{
|
|
||||||
position: absolute;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-bottom-dot{
|
|
||||||
border-radius: 100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.z-tabs-left,.z-tabs-right{
|
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
display: flex;
|
|
||||||
/* #endif */
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
|
|
@ -1,83 +0,0 @@
|
||||||
{
|
|
||||||
"id": "z-tabs",
|
|
||||||
"name": "z-tabs",
|
|
||||||
"displayName": "【z-tabs】一个简单轻量的tabs组件",
|
|
||||||
"version": "0.3.0",
|
|
||||||
"description": "全平台兼容，支持nvue、vue3",
|
|
||||||
"keywords": [
|
|
||||||
"tabs"
|
|
||||||
],
|
|
||||||
"repository": "https://github.com/SmileZXLee/uni-z-tabs",
|
|
||||||
"engines": {
|
|
||||||
"HBuilderX": "^3.0.7"
|
|
||||||
},
|
|
||||||
"dcloudext": {
|
|
||||||
"sale": {
|
|
||||||
"regular": {
|
|
||||||
"price": "0.00"
|
|
||||||
},
|
|
||||||
"sourcecode": {
|
|
||||||
"price": "0.00"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"contact": {
|
|
||||||
"qq": "393727164"
|
|
||||||
},
|
|
||||||
"declaration": {
|
|
||||||
"ads": "无",
|
|
||||||
"data": "无",
|
|
||||||
"permissions": "无"
|
|
||||||
},
|
|
||||||
"npmurl": "https://www.npmjs.com/package/@zxlee/z-tabs",
|
|
||||||
"type": "component-vue"
|
|
||||||
},
|
|
||||||
"uni_modules": {
|
|
||||||
"dependencies": [],
|
|
||||||
"encrypt": [],
|
|
||||||
"platforms": {
|
|
||||||
"cloud": {
|
|
||||||
"tcb": "y",
|
|
||||||
"aliyun": "y",
|
|
||||||
"alipay": "n"
|
|
||||||
},
|
|
||||||
"client": {
|
|
||||||
"App": {
|
|
||||||
"app-vue": "y",
|
|
||||||
"app-nvue": "y"
|
|
||||||
},
|
|
||||||
"H5-mobile": {
|
|
||||||
"Safari": "y",
|
|
||||||
"Android Browser": "y",
|
|
||||||
"微信浏览器(Android)": "y",
|
|
||||||
"QQ浏览器(Android)": "y"
|
|
||||||
},
|
|
||||||
"H5-pc": {
|
|
||||||
"Chrome": "y",
|
|
||||||
"IE": "y",
|
|
||||||
"Edge": "y",
|
|
||||||
"Firefox": "y",
|
|
||||||
"Safari": "y"
|
|
||||||
},
|
|
||||||
"小程序": {
|
|
||||||
"微信": "y",
|
|
||||||
"阿里": "y",
|
|
||||||
"百度": "y",
|
|
||||||
"字节跳动": "y",
|
|
||||||
"QQ": "y",
|
|
||||||
"钉钉": "y",
|
|
||||||
"快手": "y",
|
|
||||||
"飞书": "y",
|
|
||||||
"京东": "y"
|
|
||||||
},
|
|
||||||
"快应用": {
|
|
||||||
"华为": "y",
|
|
||||||
"联盟": "y"
|
|
||||||
},
|
|
||||||
"Vue": {
|
|
||||||
"vue2": "y",
|
|
||||||
"vue3": "y"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,177 +0,0 @@
|
||||||
# z-tabs
|
|
||||||
|
|
||||||
[](https://github.com/SmileZXLee/uni-z-tabs)
|
|
||||||
[](https://en.wikipedia.org/wiki/MIT_License)
|
|
||||||
|
|
||||||
***
|
|
||||||
|
|
||||||
### 反馈qq群(点击加群)：[371624008](http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=avPmibADf2TNi4LxkIwjCE5vbfXpa-r1&authKey=dQ%2FVDAR87ONxI4b32Py%2BvmXbhnopjHN7%2FJPtdsqJdsCPFZB6zDQ17L06Uh0kITUZ&noverify=0&group_code=371624008)
|
|
||||||
|
|
||||||
***
|
|
||||||
|
|
||||||
## z-tabs文档
|
|
||||||
|
|
||||||
### 安装
|
|
||||||
|
|
||||||
#### 方式1(推荐)：通过uni_modules安装，在插件市场中点击右上角【使用HbuilderX导入插件】即可。
|
|
||||||
|
|
||||||
***
|
|
||||||
|
|
||||||
#### 方式2：通过npm安装
|
|
||||||
|
|
||||||
```bash
|
|
||||||
//若项目之前未使用npm管理依赖（项目根目录下无package.json文件），先在项目根目录执行命令初始化npm工程
|
|
||||||
npm init -y
|
|
||||||
|
|
||||||
//安装
|
|
||||||
npm install @zxlee/z-tabs --save
|
|
||||||
//更新
|
|
||||||
npm update @zxlee/z-tabs
|
|
||||||
```
|
|
||||||
|
|
||||||
然后在`pages.json`中配置`easycom`(注意：下方配置只有在使用npm安装时才需要配置！！！！！)
|
|
||||||
|
|
||||||
```json
|
|
||||||
"easycom": {
|
|
||||||
"^z-tabs": "@zxlee/z-tabs/components/z-tabs/z-tabs.vue"
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
### 基本使用
|
|
||||||
|
|
||||||
```html
|
|
||||||
<template>
|
|
||||||
<z-tabs :list="list"></z-tabs>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
list: []
|
|
||||||
}
|
|
||||||
},
|
|
||||||
onLoad() {
|
|
||||||
const list = [];
|
|
||||||
for(let i = 0;i < 10;i++) {
|
|
||||||
// list内item支持字符串或对象，下方这个是字符串
|
|
||||||
list.push('tab标题');
|
|
||||||
|
|
||||||
// 如果要展示徽标数，则list中item的数据结构应为：
|
|
||||||
list.push({
|
|
||||||
name: 'tab标题',
|
|
||||||
badge: {
|
|
||||||
// 设置徽标数为6
|
|
||||||
count: 6
|
|
||||||
},
|
|
||||||
// 可以禁用某个item
|
|
||||||
disabled: true
|
|
||||||
});
|
|
||||||
}
|
|
||||||
this.list = list;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
```
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### props
|
|
||||||
|
|
||||||
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|
|
||||||
| :------------------ | :----------------------------------------------------------- | :------------- | :------ | :----- |
|
|
||||||
| list | 数据源数组，支持形如`['tab1','tab2']`的格式或`[{name:'tab1',value:1}]`的格式 | Array | [] | - |
|
|
||||||
| current | 当前选中的index | Number\|String | 0 | - |
|
|
||||||
| scroll-count | list数组长度超过scrollCount时滚动显示(不自动铺满全屏) | Number\|String | 5 | - |
|
|
||||||
| tab-width | 自定义每个tab的宽度，默认为0，即代表根据内容自动撑开，单位rpx，支持传100、"100px"或"100rpx" | Number\|String | 0 | 0 |
|
|
||||||
| bar-width | 滑块宽度，单位rpx，支持传100、"100px"或"100rpx" | Number\|String | 45rpx | - |
|
|
||||||
| bar-height | 滑块高度，单位rpx，支持传100、"100px"或"100rpx" | Number\|String | 8rpx | - |
|
|
||||||
| bar-style | 滑块样式，其中的`width`和`height`将被`bar-width`和`bar-height`覆盖 | Object | {} | - |
|
|
||||||
| bottom-space | tabs与底部的间距，单位rpx，支持传100、"100px"或"100rpx" | Number\|String | 8rpx | - |
|
|
||||||
| bar-animate-mode | 【v0.1.5起支持】切换tab时滑块动画模式，与`swiper`联动时有效，点击切换tab时无效，必须调用`setDx`。默认为`line`，即切换tab时滑块宽度保持不变，线性运动。可选值为`worm`，即为类似毛毛虫蠕动效果 | String | line | worm |
|
|
||||||
| name-key | list中item的name(标题)的key | String | name | - |
|
|
||||||
| value-key | list中item的value的key | String | value | - |
|
|
||||||
| active-color | 激活状态tab的颜色 | String | #007AFF | - |
|
|
||||||
| inactive-color | 未激活状态tab的颜色 | String | #666666 | - |
|
|
||||||
| disabled-color | 禁用状态tab的颜色 | String | #bbbbbb | - |
|
|
||||||
| active-style | 激活状态tab的样式 | Object | {} | - |
|
|
||||||
| inactive-style | 未激活状态tab的样式 | Object | {} | - |
|
|
||||||
| disabled-style | 禁用状态tab的样式 | Object | {} | - |
|
|
||||||
| badge-max-count | 徽标数最大数字限制，超过这个数字将变成`badge-max-count`+ | Number\|String | 99 | - |
|
|
||||||
| badge-style | 徽标样式，例如可自定义背景色，字体等等 | Object | {} | - |
|
|
||||||
| bg-color | z-tabs背景色 | String | white | - |
|
|
||||||
| tabs-style | z-tabs样式 | Object | {} | - |
|
|
||||||
| init-trigger-change | 初始化时是否自动触发change事件 | Boolean | true | false |
|
|
||||||
| unit | z-tabs中布局的单位，默认为rpx | String | rpx | px |
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### events
|
|
||||||
|
|
||||||
| 事件名 | 说明 | 回调参数 |
|
|
||||||
| ------------ | -------------------- | ------------------------------------------------------------ |
|
|
||||||
| @change | tabs改变(点击)时触发 | `参数1`:index(当前切换到的index)；<br/>`参数2`:value(当前切换到的value) |
|
|
||||||
| @secondClick | tabs二次点击时触发 | `参数1`:index(当前切换到的index)；<br/>`参数2`:value(当前切换到的value) |
|
|
||||||
|
|
||||||
### methods
|
|
||||||
|
|
||||||
| 方法名 | 说明 | 参数 |
|
|
||||||
| ------------------- | ------------------------------------------------------------ | -------------------------------------- |
|
|
||||||
| setDx | 根据swiper的`@transition`实时更新底部dot位置 | swiper的`@transition`中的`e.detail.dx` |
|
|
||||||
| unlockDx | 在swiper的`@animationfinish`中通知`z-tabs`结束多`setDx`的锁定，若在父组件中调用了`setDx`，则必须调用`unlockDx` | - |
|
|
||||||
| updateSubviewLayout | 在nvue+安卓中，若在cell中使用`z-tabs`，且页面加载时cell在屏幕之外，因cell的复用机制，可能导致`z-tabs`内部的布局失效：例如底部bar无法显示，此时可在list滚动到一定区域内(例如快显示`z-tabs`)的时候调用此方法以更新其内部布局。其他情况无需调用！ | - |
|
|
||||||
|
|
||||||
### slots
|
|
||||||
|
|
||||||
| 名称 | 说明 |
|
|
||||||
| :---- | ------------ |
|
|
||||||
| left | tabs左侧插槽 |
|
|
||||||
| right | tabs右侧插槽 |
|
|
||||||
|
|
||||||
### 支持全局配置
|
|
||||||
|
|
||||||
* 在`/z-tabs/components/z-tabs/config/index.js`文件中进行配置
|
|
||||||
|
|
||||||
```js
|
|
||||||
export default {
|
|
||||||
'active-color': 'red'
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
### 【v0.1.4起支持】底部dot与swiper联动演示
|
|
||||||
|
|
||||||
```html
|
|
||||||
<template>
|
|
||||||
<z-tabs ref="tabs" :list="tabList" :current="current" @change="tabsChange" />
|
|
||||||
<swiper :current="current" @transition="swiperTransition" @animationfinish="swiperAnimationfinish">
|
|
||||||
<swiper-item class="swiper-item" v-for="(item, index) in tabList" :key="index">
|
|
||||||
xxx
|
|
||||||
</swiper-item>
|
|
||||||
</swiper>
|
|
||||||
<template>
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
tabList: ['测试1','测试2','测试3','测试4'],
|
|
||||||
current: 0, // tabs组件的current值，表示当前活动的tab选项
|
|
||||||
};
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
//tabs通知swiper切换
|
|
||||||
tabsChange(index) {
|
|
||||||
this.current = index;
|
|
||||||
},
|
|
||||||
//swiper滑动中
|
|
||||||
swiperTransition(e) {
|
|
||||||
this.$refs.tabs.setDx(e.detail.dx);
|
|
||||||
},
|
|
||||||
//swiper滑动结束
|
|
||||||
swiperAnimationfinish(e) {
|
|
||||||
this.current = e.detail.current;
|
|
||||||
this.$refs.tabs.unlockDx();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
```
|
|
||||||
Loading…
Reference in New Issue