Compare commits
30 Commits
qingdaoV0.
...
d01f153c6a
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
d01f153c6a | ||
|
|
2a5681f8e0 | ||
|
|
adc1c6ef06 | ||
|
|
09faeb3509 | ||
|
|
0d5e3024bc | ||
|
|
268648868f | ||
| 7ce14fa7e2 | |||
| 9a5bffae85 | |||
| 51e67a8c8f | |||
| 531681b74e | |||
| 7e0ec650b1 | |||
| 3a5d8ccb1a | |||
| 34bad16bf4 | |||
| f5099e9cc0 | |||
| 4295199887 | |||
|
|
7322e0854e | ||
|
|
d260e24265 | ||
|
|
c75653b7a3 | ||
|
|
805b384958 | ||
|
|
77f97892bc | ||
|
|
20191c9454 | ||
| fc2d0f90ec | |||
| 6b20c045a9 | |||
| 183c71da3c | |||
| 5e2f8ac169 | |||
| bca67b7f25 | |||
| 83a1078a4d | |||
| e4d100242b | |||
| 3eca164bde | |||
| a7d6b8709c |
@@ -472,4 +472,9 @@ html {
|
|||||||
|
|
||||||
.height-100 {
|
.height-100 {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.pointEveNone {
|
||||||
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
@@ -285,7 +285,9 @@ function deg2rad(deg) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function vacanciesTo(vacancies) {
|
function vacanciesTo(vacancies) {
|
||||||
if (vacancies >= 0) {
|
if (vacancies === null) {
|
||||||
|
return '-人'
|
||||||
|
} else if (vacancies >= 0) {
|
||||||
return vacancies + "人"
|
return vacancies + "人"
|
||||||
} else {
|
} else {
|
||||||
return '不限人数'
|
return '不限人数'
|
||||||
|
|||||||
@@ -1,17 +1,37 @@
|
|||||||
<template>
|
<template>
|
||||||
<view>{{ salaryText }}</view>
|
<view>
|
||||||
|
<view v-if="!minSalary || !maxSalary">面议</view>
|
||||||
|
<view v-else class="texts">
|
||||||
|
<text class="num">{{ minSalary / 1000 }}</text>
|
||||||
|
<text class="unit">k</text>
|
||||||
|
<text class="gap">~</text>
|
||||||
|
<text class="num">{{ maxSalary / 1000 }}</text>
|
||||||
|
<text class="unit">k</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { inject, computed } from 'vue';
|
import { inject, computed } from "vue";
|
||||||
import useDictStore from '../../stores/useDictStore';
|
import useDictStore from "../../stores/useDictStore";
|
||||||
const { minSalary, maxSalary, isMonth } = defineProps(['minSalary', 'maxSalary', 'isMonth']);
|
const { minSalary, maxSalary } = defineProps(["minSalary", "maxSalary"]);
|
||||||
|
|
||||||
const salaryText = computed(() => {
|
|
||||||
if (!minSalary || !maxSalary) return '面议';
|
|
||||||
if (isMonth) {
|
|
||||||
return `${minSalary}-${maxSalary}/月`;
|
|
||||||
}
|
|
||||||
return `${minSalary / 1000}k-${maxSalary / 1000}k`;
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.texts{
|
||||||
|
letter-spacing: 1rpx;
|
||||||
|
}
|
||||||
|
.num{
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
.unit{
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
.gap{
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
margin-left: 5rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@@ -13,6 +13,9 @@ export default {
|
|||||||
DBversion: 2,
|
DBversion: 2,
|
||||||
// 只使用本地缓寸的数据
|
// 只使用本地缓寸的数据
|
||||||
OnlyUseCachedDB: false,
|
OnlyUseCachedDB: false,
|
||||||
|
// 素质测评URL
|
||||||
|
Quality_assessment_URL: 'https://web1.isdapp.shandong.gov.cn/jmopen_files/unzip/49ee8533b31b46238906b31c27c5dfc9/zycpvhyjw/index.html#/pages/evaluation_record/evaluation_record?uuid=2',
|
||||||
|
Career_guidance: 'https://web1.isdapp.shandong.gov.cn/jmopen_files/unzip/2626f6e3c899445db8639a873d172d73/zyzd/index.html',
|
||||||
// 使用模拟定位
|
// 使用模拟定位
|
||||||
UsingSimulatedPositioning: true,
|
UsingSimulatedPositioning: true,
|
||||||
// 应用信息
|
// 应用信息
|
||||||
|
|||||||
@@ -86,8 +86,7 @@ export function usePagination(
|
|||||||
const res = await requestFn(params)
|
const res = await requestFn(params)
|
||||||
|
|
||||||
const rawData = res[dataKey]
|
const rawData = res[dataKey]
|
||||||
const total = res[totalKey] || 99999999
|
|
||||||
console.log(total, rawData)
|
|
||||||
const data = typeof transformFn === 'function' ? transformFn(rawData) : rawData
|
const data = typeof transformFn === 'function' ? transformFn(rawData) : rawData
|
||||||
|
|
||||||
if (type === 'refresh') {
|
if (type === 'refresh') {
|
||||||
@@ -96,9 +95,9 @@ export function usePagination(
|
|||||||
list.value.push(...data)
|
list.value.push(...data)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const total = res[totalKey] || list.value?.length
|
||||||
pageState.total = total
|
pageState.total = total
|
||||||
pageState.maxPage = Math.ceil(total / pageState.pageSize)
|
pageState.maxPage = Math.ceil(total / pageState.pageSize)
|
||||||
|
|
||||||
finished.value = list.value.length >= total
|
finished.value = list.value.length >= total
|
||||||
empty.value = list.value.length === 0
|
empty.value = list.value.length === 0
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
|
|||||||
@@ -31,6 +31,8 @@
|
|||||||
<script type="text/javascript" src="https://isdapp.shandong.gov.cn/jmopen/jssdk/index.js"></script>
|
<script type="text/javascript" src="https://isdapp.shandong.gov.cn/jmopen/jssdk/index.js"></script>
|
||||||
<!-- 只在内网有效 -->
|
<!-- 只在内网有效 -->
|
||||||
<script type="text/javascript" src="./static/js/SM.js"></script>
|
<script type="text/javascript" src="./static/js/SM.js"></script>
|
||||||
|
<script type="text/javascript" src="./static/js/pixi.min.js"></script>
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"><!--app-html--></div>
|
<div id="app"><!--app-html--></div>
|
||||||
|
|||||||
@@ -42,7 +42,7 @@
|
|||||||
</view>
|
</view>
|
||||||
<view class="subName">
|
<view class="subName">
|
||||||
<dict-Label class="mar_ri10" dictType="sex" :value="userInfo.sex"></dict-Label>
|
<dict-Label class="mar_ri10" dictType="sex" :value="userInfo.sex"></dict-Label>
|
||||||
<text class="mar_ri10">{{ userInfo.age }}岁</text>
|
<text class="mar_ri10">{{ userInfo.age || '-' }}岁</text>
|
||||||
<dict-Label class="mar_ri10" dictType="education" :value="userInfo.education"></dict-Label>
|
<dict-Label class="mar_ri10" dictType="education" :value="userInfo.education"></dict-Label>
|
||||||
<dict-Label
|
<dict-Label
|
||||||
class="mar_ri10"
|
class="mar_ri10"
|
||||||
@@ -50,7 +50,7 @@
|
|||||||
:value="userInfo.politicalAffiliation"
|
:value="userInfo.politicalAffiliation"
|
||||||
></dict-Label>
|
></dict-Label>
|
||||||
</view>
|
</view>
|
||||||
<view class="subName">{{ userInfo.phone }}</view>
|
<view class="subName">{{ userInfo.phone || '未知手机号' }}</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="tops-right">
|
<view class="tops-right">
|
||||||
<view class="right-imghead">
|
<view class="right-imghead">
|
||||||
|
|||||||
@@ -1,267 +1,295 @@
|
|||||||
<template>
|
<template>
|
||||||
<AppLayout title="个人信息" :sub-title="`完成度${percent}`" border back-gorund-color="#ffffff" :show-bg-image="false">
|
<AppLayout
|
||||||
<template #headerleft>
|
title="个人信息"
|
||||||
<view class="btn mar_le20 button-click" @click="navBack">取消</view>
|
:sub-title="`完成度${percent}`"
|
||||||
</template>
|
border
|
||||||
<template #headerright>
|
back-gorund-color="#ffffff"
|
||||||
<view class="btn mar_ri20 button-click" @click="confirm">确认</view>
|
:show-bg-image="false"
|
||||||
</template>
|
>
|
||||||
<view class="content">
|
<template #headerleft>
|
||||||
<view class="content-avatar">
|
<view class="btn mar_le20 button-click" @click="navBack">取消</view>
|
||||||
<view class="avatar-title">编辑头像</view>
|
</template>
|
||||||
<view @click="selectAvatar">
|
<template #headerright>
|
||||||
<image class="avatar" v-if="fromValue.avatar" :src="fromValue.avatar" />
|
<view class="btn mar_ri20 button-click" @click="confirm">确认</view>
|
||||||
<image class="avatar" v-else-if="fromValue.sex == '0'" src="@/static/icon/boy.png" />
|
</template>
|
||||||
<image class="avatar" v-else="fromValue.sex == '1'" src="@/static/icon/girl.png" />
|
<view class="content">
|
||||||
|
<view class="content-avatar">
|
||||||
|
<view class="avatar-title">编辑头像</view>
|
||||||
|
<view @click="selectAvatar">
|
||||||
|
<image class="avatar" v-if="fromValue.avatar" :src="fromValue.avatar" />
|
||||||
|
<image class="avatar" v-else-if="fromValue.sex == '0'" src="@/static/icon/boy.png" />
|
||||||
|
<image class="avatar" v-else="fromValue.sex == '1'" src="@/static/icon/girl.png" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="content-input">
|
||||||
|
<view class="input-titile">姓名</view>
|
||||||
|
<input class="input-con" v-model="fromValue.name" placeholder="请输入您的姓名" />
|
||||||
|
</view>
|
||||||
|
<view class="content-sex">
|
||||||
|
<view class="sex-titile">性别</view>
|
||||||
|
<view class="sext-ri">
|
||||||
|
<view class="sext-box" :class="{ 'sext-boxactive': fromValue.sex === 0 }" @click="changeSex(0)">
|
||||||
|
男
|
||||||
|
</view>
|
||||||
|
<view class="sext-box" :class="{ 'sext-boxactive': fromValue.sex === 1 }" @click="changeSex(1)">
|
||||||
|
女
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="content-input" @click="changeDateBirt">
|
||||||
|
<view class="input-titile">出生年月</view>
|
||||||
|
<input
|
||||||
|
class="input-con triangle pointEveNone"
|
||||||
|
v-model="fromValue.birthDate"
|
||||||
|
disabled
|
||||||
|
placeholder="请选择您的出生年月"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
<view class="content-input" @click="changeEducation">
|
||||||
|
<view class="input-titile">学历</view>
|
||||||
|
<input
|
||||||
|
class="input-con triangle pointEveNone"
|
||||||
|
v-model="state.educationText"
|
||||||
|
disabled
|
||||||
|
placeholder="请选择您的学历"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
<view class="content-input" @click="changePoliticalAffiliation">
|
||||||
|
<view class="input-titile">政治面貌</view>
|
||||||
|
<input
|
||||||
|
class="input-con triangle pointEveNone"
|
||||||
|
v-model="state.politicalAffiliationText"
|
||||||
|
disabled
|
||||||
|
placeholder="请选择您的政治面貌"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
<view class="content-input">
|
||||||
|
<view class="input-titile">手机号码</view>
|
||||||
|
<input class="input-con" v-model="fromValue.phone" placeholder="请输入您的手机号码" />
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</AppLayout>
|
||||||
<view class="content-input">
|
|
||||||
<view class="input-titile">姓名</view>
|
|
||||||
<input class="input-con" v-model="fromValue.name" placeholder="请输入您的姓名" />
|
|
||||||
</view>
|
|
||||||
<view class="content-sex">
|
|
||||||
<view class="sex-titile">性别</view>
|
|
||||||
<view class="sext-ri">
|
|
||||||
<view class="sext-box" :class="{ 'sext-boxactive': fromValue.sex === 0 }" @click="changeSex(0)"> 男 </view>
|
|
||||||
<view class="sext-box" :class="{ 'sext-boxactive': fromValue.sex === 1 }" @click="changeSex(1)"> 女 </view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="content-input" @click="changeDateBirt">
|
|
||||||
<view class="input-titile">出生年月</view>
|
|
||||||
<input class="input-con triangle" v-model="fromValue.birthDate" disabled placeholder="请选择您的出生年月" />
|
|
||||||
</view>
|
|
||||||
<view class="content-input" @click="changeEducation">
|
|
||||||
<view class="input-titile">学历</view>
|
|
||||||
<input class="input-con triangle" v-model="state.educationText" disabled placeholder="请选择您的学历" />
|
|
||||||
</view>
|
|
||||||
<view class="content-input" @click="changePoliticalAffiliation">
|
|
||||||
<view class="input-titile">政治面貌</view>
|
|
||||||
<input class="input-con triangle" v-model="state.politicalAffiliationText" disabled placeholder="请选择您的政治面貌" />
|
|
||||||
</view>
|
|
||||||
<view class="content-input">
|
|
||||||
<view class="input-titile">手机号码</view>
|
|
||||||
<input class="input-con" v-model="fromValue.phone" placeholder="请输入您的手机号码" />
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</AppLayout>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { reactive, inject, watch, ref, onMounted } from "vue";
|
import { reactive, inject, watch, ref, onMounted } from 'vue';
|
||||||
import { onLoad, onShow } from "@dcloudio/uni-app";
|
import { onLoad, onShow } from '@dcloudio/uni-app';
|
||||||
const { $api, navTo, navBack, checkingPhoneRegExp } = inject("globalFunction");
|
const { $api, navTo, navBack, checkingPhoneRegExp } = inject('globalFunction');
|
||||||
import { storeToRefs } from "pinia";
|
import { storeToRefs } from 'pinia';
|
||||||
import useUserStore from "@/stores/useUserStore";
|
import useUserStore from '@/stores/useUserStore';
|
||||||
import useDictStore from "@/stores/useDictStore";
|
import useDictStore from '@/stores/useDictStore';
|
||||||
const { userInfo } = storeToRefs(useUserStore());
|
const { userInfo } = storeToRefs(useUserStore());
|
||||||
const { getUserResume } = useUserStore();
|
const { getUserResume } = useUserStore();
|
||||||
const { dictLabel, oneDictData } = useDictStore();
|
const { dictLabel, oneDictData } = useDictStore();
|
||||||
const openSelectPopup = inject("openSelectPopup");
|
const openSelectPopup = inject('openSelectPopup');
|
||||||
|
|
||||||
const percent = ref("0%");
|
const percent = ref('0%');
|
||||||
const state = reactive({
|
const state = reactive({
|
||||||
educationText: "",
|
educationText: '',
|
||||||
politicalAffiliationText: "",
|
politicalAffiliationText: '',
|
||||||
});
|
});
|
||||||
const fromValue = reactive({
|
const fromValue = reactive({
|
||||||
name: "",
|
name: '',
|
||||||
sex: 0,
|
sex: 0,
|
||||||
birthDate: "",
|
birthDate: '',
|
||||||
education: "",
|
education: '',
|
||||||
politicalAffiliation: "",
|
politicalAffiliation: '',
|
||||||
avatar: "",
|
avatar: '',
|
||||||
});
|
});
|
||||||
onLoad(() => {
|
onLoad(() => {
|
||||||
initLoad();
|
initLoad();
|
||||||
// setTimeout(() => {
|
// setTimeout(() => {
|
||||||
// const { age, birthDate } = useUserStore().userInfo;
|
// const { age, birthDate } = useUserStore().userInfo;
|
||||||
// const newAge = calculateAge(birthDate);
|
// const newAge = calculateAge(birthDate);
|
||||||
// // 计算年龄是否对等
|
// // 计算年龄是否对等
|
||||||
// if (age != newAge) {
|
// if (age != newAge) {
|
||||||
// completeResume();
|
// completeResume();
|
||||||
// }
|
// }
|
||||||
// }, 1000);
|
// }, 1000);
|
||||||
});
|
});
|
||||||
|
|
||||||
function initLoad() {
|
function initLoad() {
|
||||||
fromValue.name = userInfo.value.name;
|
fromValue.name = userInfo.value.name;
|
||||||
fromValue.sex = Number(userInfo.value.sex);
|
fromValue.sex = Number(userInfo.value.sex);
|
||||||
fromValue.phone = userInfo.value.phone;
|
fromValue.phone = userInfo.value.phone;
|
||||||
fromValue.birthDate = userInfo.value.birthDate;
|
fromValue.birthDate = userInfo.value.birthDate;
|
||||||
fromValue.education = userInfo.value.education;
|
fromValue.education = userInfo.value.education;
|
||||||
fromValue.politicalAffiliation = userInfo.value.politicalAffiliation;
|
fromValue.politicalAffiliation = userInfo.value.politicalAffiliation;
|
||||||
fromValue.avatar = userInfo.value.avatar;
|
fromValue.avatar = userInfo.value.avatar;
|
||||||
// 回显
|
// 回显
|
||||||
state.educationText = dictLabel("education", userInfo.value.education);
|
state.educationText = dictLabel('education', userInfo.value.education);
|
||||||
state.politicalAffiliationText = dictLabel("affiliation", userInfo.value.politicalAffiliation);
|
state.politicalAffiliationText = dictLabel('affiliation', userInfo.value.politicalAffiliation);
|
||||||
const result = getFormCompletionPercent(fromValue);
|
const result = getFormCompletionPercent(fromValue);
|
||||||
percent.value = result;
|
percent.value = result;
|
||||||
}
|
}
|
||||||
const confirm = () => {
|
const confirm = () => {
|
||||||
if (!fromValue.name) {
|
if (!fromValue.name) {
|
||||||
return $api.msg("请输入姓名");
|
return $api.msg('请输入姓名');
|
||||||
}
|
}
|
||||||
if (!fromValue.birthDate) {
|
if (!fromValue.birthDate) {
|
||||||
return $api.msg("请选择出生年月");
|
return $api.msg('请选择出生年月');
|
||||||
}
|
}
|
||||||
if (!fromValue.education) {
|
if (!fromValue.education) {
|
||||||
return $api.msg("请选择学历");
|
return $api.msg('请选择学历');
|
||||||
}
|
}
|
||||||
if (!fromValue.politicalAffiliation) {
|
if (!fromValue.politicalAffiliation) {
|
||||||
return $api.msg("请选择政治面貌");
|
return $api.msg('请选择政治面貌');
|
||||||
}
|
}
|
||||||
// if (!checkingPhoneRegExp(fromValue.phone)) {
|
// if (!checkingPhoneRegExp(fromValue.phone)) {
|
||||||
// return $api.msg('请输入正确手机号');
|
// return $api.msg('请输入正确手机号');
|
||||||
// }
|
// }
|
||||||
const params = {
|
const params = {
|
||||||
...fromValue,
|
...fromValue,
|
||||||
age: calculateAge(fromValue.birthDate),
|
age: calculateAge(fromValue.birthDate),
|
||||||
};
|
};
|
||||||
$api.createRequest("/app/user/resume", params, "post").then((resData) => {
|
$api.createRequest('/app/user/resume', params, 'post').then((resData) => {
|
||||||
$api.msg("完成");
|
$api.msg('完成');
|
||||||
state.disbleDate = true;
|
state.disbleDate = true;
|
||||||
getUserResume().then(() => {
|
getUserResume().then(() => {
|
||||||
navBack();
|
navBack();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const changeDateBirt = () => {
|
const changeDateBirt = () => {
|
||||||
const datearray = generateDatePickerArrays();
|
const datearray = generateDatePickerArrays();
|
||||||
const defaultIndex = getDatePickerIndexes(fromValue.birthDate);
|
let defaultIndex = [0, 0, 0];
|
||||||
openSelectPopup({
|
if (fromValue.birthDate) {
|
||||||
title: "年龄段",
|
const defaultIndex = getDatePickerIndexes(fromValue.birthDate);
|
||||||
maskClick: true,
|
}
|
||||||
data: datearray,
|
console.log(defaultIndex);
|
||||||
defaultIndex,
|
openSelectPopup({
|
||||||
success: (_, value) => {
|
title: '年龄段',
|
||||||
const [year, month, day] = value;
|
maskClick: true,
|
||||||
const dateStr = `${year.value}-${month.value}-${day.value}`;
|
data: datearray,
|
||||||
if (isValidDate(dateStr)) {
|
defaultIndex,
|
||||||
fromValue.birthDate = dateStr;
|
success: (_, value) => {
|
||||||
} else {
|
const [year, month, day] = value;
|
||||||
$api.msg("没有这一天");
|
const dateStr = `${year.value}-${month.value}-${day.value}`;
|
||||||
}
|
if (isValidDate(dateStr)) {
|
||||||
},
|
fromValue.birthDate = dateStr;
|
||||||
});
|
} else {
|
||||||
|
$api.msg('没有这一天');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
});
|
||||||
};
|
};
|
||||||
const changeEducation = () => {
|
const changeEducation = () => {
|
||||||
openSelectPopup({
|
openSelectPopup({
|
||||||
title: "学历",
|
title: '学历',
|
||||||
maskClick: true,
|
maskClick: true,
|
||||||
data: [oneDictData("education")],
|
data: [oneDictData('education')],
|
||||||
success: (_, [value]) => {
|
success: (_, [value]) => {
|
||||||
fromValue.education = value.value;
|
fromValue.education = value.value;
|
||||||
state.educationText = value.label;
|
state.educationText = value.label;
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
const changeSex = (sex) => {
|
const changeSex = (sex) => {
|
||||||
fromValue.sex = sex;
|
fromValue.sex = sex;
|
||||||
};
|
};
|
||||||
|
|
||||||
const changePoliticalAffiliation = () => {
|
const changePoliticalAffiliation = () => {
|
||||||
openSelectPopup({
|
openSelectPopup({
|
||||||
title: "政治面貌",
|
title: '政治面貌',
|
||||||
maskClick: true,
|
maskClick: true,
|
||||||
data: [oneDictData("affiliation")],
|
data: [oneDictData('affiliation')],
|
||||||
success: (_, [value]) => {
|
success: (_, [value]) => {
|
||||||
fromValue.politicalAffiliation = value.value;
|
fromValue.politicalAffiliation = value.value;
|
||||||
state.politicalAffiliationText = value.label;
|
state.politicalAffiliationText = value.label;
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
function generateDatePickerArrays(startYear = 1975, endYear = new Date().getFullYear()) {
|
function generateDatePickerArrays(startYear = 1975, endYear = new Date().getFullYear()) {
|
||||||
const years = [];
|
const years = [];
|
||||||
const months = [];
|
const months = [];
|
||||||
const days = [];
|
const days = [];
|
||||||
|
|
||||||
for (let y = startYear; y <= endYear; y++) {
|
for (let y = startYear; y <= endYear; y++) {
|
||||||
years.push(y.toString());
|
years.push(y.toString());
|
||||||
}
|
}
|
||||||
for (let m = 1; m <= 12; m++) {
|
for (let m = 1; m <= 12; m++) {
|
||||||
months.push(m.toString().padStart(2, "0"));
|
months.push(m.toString().padStart(2, '0'));
|
||||||
}
|
}
|
||||||
for (let d = 1; d <= 31; d++) {
|
for (let d = 1; d <= 31; d++) {
|
||||||
days.push(d.toString().padStart(2, "0"));
|
days.push(d.toString().padStart(2, '0'));
|
||||||
}
|
}
|
||||||
|
|
||||||
return [years, months, days];
|
return [years, months, days];
|
||||||
}
|
}
|
||||||
|
|
||||||
function isValidDate(dateString) {
|
function isValidDate(dateString) {
|
||||||
const [year, month, day] = dateString.split("-").map(Number);
|
const [year, month, day] = dateString.split('-').map(Number);
|
||||||
|
|
||||||
const date = new Date(year, month - 1, day); // 月份从0开始
|
const date = new Date(year, month - 1, day); // 月份从0开始
|
||||||
return date.getFullYear() === year && date.getMonth() === month - 1 && date.getDate() === day;
|
return date.getFullYear() === year && date.getMonth() === month - 1 && date.getDate() === day;
|
||||||
}
|
}
|
||||||
|
|
||||||
const calculateAge = (birthDate) => {
|
const calculateAge = (birthDate) => {
|
||||||
const birth = new Date(birthDate);
|
const birth = new Date(birthDate);
|
||||||
const today = new Date();
|
const today = new Date();
|
||||||
let age = today.getFullYear() - birth.getFullYear();
|
let age = today.getFullYear() - birth.getFullYear();
|
||||||
const monthDiff = today.getMonth() - birth.getMonth();
|
const monthDiff = today.getMonth() - birth.getMonth();
|
||||||
const dayDiff = today.getDate() - birth.getDate();
|
const dayDiff = today.getDate() - birth.getDate();
|
||||||
|
|
||||||
// 如果生日的月份还没到,或者刚到生日月份但当天还没过,则年龄减 1
|
// 如果生日的月份还没到,或者刚到生日月份但当天还没过,则年龄减 1
|
||||||
if (monthDiff < 0 || (monthDiff === 0 && dayDiff < 0)) {
|
if (monthDiff < 0 || (monthDiff === 0 && dayDiff < 0)) {
|
||||||
age--;
|
age--;
|
||||||
}
|
}
|
||||||
|
|
||||||
return age;
|
return age;
|
||||||
};
|
};
|
||||||
|
|
||||||
function getFormCompletionPercent(form) {
|
function getFormCompletionPercent(form) {
|
||||||
let total = Object.keys(form).length;
|
let total = Object.keys(form).length;
|
||||||
let filled = 0;
|
let filled = 0;
|
||||||
|
|
||||||
for (const key in form) {
|
for (const key in form) {
|
||||||
const value = form[key];
|
const value = form[key];
|
||||||
if (value !== "" && value !== null && value !== undefined) {
|
if (value !== '' && value !== null && value !== undefined) {
|
||||||
if (typeof value === "number") {
|
if (typeof value === 'number') {
|
||||||
filled += 1;
|
filled += 1;
|
||||||
} else if (typeof value === "string" && value.trim() !== "") {
|
} else if (typeof value === 'string' && value.trim() !== '') {
|
||||||
filled += 1;
|
filled += 1;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
if (total === 0) return "0%";
|
if (total === 0) return '0%';
|
||||||
const percent = (filled / total) * 100;
|
const percent = (filled / total) * 100;
|
||||||
return percent.toFixed(0) + "%"; // 取整,不要小数点
|
return percent.toFixed(0) + '%'; // 取整,不要小数点
|
||||||
}
|
}
|
||||||
// 主函数
|
// 主函数
|
||||||
function getDatePickerIndexes(dateStr) {
|
function getDatePickerIndexes(dateStr) {
|
||||||
const [year, month, day] = dateStr.split("-");
|
const [year, month, day] = dateStr.split('-');
|
||||||
|
|
||||||
const [years, months, days] = generateDatePickerArrays();
|
const [years, months, days] = generateDatePickerArrays();
|
||||||
|
|
||||||
const yearIndex = years.indexOf(year);
|
const yearIndex = years.indexOf(year);
|
||||||
const monthIndex = months.indexOf(month);
|
const monthIndex = months.indexOf(month);
|
||||||
const dayIndex = days.indexOf(day);
|
const dayIndex = days.indexOf(day);
|
||||||
|
|
||||||
return [yearIndex, monthIndex, dayIndex];
|
return [yearIndex, monthIndex, dayIndex];
|
||||||
}
|
}
|
||||||
|
|
||||||
function selectAvatar() {
|
function selectAvatar() {
|
||||||
uni.chooseImage({
|
uni.chooseImage({
|
||||||
sizeType: ["original", "compressed"],
|
sizeType: ['original', 'compressed'],
|
||||||
sourceType: ["album", "camera"],
|
sourceType: ['album', 'camera'],
|
||||||
count: 1,
|
count: 1,
|
||||||
success: ({ tempFilePaths, tempFiles }) => {
|
success: ({ tempFilePaths, tempFiles }) => {
|
||||||
$api
|
$api.uploadFile(tempFilePaths[0], true)
|
||||||
.uploadFile(tempFilePaths[0], true)
|
.then((res) => {
|
||||||
.then((res) => {
|
res = JSON.parse(res);
|
||||||
res = JSON.parse(res);
|
if (res.msg) fromValue.avatar = res.msg;
|
||||||
if (res.msg) fromValue.avatar = res.msg;
|
})
|
||||||
})
|
.catch((err) => {
|
||||||
.catch((err) => {
|
$api.msg('上传失败');
|
||||||
$api.msg("上传失败");
|
});
|
||||||
});
|
},
|
||||||
},
|
fail: (error) => {},
|
||||||
fail: (error) => {},
|
});
|
||||||
});
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -59,10 +59,10 @@ const pages = reactive({
|
|||||||
year: 0,
|
year: 0,
|
||||||
month: 0,
|
month: 0,
|
||||||
});
|
});
|
||||||
|
|
||||||
const hasZphDateArray = ref([]);
|
const hasZphDateArray = ref([]);
|
||||||
|
|
||||||
onLoad((options) => {
|
onLoad((options) => {
|
||||||
|
updateDateArray();
|
||||||
if (options.date) {
|
if (options.date) {
|
||||||
current.value = {
|
current.value = {
|
||||||
date: options?.date || null,
|
date: options?.date || null,
|
||||||
|
|||||||
@@ -1,108 +1,117 @@
|
|||||||
<template>
|
<template>
|
||||||
<AppLayout title="电子名片" title-color="#FFFFFF" back-gorund-color="#F4F4F4">
|
<AppLayout title="电子名片" title-color="#FFFFFF" back-gorund-color="#F4F4F4">
|
||||||
<template #headerleft>
|
<template #headerleft>
|
||||||
<view class="btn">
|
<view class="btn">
|
||||||
<image src="@/static/icon/back-white.png" @click="navBack"></image>
|
<image src="@/static/icon/back-white.png" @click="navBack"></image>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
<view class="mys-container">
|
<view class="mys-container">
|
||||||
<!-- 个人信息 -->
|
<!-- 个人信息 -->
|
||||||
<view class="card-top btn-feel">
|
<view class="card-top btn-feel">
|
||||||
<view class="info">
|
<view class="info">
|
||||||
<view class="avatar">
|
<view class="avatar">
|
||||||
<image v-if="userInfo.avatar" :src="userInfo.avatar"></image>
|
<image v-if="userInfo.avatar" :src="userInfo.avatar"></image>
|
||||||
<image v-else-if="userInfo.sex == '0'" src="@/static/icon/boy.png"></image>
|
<image v-else-if="userInfo.sex == '0'" src="@/static/icon/boy.png"></image>
|
||||||
<image v-else src="@/static/icon/girl.png"></image>
|
<image v-else src="@/static/icon/girl.png"></image>
|
||||||
</view>
|
</view>
|
||||||
<view class="info-right">
|
<view class="info-right">
|
||||||
<view class="name">{{ userInfo.name || "编辑用户名" }}</view>
|
<view class="name">{{ userInfo.name || '编辑用户名' }}</view>
|
||||||
<view class="des">
|
<view class="des">
|
||||||
<dict-Label class="mar_ri10" dictType="sex" :value="userInfo.sex"></dict-Label>
|
<dict-Label class="mar_ri10" dictType="sex" :value="userInfo.sex"></dict-Label>
|
||||||
<text class="mar_ri10">|</text>
|
<text class="mar_ri10">|</text>
|
||||||
<text class="mar_ri10">{{ userInfo.age }}岁</text>
|
<text class="mar_ri10">{{ userInfo.age || '-' }}岁</text>
|
||||||
<text class="mar_ri10">|</text>
|
<text class="mar_ri10">|</text>
|
||||||
<dict-Label class="mar_ri10" dictType="education" :value="userInfo.education"></dict-Label>
|
<dict-Label class="mar_ri10" dictType="education" :value="userInfo.education"></dict-Label>
|
||||||
<!-- <text class="mar_ri10">|</text>
|
<!-- <text class="mar_ri10">|</text>
|
||||||
<dict-Label class="mar_ri10" dictType="affiliation" :value="userInfo.politicalAffiliation"></dict-Label> -->
|
<dict-Label class="mar_ri10" dictType="affiliation" :value="userInfo.politicalAffiliation"></dict-Label> -->
|
||||||
</view>
|
</view>
|
||||||
<view class="phone">
|
<view class="phone">
|
||||||
<image class="call-icon" src="@/static/icon/call.png" />
|
<image class="call-icon" src="@/static/icon/call.png" />
|
||||||
<view>{{ userInfo.phone }}</view>
|
<view>{{ userInfo.phone || '未知手机号' }}</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="info-bottom">
|
<view class="info-bottom">
|
||||||
<!-- <view>到岗:2025-11-02</view> -->
|
<!-- <view>到岗:2025-11-02</view> -->
|
||||||
<view></view>
|
<view></view>
|
||||||
<view>地点:青岛市-<dict-Label dictType="area" :value="Number(userInfo.area)"></dict-Label></view>
|
<view>
|
||||||
</view>
|
地点:青岛市-
|
||||||
<view class="des-card" style="margin-top: 24rpx">
|
<dict-Label dictType="area" :value="Number(userInfo.area)"></dict-Label>
|
||||||
<view class="fl_box fl_justbet">
|
</view>
|
||||||
<view style="white-space:nowrap">求职意向岗位</view>
|
</view>
|
||||||
<view class="line_1" style="padding-left:40rpx" >{{ userInfo.jobIntention || userInfo.jobTitle?.join(',') || '-' }}</view>
|
<view class="des-card" style="margin-top: 24rpx">
|
||||||
</view>
|
<view class="fl_box fl_justbet">
|
||||||
<view class="fl_box fl_justbet">
|
<view style="white-space: nowrap">求职意向岗位</view>
|
||||||
<view>毕业学校</view>
|
<view class="line_1" style="padding-left: 40rpx">
|
||||||
<view>{{ userInfo.graduationSchool || "-" }}</view>
|
{{ userInfo.jobIntention || userInfo.jobTitle?.join(',') || '--' }}
|
||||||
</view>
|
</view>
|
||||||
<!-- <view class="fl_box fl_justbet">
|
</view>
|
||||||
|
<view class="fl_box fl_justbet">
|
||||||
|
<view>毕业学校</view>
|
||||||
|
<view>{{ userInfo.graduationSchool || '--' }}</view>
|
||||||
|
</view>
|
||||||
|
<!-- <view class="fl_box fl_justbet">
|
||||||
<view>当前状态</view>
|
<view>当前状态</view>
|
||||||
<view>在职 看工作机会</view>
|
<view>在职 看工作机会</view>
|
||||||
</view> -->
|
</view> -->
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="card btn-feel">
|
<view class="card btn-feel">
|
||||||
<view class="title">
|
<view class="title">
|
||||||
<image class="bg" src="@/static/icon/title-bg.png" />
|
<image class="bg" src="@/static/icon/title-bg.png" />
|
||||||
<view class="text">个人技能</view>
|
<view class="text">个人技能</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="skill-box">
|
<view class="skill-box">
|
||||||
<view class="skill-item" v-for="item in userInfo?.skillList" :key="item.id">{{ item.skill }}</view>
|
<view class="skill-item" v-for="item in userInfo?.skillList" :key="item.id">{{ item.skill }}</view>
|
||||||
</view>
|
</view>
|
||||||
<view v-if="!userInfo?.skillList?.length" class="empty-box">
|
<view v-if="!userInfo?.skillList?.length" class="empty-box">
|
||||||
<image class="img" src="@/static/icon/empty.png" mode="widthFix"></image>
|
<image class="img" src="@/static/icon/empty.png" mode="widthFix"></image>
|
||||||
<view class="content">暂无个人技能</view>
|
<view class="content">暂无个人技能</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="card btn-feel">
|
<view class="card btn-feel">
|
||||||
<view class="title">
|
<view class="title">
|
||||||
<image class="bg" src="@/static/icon/title-bg.png" />
|
<image class="bg" src="@/static/icon/title-bg.png" />
|
||||||
<view class="text">关键经历</view>
|
<view class="text">关键经历</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="exp-box">
|
<view class="exp-box">
|
||||||
<view class="exp-item" v-for="(item, index) in userInfo?.workExp" :key="item.id">{{ index + 1 + "." }}{{ item.duty }}</view>
|
<view class="exp-item" v-for="(item, index) in userInfo?.workExp" :key="item.id">
|
||||||
</view>
|
{{ index + 1 + '.' }}{{ item.duty }}
|
||||||
<view v-if="!userInfo?.workExp?.length" class="empty-box">
|
</view>
|
||||||
<image class="img" src="@/static/icon/empty.png" mode="widthFix"></image>
|
</view>
|
||||||
<view class="content">暂无关键经历</view>
|
<view v-if="!userInfo?.workExp?.length" class="empty-box">
|
||||||
</view>
|
<image class="img" src="@/static/icon/empty.png" mode="widthFix"></image>
|
||||||
</view>
|
<view class="content">暂无关键经历</view>
|
||||||
<view class="card btn-feel">
|
</view>
|
||||||
<view class="title">
|
</view>
|
||||||
<image class="bg" src="@/static/icon/title-bg.png" />
|
<view class="card btn-feel">
|
||||||
<view class="text">荣誉及证书情况</view>
|
<view class="title">
|
||||||
</view>
|
<image class="bg" src="@/static/icon/title-bg.png" />
|
||||||
|
<view class="text">荣誉及证书情况</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
<ul class="certificate-box">
|
<ul class="certificate-box">
|
||||||
<li class="certificate-item" v-for="(item, index) in userInfo?.certificateList" :key="item.id">{{ item.name }}</li>
|
<li class="certificate-item" v-for="(item, index) in userInfo?.certificateList" :key="item.id">
|
||||||
</ul>
|
{{ item.name }}
|
||||||
<view v-if="!userInfo?.certificateList?.length" class="empty-box">
|
</li>
|
||||||
<image class="img" src="@/static/icon/empty.png" mode="widthFix"></image>
|
</ul>
|
||||||
<view class="content">暂无荣誉证书</view>
|
<view v-if="!userInfo?.certificateList?.length" class="empty-box">
|
||||||
|
<image class="img" src="@/static/icon/empty.png" mode="widthFix"></image>
|
||||||
|
<view class="content">暂无荣誉证书</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</AppLayout>
|
||||||
</view>
|
|
||||||
</AppLayout>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { reactive, inject, watch, ref, onMounted, computed } from "vue";
|
import { reactive, inject, watch, ref, onMounted, computed } from 'vue';
|
||||||
const { $api, navTo, navBack } = inject("globalFunction");
|
const { $api, navTo, navBack } = inject('globalFunction');
|
||||||
import { onLoad, onShow } from "@dcloudio/uni-app";
|
import { onLoad, onShow } from '@dcloudio/uni-app';
|
||||||
import { storeToRefs } from "pinia";
|
import { storeToRefs } from 'pinia';
|
||||||
import useUserStore from "@/stores/useUserStore";
|
import useUserStore from '@/stores/useUserStore';
|
||||||
import useDictStore from "@/stores/useDictStore";
|
import useDictStore from '@/stores/useDictStore';
|
||||||
const { userInfo } = storeToRefs(useUserStore());
|
const { userInfo } = storeToRefs(useUserStore());
|
||||||
const { getUserResume } = useUserStore();
|
const { getUserResume } = useUserStore();
|
||||||
const { getDictData, oneDictData } = useDictStore();
|
const { getDictData, oneDictData } = useDictStore();
|
||||||
@@ -110,157 +119,160 @@ const { getDictData, oneDictData } = useDictStore();
|
|||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.btn {
|
.btn {
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
width: 60rpx;
|
|
||||||
height: 60rpx;
|
|
||||||
image {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.card-top {
|
|
||||||
width: 100%;
|
|
||||||
border-radius: 8rpx;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.9));
|
|
||||||
}
|
|
||||||
.card {
|
|
||||||
width: 100%;
|
|
||||||
border-radius: 8rpx;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background: #fff;
|
|
||||||
padding: 24rpx;
|
|
||||||
margin-top: 24rpx;
|
|
||||||
.title {
|
|
||||||
position: relative;
|
|
||||||
.bg {
|
|
||||||
width: 108rpx;
|
|
||||||
height: 16rpx;
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
bottom: 0;
|
|
||||||
}
|
|
||||||
.text {
|
|
||||||
margin-left: 20rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
font-weight: bold;
|
|
||||||
color: #333;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.skill-box {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
gap: 16rpx;
|
|
||||||
margin-top: 24rpx;
|
|
||||||
.skill-item {
|
|
||||||
padding: 8rpx 20rpx;
|
|
||||||
font-size: 24rpx;
|
|
||||||
color: #333;
|
|
||||||
background: #e7f1ff;
|
|
||||||
border-radius: 8rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.exp-box {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
gap: 24rpx;
|
|
||||||
margin-top: 24rpx;
|
|
||||||
.exp-item {
|
|
||||||
font-size: 26rpx;
|
|
||||||
color: #333;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.certificate-box {
|
|
||||||
margin-top: 24rpx;
|
|
||||||
padding-inline-start: 40rpx !important;
|
|
||||||
.certificate-item {
|
|
||||||
font-size: 26rpx;
|
|
||||||
color: #333;
|
|
||||||
margin-bottom: 24rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
image {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.mys-container {
|
|
||||||
padding: 28rpx;
|
|
||||||
.info {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: 24rpx;
|
|
||||||
.avatar {
|
|
||||||
width: 160rpx;
|
|
||||||
height: 160rpx;
|
|
||||||
margin-right: 24rpx;
|
|
||||||
image{
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.info-right {
|
|
||||||
height: 160rpx;
|
|
||||||
flex: 1;
|
|
||||||
overflow: hidden;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: space-between;
|
|
||||||
.name {
|
|
||||||
font-size: 40rpx;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
.des {
|
|
||||||
font-size: 26rpx;
|
|
||||||
color: #999999;
|
|
||||||
}
|
|
||||||
.phone {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
font-size: 26rpx;
|
|
||||||
color: #999999;
|
|
||||||
.call-icon {
|
|
||||||
width: 24rpx;
|
|
||||||
height: 24rpx;
|
|
||||||
margin-right: 5rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.info-bottom {
|
|
||||||
background: linear-gradient(to right, #91b6ff, #87afff, #b7adff);
|
|
||||||
border-radius: 0 0 8rpx 8rpx;
|
|
||||||
padding: 12rpx 24rpx;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
font-size: 26rpx;
|
width: 60rpx;
|
||||||
color: #333;
|
height: 60rpx;
|
||||||
}
|
image {
|
||||||
.des-card {
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.card-top {
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.9));
|
||||||
|
}
|
||||||
|
.card {
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: #fff;
|
||||||
padding: 24rpx;
|
padding: 24rpx;
|
||||||
font-size: 26rpx;
|
margin-top: 24rpx;
|
||||||
color: #666;
|
.title {
|
||||||
display: flex;
|
position: relative;
|
||||||
flex-direction: column;
|
.bg {
|
||||||
gap: 12rpx;
|
width: 108rpx;
|
||||||
}
|
height: 16rpx;
|
||||||
.empty-box {
|
position: absolute;
|
||||||
padding: 80rpx;
|
left: 0;
|
||||||
display: flex;
|
bottom: 0;
|
||||||
flex-direction: column;
|
}
|
||||||
align-items: center;
|
.text {
|
||||||
justify-content: center;
|
margin-left: 20rpx;
|
||||||
.img {
|
font-size: 30rpx;
|
||||||
width: 100%;
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.content {
|
}
|
||||||
margin-top: 24rpx;
|
.skill-box {
|
||||||
font-size: 30rpx;
|
display: flex;
|
||||||
color: #666;
|
flex-wrap: wrap;
|
||||||
|
gap: 16rpx;
|
||||||
|
margin-top: 24rpx;
|
||||||
|
.skill-item {
|
||||||
|
padding: 8rpx 20rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #333;
|
||||||
|
background: #e7f1ff;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.exp-box {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 24rpx;
|
||||||
|
margin-top: 24rpx;
|
||||||
|
.exp-item {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.certificate-box {
|
||||||
|
margin-top: 24rpx;
|
||||||
|
padding-inline-start: 40rpx !important;
|
||||||
|
.certificate-item {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #333;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.mys-container {
|
||||||
|
padding: 28rpx;
|
||||||
|
.info {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 24rpx;
|
||||||
|
.avatar {
|
||||||
|
background: #e8e8e8;
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
width: 160rpx;
|
||||||
|
height: 160rpx;
|
||||||
|
margin-right: 24rpx;
|
||||||
|
image {
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.info-right {
|
||||||
|
height: 160rpx;
|
||||||
|
flex: 1;
|
||||||
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
.name {
|
||||||
|
font-size: 40rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.des {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #999999;
|
||||||
|
}
|
||||||
|
.phone {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #999999;
|
||||||
|
.call-icon {
|
||||||
|
width: 24rpx;
|
||||||
|
height: 24rpx;
|
||||||
|
margin-right: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.info-bottom {
|
||||||
|
background: linear-gradient(to right, #91b6ff, #87afff, #b7adff);
|
||||||
|
border-radius: 0 0 8rpx 8rpx;
|
||||||
|
padding: 12rpx 24rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
.des-card {
|
||||||
|
padding: 24rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #666;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 12rpx;
|
||||||
|
}
|
||||||
|
.empty-box {
|
||||||
|
padding: 80rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
.img {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
margin-top: 24rpx;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -94,7 +94,7 @@
|
|||||||
<view class="card-footer">内容简介:{{ item.zphjj }}</view>
|
<view class="card-footer">内容简介:{{ item.zphjj }}</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<empty v-if="!fairList.length"></empty>
|
<empty v-if="!fairList.length" content="暂时没有结果,下一天也许就有惊喜"></empty>
|
||||||
</scroll-view>
|
</scroll-view>
|
||||||
</view>
|
</view>
|
||||||
<!-- <Tabbar :currentpage="1"></Tabbar> -->
|
<!-- <Tabbar :currentpage="1"></Tabbar> -->
|
||||||
|
|||||||
371
pages/index/components/AIMatch.vue
Normal file
@@ -0,0 +1,371 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container" id="pixi-box" ref="pixiContainerRef"></view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { onMounted, onUnmounted, ref, nextTick } from 'vue';
|
||||||
|
const emit = defineEmits(['tag-click']);
|
||||||
|
|
||||||
|
// DOM Ref
|
||||||
|
const pixiContainerRef = ref(null);
|
||||||
|
|
||||||
|
// PIXI 变量
|
||||||
|
let app = null;
|
||||||
|
let tagsContainer = null;
|
||||||
|
let activeTagInstances = [];
|
||||||
|
|
||||||
|
// 配置数据
|
||||||
|
const mockTags = [
|
||||||
|
{ name: '医生', bgColor: 0x0069fe, fontColor: 0xffffff, size: 17, opacity: 1.0, angle: 0, radius: 0 },
|
||||||
|
{
|
||||||
|
name: '工程师',
|
||||||
|
bgColor: 0x87e2ec,
|
||||||
|
fontColor: 0xffffff,
|
||||||
|
size: 14,
|
||||||
|
opacity: 1,
|
||||||
|
angle: -Math.PI / 2,
|
||||||
|
radius: 68,
|
||||||
|
tailRotation: Math.PI / 2,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '建筑师',
|
||||||
|
bgColor: 0xffebeb,
|
||||||
|
tailColor: 0xffe1e1,
|
||||||
|
fontColor: 0xff6969,
|
||||||
|
size: 11.5,
|
||||||
|
opacity: 1,
|
||||||
|
angle: -Math.PI / 4.2,
|
||||||
|
radius: 125,
|
||||||
|
tailRotation: (3 * Math.PI) / 4,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '律师',
|
||||||
|
bgColor: 0x21ea85,
|
||||||
|
fontColor: 0xffffff,
|
||||||
|
size: 15,
|
||||||
|
opacity: 1,
|
||||||
|
angle: -Math.PI / 10,
|
||||||
|
radius: 130,
|
||||||
|
tailRotation: (3 * Math.PI) / 4,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '记者',
|
||||||
|
bgColor: 0xebf3ff,
|
||||||
|
tailColor: 0xb9d3ff,
|
||||||
|
fontColor: 0x1d71ef,
|
||||||
|
size: 12,
|
||||||
|
opacity: 1,
|
||||||
|
angle: Math.PI / 120,
|
||||||
|
radius: 130,
|
||||||
|
tailRotation: (3 * Math.PI) / 3.4,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '程序员',
|
||||||
|
bgColor: 0xffd4b6,
|
||||||
|
fontColor: 0xffffff,
|
||||||
|
size: 14,
|
||||||
|
opacity: 1,
|
||||||
|
angle: Math.PI / 7,
|
||||||
|
radius: 120,
|
||||||
|
tailRotation: (5 * Math.PI) / 4,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '摄影师',
|
||||||
|
bgColor: 0xd8e5fe,
|
||||||
|
tailColor: 0xb9d3ff,
|
||||||
|
fontColor: 0x1d71ef,
|
||||||
|
size: 11,
|
||||||
|
opacity: 1,
|
||||||
|
angle: Math.PI / 3,
|
||||||
|
radius: 79,
|
||||||
|
tailRotation: (3 * Math.PI) / 2,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '设计师',
|
||||||
|
bgColor: 0xff9400,
|
||||||
|
fontColor: 0xffffff,
|
||||||
|
size: 14,
|
||||||
|
opacity: 1,
|
||||||
|
angle: (2 * Math.PI) / 3,
|
||||||
|
radius: 92,
|
||||||
|
tailRotation: (7 * Math.PI) / 4,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '心理咨询师',
|
||||||
|
bgColor: 0xebf3ff,
|
||||||
|
tailColor: 0xb9d3ff,
|
||||||
|
fontColor: 0x1d71ef,
|
||||||
|
size: 10.5,
|
||||||
|
opacity: 1,
|
||||||
|
angle: (5.4 * Math.PI) / 6,
|
||||||
|
radius: 110,
|
||||||
|
tailRotation:(3 * Math.PI) /1.78,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '护士',
|
||||||
|
bgColor: 0xff6969,
|
||||||
|
fontColor: 0xffffff,
|
||||||
|
size: 15,
|
||||||
|
opacity: 1,
|
||||||
|
angle: (6.3 * Math.PI) / 5.9,
|
||||||
|
radius: 110,
|
||||||
|
tailRotation: Math.PI / 4,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '会计',
|
||||||
|
bgColor: 0xfce9c9,
|
||||||
|
fontColor: 0xfbc55f,
|
||||||
|
size: 13,
|
||||||
|
opacity: 1,
|
||||||
|
angle: (7.2 * Math.PI) / 5.9,
|
||||||
|
radius: 120,
|
||||||
|
tailRotation: Math.PI / 4,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
await nextTick();
|
||||||
|
setTimeout(() => {
|
||||||
|
initPixi();
|
||||||
|
}, 100);
|
||||||
|
window.addEventListener('resize', handleResize);
|
||||||
|
});
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
window.removeEventListener('resize', handleResize);
|
||||||
|
if (app) {
|
||||||
|
app.destroy(true, { children: true, texture: true, baseTexture: true });
|
||||||
|
app = null;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const getContainerDOM = () => {
|
||||||
|
const refVal = pixiContainerRef.value;
|
||||||
|
if (!refVal) return document.getElementById('pixi-box');
|
||||||
|
if (refVal.$el) return refVal.$el;
|
||||||
|
return refVal;
|
||||||
|
};
|
||||||
|
|
||||||
|
const clamp = (num, min, max) => Math.min(Math.max(num, min), max);
|
||||||
|
|
||||||
|
const initPixi = () => {
|
||||||
|
const container = getContainerDOM();
|
||||||
|
if (!container) return;
|
||||||
|
|
||||||
|
const width = container.clientWidth || 300;
|
||||||
|
const height = container.clientHeight || 300;
|
||||||
|
|
||||||
|
if (app) return;
|
||||||
|
|
||||||
|
app = new PIXI.Application({
|
||||||
|
width: width,
|
||||||
|
height: height,
|
||||||
|
backgroundAlpha: 0,
|
||||||
|
backgroundColor: 0xf5f7fa,
|
||||||
|
antialias: true,
|
||||||
|
resolution: window.devicePixelRatio || 1,
|
||||||
|
autoDensity: true,
|
||||||
|
});
|
||||||
|
app.view.style.touchAction = 'auto';
|
||||||
|
|
||||||
|
container.appendChild(app.view);
|
||||||
|
|
||||||
|
tagsContainer = new PIXI.Container();
|
||||||
|
app.stage.addChild(tagsContainer);
|
||||||
|
|
||||||
|
renderScene(width, height);
|
||||||
|
};
|
||||||
|
|
||||||
|
const renderScene = (sw, sh) => {
|
||||||
|
tagsContainer.removeChildren();
|
||||||
|
activeTagInstances = [];
|
||||||
|
|
||||||
|
const baseSize = 375;
|
||||||
|
const scaleFactor = (Math.min(sw, sh) / baseSize) * 0.9;
|
||||||
|
|
||||||
|
mockTags.forEach((data, index) => {
|
||||||
|
const scaledRadius = data.radius * (scaleFactor < 1 ? 1 : scaleFactor * 0.8);
|
||||||
|
|
||||||
|
let x = sw / 2 + scaledRadius * Math.cos(data.angle);
|
||||||
|
let y = sh / 2 + scaledRadius * Math.sin(data.angle);
|
||||||
|
|
||||||
|
const tag = createTag(data, index);
|
||||||
|
|
||||||
|
tagsContainer.addChild(tag);
|
||||||
|
|
||||||
|
const safeW = tag.width / 2 + 10;
|
||||||
|
const safeH = tag.height / 2 + 10;
|
||||||
|
|
||||||
|
// 强制修正 x 和 y,使其不超出屏幕
|
||||||
|
x = clamp(x, safeW, sw - safeW);
|
||||||
|
y = clamp(y, safeH, sh - safeH);
|
||||||
|
|
||||||
|
tag.x = x;
|
||||||
|
tag.y = y;
|
||||||
|
|
||||||
|
// 4. 保存元数据
|
||||||
|
tag.userData = {
|
||||||
|
originalX: x,
|
||||||
|
originalY: y,
|
||||||
|
angle: data.angle,
|
||||||
|
radius: scaledRadius,
|
||||||
|
floatOffset: Math.random() * Math.PI * 2,
|
||||||
|
floatSpeed: 0.01 + Math.random() * 0.02,
|
||||||
|
floatRange: 2 + Math.random() * 2,
|
||||||
|
safeH: safeH,
|
||||||
|
};
|
||||||
|
|
||||||
|
if (data.radius > 0) {
|
||||||
|
const tail = createCometTail( data.tailColor || data.bgColor, data.tailRotation, tag.width);
|
||||||
|
tag.addChildAt(tail, 0);
|
||||||
|
tag.updateTail = () => tail.updateAnim();
|
||||||
|
}
|
||||||
|
|
||||||
|
activeTagInstances.push(tag);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 动画循环
|
||||||
|
app.ticker.add(() => {
|
||||||
|
const screenH = app.screen.height;
|
||||||
|
|
||||||
|
activeTagInstances.forEach((tag) => {
|
||||||
|
const meta = tag.userData;
|
||||||
|
if (meta) {
|
||||||
|
// 计算新的浮动位置
|
||||||
|
meta.floatOffset += meta.floatSpeed;
|
||||||
|
let nextY = meta.originalY + Math.sin(meta.floatOffset) * meta.floatRange;
|
||||||
|
|
||||||
|
// 再次进行边界检查
|
||||||
|
if (nextY < meta.safeH) nextY = meta.safeH;
|
||||||
|
if (nextY > screenH - meta.safeH) nextY = screenH - meta.safeH;
|
||||||
|
|
||||||
|
tag.y = nextY;
|
||||||
|
|
||||||
|
if (tag.updateTail) tag.updateTail();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const createTag = (tagData, index) => {
|
||||||
|
const tagGroup = new PIXI.Container();
|
||||||
|
tagGroup.eventMode = 'static';
|
||||||
|
tagGroup.cursor = 'pointer';
|
||||||
|
|
||||||
|
tagGroup.on('pointertap', () => emit('tag-click', tagData));
|
||||||
|
|
||||||
|
const text = new PIXI.Text(tagData.name, {
|
||||||
|
fontFamily: ['PingFang SC', 'Microsoft YaHei', 'Arial'],
|
||||||
|
fontSize: tagData.size,
|
||||||
|
fill: tagData.fontColor,
|
||||||
|
padding: 4,
|
||||||
|
resolution: 2,
|
||||||
|
});
|
||||||
|
text.anchor.set(0.5);
|
||||||
|
|
||||||
|
const paddingH = 26;
|
||||||
|
const paddingV = 10;
|
||||||
|
let bgWidth = text.width + paddingH;
|
||||||
|
let bgHeight = text.height + paddingV;
|
||||||
|
|
||||||
|
if (index === 0) bgWidth = Math.max(bgWidth, tagData.size * 4.5);
|
||||||
|
|
||||||
|
const bg = new PIXI.Graphics();
|
||||||
|
bg.beginFill(tagData.bgColor, tagData.opacity ?? 1);
|
||||||
|
bg.drawRoundedRect(-bgWidth / 2, -bgHeight / 2, bgWidth, bgHeight, bgHeight / 2);
|
||||||
|
bg.endFill();
|
||||||
|
|
||||||
|
tagGroup.addChild(bg);
|
||||||
|
tagGroup.addChild(text);
|
||||||
|
|
||||||
|
return tagGroup;
|
||||||
|
};
|
||||||
|
|
||||||
|
const createCometTail = (bgColor, tailRotation, parentWidth) => {
|
||||||
|
const tailGroup = new PIXI.Container();
|
||||||
|
const graphics = new PIXI.Graphics();
|
||||||
|
tailGroup.addChild(graphics);
|
||||||
|
|
||||||
|
const baseLength = 45;
|
||||||
|
const startWidth = parentWidth * 0.6;
|
||||||
|
const endWidth = 20;
|
||||||
|
|
||||||
|
let breathPhase = Math.random() * Math.PI * 2;
|
||||||
|
const breathSpeed = 0.04;
|
||||||
|
|
||||||
|
tailGroup.updateAnim = () => {
|
||||||
|
breathPhase += breathSpeed;
|
||||||
|
const breathScale = 0.85 + 0.15 * Math.sin(breathPhase);
|
||||||
|
graphics.clear();
|
||||||
|
const currentLength = baseLength * breathScale;
|
||||||
|
|
||||||
|
const cos = Math.cos(tailRotation);
|
||||||
|
const sin = Math.sin(tailRotation);
|
||||||
|
const perpX = -sin;
|
||||||
|
const perpY = cos;
|
||||||
|
|
||||||
|
const p1 = { x: perpX * (startWidth / 2), y: perpY * (startWidth / 2) };
|
||||||
|
const p2 = { x: -perpX * (startWidth / 2), y: -perpY * (startWidth / 2) };
|
||||||
|
const endCX = cos * currentLength;
|
||||||
|
const endCY = sin * currentLength;
|
||||||
|
const p3 = { x: endCX - perpX * (endWidth / 2), y: endCY - perpY * (endWidth / 2) };
|
||||||
|
const p4 = { x: endCX + perpX * (endWidth / 2), y: endCY + perpY * (endWidth / 2) };
|
||||||
|
|
||||||
|
const segments = 8;
|
||||||
|
for (let i = 0; i < segments; i++) {
|
||||||
|
const t1 = i / segments;
|
||||||
|
const t2 = (i + 1) / segments;
|
||||||
|
const alpha = 0.4 * (1 - t1);
|
||||||
|
const sp1 = { x: p1.x + (p4.x - p1.x) * t1, y: p1.y + (p4.y - p1.y) * t1 };
|
||||||
|
const sp2 = { x: p2.x + (p3.x - p2.x) * t1, y: p2.y + (p3.y - p2.y) * t1 };
|
||||||
|
const ep1 = { x: p1.x + (p4.x - p1.x) * t2, y: p1.y + (p4.y - p1.y) * t2 };
|
||||||
|
const ep2 = { x: p2.x + (p3.x - p2.x) * t2, y: p2.y + (p3.y - p2.y) * t2 };
|
||||||
|
graphics.beginFill(bgColor, alpha);
|
||||||
|
graphics.moveTo(sp1.x, sp1.y);
|
||||||
|
graphics.lineTo(sp2.x, sp2.y);
|
||||||
|
graphics.lineTo(ep2.x, ep2.y);
|
||||||
|
graphics.lineTo(ep1.x, ep1.y);
|
||||||
|
graphics.endFill();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
tailGroup.updateAnim();
|
||||||
|
return tailGroup;
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleResize = () => {
|
||||||
|
const container = getContainerDOM();
|
||||||
|
if (!app || !container) return;
|
||||||
|
|
||||||
|
const w = container.clientWidth || 300;
|
||||||
|
const h = container.clientHeight || 300;
|
||||||
|
|
||||||
|
app.renderer.resize(w, h);
|
||||||
|
|
||||||
|
activeTagInstances.forEach((tag) => {
|
||||||
|
const meta = tag.userData;
|
||||||
|
if (!meta) return;
|
||||||
|
|
||||||
|
let newX = w / 2 + meta.radius * Math.cos(meta.angle);
|
||||||
|
let newY = h / 2 + meta.radius * Math.sin(meta.angle);
|
||||||
|
|
||||||
|
const safeW = tag.width / 2 + 10;
|
||||||
|
const safeH = tag.height / 2 + 10;
|
||||||
|
|
||||||
|
meta.originalX = clamp(newX, safeW, w - safeW);
|
||||||
|
meta.originalY = clamp(newY, safeH, h - safeH);
|
||||||
|
meta.safeH = safeH; // 更新安全高度
|
||||||
|
|
||||||
|
tag.x = meta.originalX;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.container {
|
||||||
|
width: 100%;
|
||||||
|
height: 500rpx;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
color: #b9d3ff;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -148,14 +148,14 @@
|
|||||||
<!-- 筛选 -->
|
<!-- 筛选 -->
|
||||||
<select-filter ref="selectFilterModel"></select-filter>
|
<select-filter ref="selectFilterModel"></select-filter>
|
||||||
|
|
||||||
<!-- <view class="maskFristEntry" v-if="maskFristEntry">
|
<view class="maskFristEntry" v-if="maskFristEntry">
|
||||||
<view class="entry-content">
|
<view class="entry-content">
|
||||||
<text class="text1">左滑查看视频</text>
|
<text class="text1">左滑查看视频</text>
|
||||||
<text class="text2">左滑查看视频</text>
|
<text class="text2">左滑查看视频</text>
|
||||||
<view class="goExperience">去体验</view>
|
<view class="goExperience">去体验</view>
|
||||||
<view class="maskFristEntry-Close" @click="closeFristEntry">1</view>
|
<view class="maskFristEntry-Close" @click="closeFristEntry">1</view>
|
||||||
</view>
|
</view>
|
||||||
</view> -->
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -183,7 +183,7 @@ const waterfallsFlowRef = ref(null);
|
|||||||
const loadmoreRef = ref(null);
|
const loadmoreRef = ref(null);
|
||||||
const conditionSearch = ref({});
|
const conditionSearch = ref({});
|
||||||
const waterfallcolumn = ref(2);
|
const waterfallcolumn = ref(2);
|
||||||
const maskFristEntry = ref(false);
|
const maskFristEntry = ref(true);
|
||||||
const state = reactive({
|
const state = reactive({
|
||||||
tabIndex: 'all',
|
tabIndex: 'all',
|
||||||
});
|
});
|
||||||
|
|||||||
1401
pages/index/components/index-refactor.vue
Normal file
@@ -35,7 +35,6 @@
|
|||||||
ref="waterfallsFlowRef"
|
ref="waterfallsFlowRef"
|
||||||
:column="columnCount"
|
:column="columnCount"
|
||||||
:columnSpace="columnSpace"
|
:columnSpace="columnSpace"
|
||||||
@loaded="imageloaded"
|
|
||||||
:value="list"
|
:value="list"
|
||||||
>
|
>
|
||||||
<template v-slot:default="job">
|
<template v-slot:default="job">
|
||||||
@@ -94,7 +93,7 @@ const state = reactive({
|
|||||||
// 响应式搜索条件(可以被修改)
|
// 响应式搜索条件(可以被修改)
|
||||||
const searchParams = ref({});
|
const searchParams = ref({});
|
||||||
const pageSize = ref(10);
|
const pageSize = ref(10);
|
||||||
const { list, loading, refresh, loadMore } = usePagination(
|
const { list, loading, refresh, loadMore,finished } = usePagination(
|
||||||
(params) => $api.createRequest('/app/job/littleVideo', params),
|
(params) => $api.createRequest('/app/job/littleVideo', params),
|
||||||
dataToImg, // 转换函数
|
dataToImg, // 转换函数
|
||||||
{
|
{
|
||||||
@@ -106,10 +105,25 @@ const { list, loading, refresh, loadMore } = usePagination(
|
|||||||
},
|
},
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
watch(()=>finished.value, (newVal) => {
|
||||||
|
if (newVal) {
|
||||||
|
// 确保瀑布流组件知道数据已加载完成
|
||||||
|
loadmoreRef.value?.change('noMore')
|
||||||
|
}else{
|
||||||
|
loadmoreRef.value?.change('more')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
function imageloaded() {
|
// function imageloaded() {
|
||||||
loadmoreRef.value?.change('more');
|
// nextTick(() => {
|
||||||
}
|
// console.log('触发',finished.value)
|
||||||
|
// if (finished.value) {
|
||||||
|
// loadmoreRef.value?.change('noMore')
|
||||||
|
// } else {
|
||||||
|
// loadmoreRef.value?.change('more')
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
|
||||||
const { columnCount, columnSpace } = useColumnCount(() => {
|
const { columnCount, columnSpace } = useColumnCount(() => {
|
||||||
pageSize.value = 10 * (columnCount.value - 1);
|
pageSize.value = 10 * (columnCount.value - 1);
|
||||||
|
|||||||
@@ -60,11 +60,13 @@
|
|||||||
import { reactive, inject, watch, ref, onMounted } from 'vue';
|
import { reactive, inject, watch, ref, onMounted } from 'vue';
|
||||||
import Tabbar from '@/components/tabbar/midell-box.vue';
|
import Tabbar from '@/components/tabbar/midell-box.vue';
|
||||||
import { onLoad, onShow } from '@dcloudio/uni-app';
|
import { onLoad, onShow } from '@dcloudio/uni-app';
|
||||||
|
import IndexRefactor from './components/index-refactor.vue';
|
||||||
import IndexOne from './components/index-one.vue';
|
import IndexOne from './components/index-one.vue';
|
||||||
import IndexTwo from './components/index-two.vue';
|
import IndexTwo from './components/index-two.vue';
|
||||||
const loadedMap = reactive([false, false]);
|
const loadedMap = reactive([false, false]);
|
||||||
const swiperRefs = [ref(null), ref(null)];
|
const swiperRefs = [ref(null), ref(null)];
|
||||||
const components = [IndexOne, IndexTwo];
|
// const components = [IndexOne, IndexTwo];
|
||||||
|
const components = [IndexRefactor, IndexTwo];
|
||||||
import { storeToRefs } from 'pinia';
|
import { storeToRefs } from 'pinia';
|
||||||
import { useReadMsg } from '@/stores/useReadMsg';
|
import { useReadMsg } from '@/stores/useReadMsg';
|
||||||
const { unreadCount } = storeToRefs(useReadMsg());
|
const { unreadCount } = storeToRefs(useReadMsg());
|
||||||
|
|||||||
@@ -312,8 +312,8 @@ function complete() {
|
|||||||
<style lang="stylus" scoped>
|
<style lang="stylus" scoped>
|
||||||
.backdoor{
|
.backdoor{
|
||||||
position: fixed;
|
position: fixed;
|
||||||
left: 0;
|
left: 24rpx;
|
||||||
bottom: 300rpx;
|
top: 10rpx;
|
||||||
}
|
}
|
||||||
.input-nx
|
.input-nx
|
||||||
position: relative
|
position: relative
|
||||||
|
|||||||
@@ -280,6 +280,7 @@ function chooseFileUploadTest(pam) {}
|
|||||||
overflow: hidden
|
overflow: hidden
|
||||||
border-radius: 50%
|
border-radius: 50%
|
||||||
margin-right: 22rpx;
|
margin-right: 22rpx;
|
||||||
|
background: #e8e8e8;
|
||||||
.userindo-head-img
|
.userindo-head-img
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<scroll-view scroll-y class="main-scroll">
|
<scroll-view scroll-y class="main-scroll">
|
||||||
<view class="scrollmain">
|
<view v-if="msgList.length" class="scrollmain">
|
||||||
<view
|
<view
|
||||||
class="list-card press-button"
|
class="list-card press-button"
|
||||||
v-for="(item, index) in msgList"
|
v-for="(item, index) in msgList"
|
||||||
@@ -38,6 +38,7 @@
|
|||||||
</view>
|
</view>
|
||||||
<empty v-if="!msgList.length"></empty>
|
<empty v-if="!msgList.length"></empty>
|
||||||
</view>
|
</view>
|
||||||
|
<empty v-else pdTop="200" content="暂无消息~"></empty>
|
||||||
</scroll-view>
|
</scroll-view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<scroll-view scroll-y class="main-scroll">
|
<scroll-view scroll-y class="main-scroll">
|
||||||
<view class="scrollmain">
|
<view v-if="unreadMsgList.length" class="scrollmain">
|
||||||
<view
|
<view
|
||||||
class="list-card press-button"
|
class="list-card press-button"
|
||||||
v-for="(item, index) in unreadMsgList"
|
v-for="(item, index) in unreadMsgList"
|
||||||
@@ -36,6 +36,7 @@
|
|||||||
</view>
|
</view>
|
||||||
<empty v-if="!unreadMsgList.length"></empty>
|
<empty v-if="!unreadMsgList.length"></empty>
|
||||||
</view>
|
</view>
|
||||||
|
<empty v-else pdTop="200" content="暂无消息~"></empty>
|
||||||
</scroll-view>
|
</scroll-view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
BIN
static/icon/add-circle.png
Normal file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
static/icon/ai-card-bg.png
Normal file
|
After Width: | Height: | Size: 20 KiB |
BIN
static/icon/bottom-card-bg.png
Normal file
|
After Width: | Height: | Size: 15 KiB |
BIN
static/icon/flame3.png
Normal file
|
After Width: | Height: | Size: 987 B |
BIN
static/icon/index-robot.png
Normal file
|
After Width: | Height: | Size: 32 KiB |
BIN
static/icon/index-search.png
Normal file
|
After Width: | Height: | Size: 683 B |
BIN
static/icon/index-text-bg.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
static/icon/index-text-bg2.png
Normal file
|
After Width: | Height: | Size: 5.3 KiB |
BIN
static/icon/item-bg-img1.png
Normal file
|
After Width: | Height: | Size: 22 KiB |
BIN
static/icon/item-bg-img2.png
Normal file
|
After Width: | Height: | Size: 11 KiB |
BIN
static/icon/item-bg-img3.png
Normal file
|
After Width: | Height: | Size: 9.7 KiB |
BIN
static/icon/item-bg-text.png
Normal file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
static/icon/leart-gold.png
Normal file
|
After Width: | Height: | Size: 778 B |
BIN
static/icon/match-card-bg.png
Normal file
|
After Width: | Height: | Size: 85 KiB |
BIN
static/icon/pintDate2.png
Normal file
|
After Width: | Height: | Size: 514 B |
BIN
static/icon/polygon-down.png
Normal file
|
After Width: | Height: | Size: 295 B |
BIN
static/icon/position-icon.png
Normal file
|
After Width: | Height: | Size: 555 B |
BIN
static/icon/top-card-bg.png
Normal file
|
After Width: | Height: | Size: 18 KiB |
BIN
static/icon/video-mask.png
Normal file
|
After Width: | Height: | Size: 226 KiB |
BIN
static/icon/work-img1.png
Normal file
|
After Width: | Height: | Size: 5.7 KiB |
BIN
static/icon/work-img2.png
Normal file
|
After Width: | Height: | Size: 5.7 KiB |
1108
static/js/pixi.min.js
vendored
Normal file
@@ -3,7 +3,7 @@
|
|||||||
<view
|
<view
|
||||||
v-for="(item, index) in data.column"
|
v-for="(item, index) in data.column"
|
||||||
:key="index"
|
:key="index"
|
||||||
class="waterfalls-flow-column"
|
class="waterfalls-flow-column "
|
||||||
:id="`waterfalls_flow_column_${index + 1}`"
|
:id="`waterfalls_flow_column_${index + 1}`"
|
||||||
:msg="msg"
|
:msg="msg"
|
||||||
:style="{ width: w, 'margin-left': index == 0 ? 0 : m }"
|
:style="{ width: w, 'margin-left': index == 0 ? 0 : m }"
|
||||||
|
|||||||