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-05-13 11:10:38 +08:00
parent 582e432e6a
commit fd74b7d4df
109 changed files with 8644 additions and 5205 deletions
Download Patch File Download Diff File Expand all files Collapse all files

405
packageA/pages/UnitDetails/UnitDetails.vue
View File

@@ -1,68 +1,79 @@
<template>
<view class="container">
<!-- 单位基本信息 -->
<view class="company-header">
<text class="company-name">{{ companyInfo.name }}</text>
<view class="company-info">
<view class="location">
<uni-icons type="location-filled" color="#4778EC" size="24"></uni-icons>
青岛 {{ companyInfo.location }}
</view>
<view class="industry" style="display: inline-block">
{{ companyInfo.industry }}
<dict-Label dictType="scale" :value="companyInfo.scale"></dict-Label>
</view>
<AppLayout title="" :use-scroll-view="false">
<template #headerleft>
<view class="btn">
<image src="@/static/icon/back.png" @click="navBack"></image>
</view>
</view>
<view class="hr"></view>
<!-- 单位介绍 -->
<view class="company-description">
<view class="section-title">单位介绍</view>
<text class="description">
{{ companyInfo.description }}
</text>
</view>
<!-- 在招职位 -->
<view class="job-list">
<text class="section-title">在招职位</text>
<view
class="job-row"
v-for="job in pageState.list"
:key="job.id"
@click="navTo(`/packageA/pages/post/post?jobId=${job.jobId}`)"
>
<view class="left">
<text class="job-title">{{ job.jobTitle }}</text>
<view class="job-tags">
<!-- <view class="tag" v-for="tag in job.tags" :key="tag">{{ tag }}</view> -->
<view class="tag">
<dict-Label dictType="education" :value="job.education"></dict-Label>
</view>
<view class="tag">
<dict-Label dictType="experience" :value="job.experience"></dict-Label>
</view>
<view class="tag">{{ job.vacancies }}人</view>
</template>
<template #headerright>
<view class="btn mar_ri10">
<image
src="@/static/icon/collect3.png"
v-if="!companyInfo.isCollection"
@click="companyCollection"
></image>
<image src="@/static/icon/collect2.png" v-else @click="companyCollection"></image>
</view>
</template>
<view class="content">
<view class="content-top">
<view class="companyinfo-left">
<image src="@/static/icon/companyIcon.png" mode=""></image>
</view>
<view class="companyinfo-right">
<view class="row1">{{ companyInfo?.name }}</view>
<view class="row2">
<dict-tree-Label
v-if="companyInfo?.industry"
dictType="industry"
:value="companyInfo?.industry"
></dict-tree-Label>
<span v-if="companyInfo?.industry">&nbsp;</span>
<dict-Label dictType="scale" :value="companyInfo?.scale"></dict-Label>
</view>
<text class="location">
青岛
<dict-Label dictType="area" :value="job.jobLocationAreaCode"></dict-Label>
</text>
</view>
<view class="right">
<text class="salary">{{ job.minSalary }}-{{ job.maxSalary }}/月</text>
<text class="hot" v-if="job.isHot">🔥</text>
</view>
</view>
<view class="conetent-info" :class="{ expanded: isExpanded }">
<view class="info-title">公司介绍</view>
<view class="info-desirption">{{ companyInfo.description }}</view>
<!-- <view class="info-title title2">公司地址</view>
<view class="locationCompany"></view> -->
</view>
<view class="expand" @click="expand">
<text>{{ isExpanded ? '收起' : '展开' }}</text>
<image
class="expand-img"
:class="{ 'expand-img-active': !isExpanded }"
src="@/static/icon/downs.png"
></image>
</view>
<scroll-view scroll-y class="Detailscroll-view" @scrolltolower="getJobsList('add')">
<view class="views">
<view class="Detail-title"><text class="title">在招职位</text></view>
<renderJobs
v-if="pageState.list.length"
:list="pageState.list"
:longitude="longitudeVal"
:latitude="latitudeVal"
></renderJobs>
<empty v-else pdTop="200"></empty>
</view>
</scroll-view>
</view>
</view>
</AppLayout>
</template>
<script setup>
import { reactive, inject, watch, ref, onMounted } from 'vue';
import point from '@/static/icon/point.png';
import { reactive, inject, watch, ref, onMounted, computed } from 'vue';
import { onLoad, onShow } from '@dcloudio/uni-app';
import dictLabel from '@/components/dict-Label/dict-Label.vue';
const { $api, navTo } = inject('globalFunction');
import { storeToRefs } from 'pinia';
import useLocationStore from '@/stores/useLocationStore';
const { longitudeVal, latitudeVal } = storeToRefs(useLocationStore());
const { $api, navTo, vacanciesTo, navBack } = inject('globalFunction');
const isExpanded = ref(false);
const pageState = reactive({
page: 0,
list: [],
@@ -71,11 +82,27 @@ const pageState = reactive({
pageSize: 10,
});
const companyInfo = ref({});
onLoad((options) => {
console.log(options);
getCompanyInfo(options.companyId);
});
function companyCollection() {
const companyId = companyInfo.value.companyId;
if (companyInfo.value.isCollection) {
$api.createRequest(`/app/company/collection/${companyId}`, {}, 'DELETE').then((resData) => {
getCompanyInfo(companyId);
$api.msg('取消收藏成功');
});
} else {
$api.createRequest(`/app/company/collection/${companyId}`, {}, 'POST').then((resData) => {
getCompanyInfo(companyId);
$api.msg('收藏成功');
});
}
}
function getCompanyInfo(id) {
$api.createRequest(`/app/company/${id}`).then((resData) => {
companyInfo.value = resData.data;
@@ -97,99 +124,193 @@ function getJobsList(type = 'add') {
};
$api.createRequest(`/app/company/job/${companyInfo.value.companyId}`, params).then((resData) => {
const { rows, total } = resData;
pageState.list = resData.rows;
if (type === 'add') {
const str = pageState.pageSize * (pageState.page - 1);
const end = pageState.list.length;
const reslist = rows;
pageState.list.splice(str, end, ...reslist);
} else {
pageState.list = rows;
}
pageState.total = resData.total;
pageState.maxPage = Math.ceil(pageState.total / pageState.pageSize);
});
}
function expand() {
isExpanded.value = !isExpanded.value;
}
</script>
<style lang="stylus">
.container
display flex
flex-direction column
background-color #f8f8f8
.hr
height: 10rpx;
.company-header
padding 20rpx 40rpx
background-color #fff
.company-name
font-size 56rpx
font-weight bold
color #333
margin-bottom 10rpx
.company-info
font-size 24rpx
color #666
display flex
align-items center
justify-content space-between
.location
display flex
align-items center
<style lang="stylus" scoped>
.btn {
display: flex;
justify-content: space-between;
align-items: center;
width: 60rpx;
height: 60rpx;
}
image {
height: 100%;
width: 100%;
}
.content{
height: 100%
display: flex;
flex-direction: column
.content-top{
padding: 28rpx
padding-top: 50rpx
display: flex
flex-direction: row
flex-wrap: nowrap
.companyinfo-left{
width: 96rpx;
height: 96rpx;
margin-right: 24rpx
}
.companyinfo-right{
.company-description
padding 20rpx 40rpx
background-color #fff
margin-bottom 10rpx
.section-title
font-size 42rpx
font-weight bold
margin-bottom 10rpx
.description
font-size 24rpx
color #333
line-height 36rpx
.job-list
padding 20rpx 40rpx
background-color #fff
.section-title
font-size 42rpx
font-weight bold
margin-bottom 10rpx
.job-row
display flex
justify-content space-between
align-items flex-start
padding 20rpx
border 2rpx solid #D9D9D9
margin-top 20rpx
border-radius 17rpx 17rpx 17rpx 17rpx
.left
display flex
flex-direction column
flex-grow 1
.job-title
font-size 28rpx
font-weight bold
color #333
margin-bottom 10rpx
.job-tags
display flex
gap 10rpx
margin-bottom 10rpx
.tag
background-color #22c55e
color #fff
padding 5rpx 10rpx
border-radius 12rpx
font-size 20rpx
.location
font-size 24rpx
color #666
.right
display flex
flex-direction column
align-items flex-end
.salary
font-size 28rpx
color #3b82f6
font-weight bold
.hot
color #ff6b6b
font-size 24rpx
margin-top 5rpx
.row1{
font-weight: 500;
font-size: 32rpx;
color: #333333;
}
.row2{
font-weight: 400;
font-size: 28rpx;
color: #6C7282;
line-height: 45rpx;
}
}
}
.conetent-info{
padding: 0 28rpx
overflow: hidden;
max-height: 0rpx;
transition: max-height 0.3s ease;
.info-title{
font-weight: 600;
font-size: 28rpx;
color: #000000;
}
.info-desirption{
margin-top: 12rpx
font-weight: 400;
font-size: 28rpx;
color: #495265;
text-align: justified;
}
.title2{
margin-top: 48rpx
}
}
.expanded {
max-height: 1000rpx; // 足够显示完整内容
}
.expand{
display: flex
flex-wrap: nowrap
white-space: nowrap
justify-content: center
margin-top: 20rpx
margin-bottom: 28rpx
font-weight: 400;
font-size: 28rpx;
color: #256BFA;
.expand-img{
width: 40rpx;
height: 40rpx;
}
.expand-img-active{
transform: rotate(180deg)
}
}
}
.Detailscroll-view{
flex: 1;
overflow: hidden;
background: #F4F4F4;
.views{
padding: 28rpx
.Detail-title{
font-weight: 600;
font-size: 32rpx;
color: #000000;
position: relative;
display: flex
justify-content: space-between
.title{
position: relative;
z-index: 2;
}
}
.Detail-title::before{
position: absolute
content: '';
left: -14rpx
bottom: 0
height: 16rpx;
width: 108rpx;
background: linear-gradient(to right, #CBDEFF, #FFFFFF);
border-radius: 8rpx;
z-index: 1;
}
.cards{
padding: 32rpx;
background: #FFFFFF;
box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0,0,0,0.04);
border-radius: 20rpx 20rpx 20rpx 20rpx;
margin-top: 22rpx;
.card-company{
display: flex
justify-content: space-between
align-items: flex-start
.company{
font-weight: 500;
font-size: 32rpx;
color: #333333;
}
.salary{
font-weight: 500;
font-size: 28rpx;
color: #4C6EFB;
white-space: nowrap
line-height: 48rpx
}
}
.card-companyName{
font-weight: 400;
font-size: 28rpx;
color: #6C7282;
}
.card-tags{
display: flex
flex-wrap: wrap
.tag{
width: fit-content;
height: 30rpx;
background: #F4F4F4;
border-radius: 4rpx;
padding: 6rpx 20rpx;
line-height: 30rpx;
font-weight: 400;
font-size: 24rpx;
color: #6C7282;
text-align: center;
margin-top: 14rpx;
white-space: nowrap
margin-right: 20rpx
}
}
.card-bottom{
margin-top: 32rpx
display: flex
justify-content: space-between
font-size: 28rpx;
color: #6C7282;
}
}
}
}
</style>