sdz/ks-app-employment-service
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

flat: 修改字体和添加图标

Browse Source
This commit is contained in:
史典卓
2025-07-09 15:15:37 +08:00
parent 36798d3054
commit 645c2552f6
45 changed files with 518 additions and 164 deletions
Download Patch File Download Diff File Expand all files Collapse all files

293
pages/index/components/index-one.vue
View File

@@ -95,14 +95,29 @@
<dict-Label dictType="experience" :value="job.experience"></dict-Label>
</view>
</view>
<view class="falls-card-company">{{ job.companyName }}</view>
<view class="falls-card-company">
青岛
<dict-Label dictType="area" :value="job.jobLocationAreaCode"></dict-Label>
</view>
<view class="falls-card-pepleNumber">
<view>{{ job.postingDate || '发布日期' }}</view>
<view>{{ vacanciesTo(job.vacancies) }}</view>
<view>
<image class="point2" src="/static/icon/pintDate.png"></image>
<view class="fl_1">
{{ job.postingDate || '发布日期' }}
</view>
</view>
<view>
<image class="point3" src="/static/icon/pointpeople.png"></image>
<view class="fl_1">
{{ vacanciesTo(job.vacancies) }}
</view>
</view>
</view>
<view class="falls-card-company2">
<image class="point3" src="/static/icon/point3.png"></image>
<view class="fl_1">
{{ job.companyName }}
</view>
</view>
<!-- <view class="falls-card-matchingrate">
<view class=""><matchingDegree :job="job"></matchingDegree></view>
@@ -133,13 +148,14 @@
<!-- 筛选 -->
<select-filter ref="selectFilterModel"></select-filter>
<view class="maskFristEntry" v-if="maskFristEntry">
<!-- <view class="maskFristEntry" v-if="maskFristEntry">
<view class="entry-content">
<text>左滑查看视频</text>
<image class="indicateArrow" src="/static/gif/indicateArrow.gif"></image>
<text class="text1">左滑查看视频</text>
<text class="text2">左滑查看视频</text>
<view class="goExperience">去体验</view>
<view class="maskFristEntry-Close" @click="closeFristEntry">1</view>
</view>
<view class="maskFristEntry-Close" @click="closeFristEntry"></view>
</view>
</view> -->
</view>
</template>
@@ -191,23 +207,6 @@ const rangeOptions = ref([
{ value: 2, text: '最新发布' },
]);
const isLoaded = ref(false);
// const jobList = ref([
// { name: '销售顾问', highlight: true },
// { name: '销售管理', highlight: true },
// { name: '销售工程师', highlight: true },
// { name: '算法工程师', highlight: false },
// { name: '生产经理', highlight: false },
// { name: '市场策划', highlight: false },
// { name: '商务服务', highlight: false },
// { name: '客服', highlight: false },
// { name: '创意总监', highlight: false },
// ]);
onLoad(() => {
// 判断浏览器是否有 fristEntry 第一次进入
let fristEntry = uni.getStorageSync('fristEntry') || true; // 默认未读
maskFristEntry.value = fristEntry;
});
const { columnCount, columnSpace } = useColumnCount(() => {
pageState.pageSize = 10 * (columnCount.value - 1);
@@ -218,15 +217,6 @@ const { columnCount, columnSpace } = useColumnCount(() => {
});
});
function closeFristEntry() {
uni.setStorageSync('fristEntry', false);
maskFristEntry.value = false;
}
// onLoad(() => {
// getJobRecommend('refresh');
// });
async function loadData() {
try {
if (isLoaded.value) return;
@@ -461,50 +451,84 @@ defineExpose({ loadData });
</script>
<style lang="stylus" scoped>
.maskFristEntry
position: fixed;
right: 20rpx;
bottom: calc(50% - 200rpx);
// background: rgba(0,0,0,0.3)
.entry-content
display: flex;
align-items: center
text
font-size: 36rpx
background: linear-gradient(273.34deg, #356CFA 3.58%, #A47FFD 85.84%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text; /* 有些浏览器兼容用 */
text-fill-color: transparent;
.indicateArrow
height: 76rpx
width: 68rpx
.maskFristEntry-Close
position: absolute;
left: calc(50% - 10rpx);
top: 86rpx
width: 42rpx
height: 42rpx
background: linear-gradient(273.34deg, #356CFA 3.58%, #A47FFD 85.84%);
border-radius: 50%;
.maskFristEntry-Close::before
position: absolute;
left: calc( 50% - 2rpx)
top: calc( 50% - 10rpx)
transform: rotate(45deg);
content: ''
background: #FFFFFF
width: 4rpx
height: 20rpx
.maskFristEntry-Close::after
position: absolute;
left: calc( 50% - 2rpx)
top: calc( 50% - 10rpx)
transform: rotate(-45deg);
content: ''
background: #FFFFFF
width: 4rpx
height: 20rpx
// .maskFristEntry
// position: fixed;
// // right: 20rpx;
// // bottom: calc(50% - 200rpx);
// height: 100vh
// width: 100vw
// background: rgba(0,0,0,0.3)
// .entry-content
// display: flex;
// align-items: center
// position: absolute
// left: 50%
// top: 40%
// transform: translate(-50%, -50%)
// flex-direction: column
// background: url('@/static/imgs/fristEntry.png') 0 0 no-repeat;
// background-size: 100% 100%;
// width: 480rpx
// height: 584rpx
// // padding-left: 80rpx
// .text1
// margin-top: 370rpx
// font-size: 36rpx
// background: linear-gradient(273.34deg, #356CFA 3.58%, #A47FFD 85.84%);
// -webkit-background-clip: text;
// -webkit-text-fill-color: transparent;
// background-clip: text; /* 有些浏览器兼容用 */
// text-fill-color: transparent;
// padding-left: 28rpx
// .text2
// padding-left: 28rpx
// margin-top: 8rpx
// font-size: 20rpx;
// color: #666666;
// text-align: center;
// .indicateArrow
// height: 76rpx
// width: 68rpx
// .indicatefristEntry
// width: 244rpx
// height: 244rpx
// .goExperience
// margin-left: 28rpx
// margin-top: 28rpx
// width: 160rpx;
// height: 60rpx;
// background: linear-gradient( 180deg, #9974FD 0%, #286BFA 100%);
// border-radius: 12rpx 12rpx 12rpx 12rpx;
// font-size: 28rpx;
// color: #FFFFFF;
// text-align: center;
// line-height: 60rpx
// .maskFristEntry-Close
// position: absolute;
// left: calc(50% - 10rpx);
// bottom: -130rpx
// width: 42rpx
// height: 42rpx
// background: linear-gradient(273.34deg, #356CFA 3.58%, #A47FFD 85.84%);
// border-radius: 50%;
// .maskFristEntry-Close::before
// position: absolute;
// left: calc( 50% - 2rpx)
// top: calc( 50% - 10rpx)
// transform: rotate(45deg);
// content: ''
// background: #FFFFFF
// width: 4rpx
// height: 20rpx
// .maskFristEntry-Close::after
// position: absolute;
// left: calc( 50% - 2rpx)
// top: calc( 50% - 10rpx)
// transform: rotate(-45deg);
// content: ''
// background: #FFFFFF
// width: 4rpx
// height: 20rpx
.app-container
@@ -545,6 +569,7 @@ defineExpose({ loadData });
color: #B5B5B5;
width: 100%
.chart
font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif;
width: 170rpx;
background: radial-gradient( 0% 56% at 87% 61%, rgba(255,255,255,0.82) 0%, rgba(255,255,255,0.47) 100%);
box-shadow: 0rpx 8rpx 40rpx 0rpx rgba(210,210,210,0.14);
@@ -568,6 +593,7 @@ defineExpose({ loadData });
border-radius: 16rpx 16rpx 16rpx 16rpx;
border: 2rpx solid #FFFFFF;
.card-title
font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif;
font-weight: 600;
font-size: 32rpx;
color: #000000;
@@ -589,6 +615,7 @@ defineExpose({ loadData });
.nav-filter
padding: 16rpx 28rpx 0 28rpx
font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif;
.filter-top
display: flex
justify-content: space-between;
@@ -615,6 +642,7 @@ defineExpose({ loadData });
font-size: 36rpx;
color: #000000;
.jobs-add
font-family: 'PingFangSC-Regular', 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
display: flex
align-items: center;
justify-content: center;
@@ -628,6 +656,7 @@ defineExpose({ loadData });
padding: 24rpx 0
.btm-left
display: flex
font-family: 'PingFangSC-Regular', 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
.filterbtm
font-weight: 400;
font-size: 32rpx;
@@ -639,6 +668,7 @@ defineExpose({ loadData });
font-size: 32rpx;
color: #256BFA;
.btm-right
font-family: 'PingFangSC-Regular', 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-weight: 400;
font-size: 32rpx;
color: #6C7282;
@@ -662,13 +692,14 @@ defineExpose({ loadData });
.falls-card
padding: 30rpx;
.falls-card-title
font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif;
color: #606060;
line-height: 49rpx;
text-align: left;
word-break:break-all
font-weight: 500;
font-size: 32rpx;
color: #333333;
margin-top: 10rpx
.falls-card-pay
// height: 50rpx;
word-break:break-all
@@ -678,6 +709,7 @@ defineExpose({ loadData });
align-items: end;
position: relative
.pay-text
font-family: DIN-Medium;
color: #4C6EFB;
padding-right: 10rpx
font-weight: 500;
@@ -703,23 +735,34 @@ defineExpose({ loadData });
font-size: 24rpx;
color: #6C7282;
text-align: center;
margin-top: 14rpx;
margin-top: 20rpx;
white-space: nowrap
.falls-card-company,.falls-card-pepleNumber
margin-top: 20rpx;
font-size: 24rpx;
color: #606060;
color: #999999;
line-height: 25rpx;
text-align: left;
.falls-card-pepleNumber
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 38rpx;
margin-top: 20rpx;
font-weight: 400;
font-size: 28rpx;
color: #6C7282;
font-size: 24rpx;
color: #999999;
view
display:flex
align-items: center
.point2
margin: 4rpx 6rpx 0 2rpx
height: 22rpx
width: 22rpx
.point3
margin: 4rpx 4rpx 0 0
height: 28rpx
width: 28rpx
.falls-card-matchingrate
margin-top: 10rpx;
display: flex;
@@ -728,6 +771,16 @@ defineExpose({ loadData });
font-size: 21rpx;
color: #4778EC;
text-align: left;
.falls-card-company2
margin-top: 8rpx;
font-size: 24rpx;
color: #999999;
text-align: left;
display: flex
.point3
margin: 4rpx 4rpx 0 0
height: 26rpx
width: 26rpx
// 推荐卡片
.recommend-card::before
position: absolute
@@ -739,20 +792,38 @@ defineExpose({ loadData });
height: 8rpx;
background: linear-gradient( to left, #9E74FD 0%, #256BFA 100%);
box-shadow: 0rpx 8rpx 40rpx 0rpx rgba(0,54,170,0.15);
.recommend-card::after
content ''
position absolute
z-index 0
left 50%
top 40%
transform: translate(-50%, -50%)
width 250rpx
height 250rpx
background url('@/static/icon/backAI.png') no-repeat center center
opacity 0.6
background-size contain
pointer-events none
filter: blur(3rpx)
.recommend-card
padding: 24rpx
padding 36rpx 24rpx
background: linear-gradient( 360deg, #DFE9FF 0%, #FFFFFF 52%, #FFFFFF 100%);
border-radius: 20rpx 20rpx 20rpx 20rpx;
position relative
box-shadow 0rpx 4rpx 8rpx 0rpx rgba(72, 89, 123, 0.3)
.card-content
position: relative;
z-index: 2;
.recommend-card-title
font-weight: 500;
font-size: 32rpx;
font-size: 28rpx;
color: #333333;
.recommend-card-tip
font-weight: 400;
font-size: 28rpx;
color: #6C7282;
margin-top: 20rpx
margin-top: 28rpx
.recommend-card-line
width: calc(100%);
height: 0rpx;
@@ -760,26 +831,26 @@ defineExpose({ loadData });
border: 2rpx dashed rgba(0,0,0,0.14);
margin-top: 50rpx
position: relative
.recommend-card-line::before
position: absolute
content: ''
left: 0
top: 0
transform: translate(-50% - 90rpx, -50%)
width: 28rpx;
height: 28rpx;
background: #F4F4F4;
border-radius: 50%;
.recommend-card-line::after
position: absolute
content: ''
right: 0
top: 0
transform: translate(50% + 90rpx, -50%)
width: 28rpx;
height: 28rpx;
background: #F4F4F4;
border-radius: 50%;
// .recommend-card-line::before
// position: absolute
// content: ''
// left: 0
// top: 0
// transform: translate(-50% - 90rpx, -50%)
// width: 28rpx;
// height: 28rpx;
// background: #F4F4F4;
// border-radius: 50%;
// .recommend-card-line::after
// position: absolute
// content: ''
// right: 0
// top: 0
// transform: translate(50% + 90rpx, -50%)
// width: 28rpx;
// height: 28rpx;
// background: #F4F4F4;
// border-radius: 50%;
.recommend-card-controll
display: flex
align-items: center
@@ -788,16 +859,16 @@ defineExpose({ loadData });
padding: 0 6rpx;
.controll-yes
width: 124rpx;
height: 70rpx;
height: 60rpx;
background: rgba(37,107,250,0.1);
border-radius: 12rpx 12rpx 12rpx 12rpx;
text-align: center;
line-height:70rpx
line-height: 60rpx
color: #256BFA
.controll-no
width: 124rpx;
height: 66rpx;
line-height: 66rpx
height: 56rpx;
line-height: 56rpx
border-radius: 12rpx 12rpx 12rpx 12rpx;
border: 2rpx solid #DEDEDE;
font-weight: 400;

13
pages/index/components/index-two.vue
View File

@@ -55,6 +55,7 @@
</view>
<view class="title">{{ job.jobTitle }}</view>
<view class="desc">
<image class="point3" src="/static/icon/point3.png"></image>
<!-- <uni-icons type="location" size="14"></uni-icons> -->
<view class="descText">{{ job.companyName }}</view>
</view>
@@ -76,6 +77,7 @@ const { $api, navTo } = inject('globalFunction');
import { storeToRefs } from 'pinia';
import useUserStore from '@/stores/useUserStore';
import img from '@/static/icon/filter.png';
import useLocationStore from '@/stores/useLocationStore';
import { useColumnCount } from '@/hook/useColumnCount';
import { useRecommedIndexedDBStore, jobRecommender } from '@/stores/useRecommedIndexedDBStore.js';
const recommedIndexDb = useRecommedIndexedDBStore();
@@ -291,7 +293,7 @@ defineExpose({ loadData });
}
}
.job-info{
padding: 10rpx 24rpx 24rpx 24rpx
padding: 10rpx 10rpx 24rpx 24rpx
}
.salary
color: #4C6EFB;
@@ -299,12 +301,14 @@ defineExpose({ loadData });
display: flex
align-items: flex-start
justify-content: space-between
font-family: DIN-Medium;
.flame
margin-top: 4rpx
margin-right: 4rpx
width: 24rpx
height: 31rpx
.title
font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif;
font-weight: 500;
font-size: 32rpx;
color: #333333;
@@ -316,7 +320,14 @@ defineExpose({ loadData });
color: #6C7282;
margin-top: 6rpx;
display: flex
align-items: flex-start
.descText{
flex: 1
white-space: pre-wrap
}
.point3{
margin: 4rpx 4rpx 0 0
height: 26rpx
width: 26rpx
}
</style>