flat: yic
This commit is contained in:
史典卓
@@ -1,227 +1,225 @@
|
||||
<template>
|
||||
<view class="app_container">
|
||||
<view class="container_head">
|
||||
<view class="row">
|
||||
<view class="head_left">
|
||||
<view class="left_title">在德阳市开设</view>
|
||||
<view class="left_content">
|
||||
<view class="content_item">
|
||||
<view class="fs_28">1</view>
|
||||
<view class="fs_24">主市场</view>
|
||||
</view>
|
||||
<view class="content_item">
|
||||
<view class="fs_28">15</view>
|
||||
<view class="fs_24">分市场</view>
|
||||
</view>
|
||||
<view class="content_item">
|
||||
<view class="fs_28">136</view>
|
||||
<view class="fs_24">服务站</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="head_right">
|
||||
<image src="../../static/img/deyang.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="broadcast">
|
||||
<view class="cast-l"><u-icon style="margin-right: 10rpx;" name="volume" color="#fb6a09"
|
||||
size="20"></u-icon>周六常态化招聘会通知</view>
|
||||
<u-icon name="arrow-right" color="#666666" size="16"></u-icon>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<view class="conatiner_card">
|
||||
<view class="row blod fs_34">馆陶县智慧就业市场</view>
|
||||
<view class="row color_666 fs_30 marT_30">
|
||||
<u-icon style="margin-right: 10rpx;" name="calendar" color="#666666" size="16"></u-icon>营业时间
|
||||
</view>
|
||||
<view class="row color_666 fs_30">上午9:00-12:00 下午14:00-18:00</view>
|
||||
<view class="row color_666 fs_30 marT_30">
|
||||
<u-icon style="margin-right: 10rpx;" name="map" color="#666666" size="16"></u-icon>
|
||||
四川省德阳市旌阳区天山南路1段108号
|
||||
<!-- <u-icon style="margin-left: 10rpx;" name="arrow-right" color="#666666" size="16"></u-icon> -->
|
||||
</view>
|
||||
<!-- <view class="row color_666 fs_28 marT_10">
|
||||
<view class="column">距离我7km</view>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<view class="conatiner_card">
|
||||
<view class="row blod fs_34">关于市场</view>
|
||||
<view class="row color_666 fs_30">
|
||||
德阳市公共就业服务市场，为进一步促进公共就业服务提质增效，保障重点企业用工需求，助力高校毕业生等重点群体实现更充分更高质量就业，德阳市人社局进一步加强统筹、靶向施力，充分利用市本级和各区(市、县)现有招聘网站、微信小程序、抖音号等以及线下人力资源招聘市场，全力打造集“手机端”+“电脑端”+“线下端”三位一体立体招聘矩阵，通过深挖收集企业用工岗位信息，坚持定向推送，进一步拓宽招聘信息发布渠道，提升招聘求职成功率。
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- <view class="container_chioe">
|
||||
<view class="chioe_share color_666 fs_24">
|
||||
<u-icon name="share" color="#666666" size="16"></u-icon>分享
|
||||
</view>
|
||||
<view class="chioe_btn">电话咨询</view>
|
||||
<view class="chioe_btn btn_Blue">到这去</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@function designTo($num) {
|
||||
@return ($num / 620rpx) * 750rpx
|
||||
}
|
||||
|
||||
@for $i from 10 to 60 {
|
||||
.fs_#{$i} {
|
||||
font-size : #{$i}rpx;
|
||||
}
|
||||
}
|
||||
|
||||
@for $i from 1 to 60 {
|
||||
.marT_#{$i} {
|
||||
margin-top : #{$i}rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.color_666 {
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.app_container {
|
||||
background-color: #f3f4f8;
|
||||
min-height: calc(100vh - var(--window-top) - var(--status-bar-height) - var(--window-bottom));
|
||||
|
||||
.container_head {
|
||||
min-height: 300rpx;
|
||||
padding: 28rpx;
|
||||
background: linear-gradient(to bottom, rgba(69, 112, 250, 1), rgba(69, 112, 250, .0));
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
align-content: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.head_left {
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
flex-direction: column;
|
||||
|
||||
.left_title {}
|
||||
|
||||
.left_content {
|
||||
height: designTo(87rpx);
|
||||
width: designTo(313rpx);
|
||||
background-color: rgba(69, 104, 252, 0.4);
|
||||
border-radius: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
|
||||
.content_item {
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.head_right {
|
||||
width: designTo(220rpx);
|
||||
height: designTo(148rpx);
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.broadcast {
|
||||
margin-top: designTo(65rpx);
|
||||
height: designTo(77rpx);
|
||||
background-color: rgba(244, 230, 224, 1);
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 24rpx;
|
||||
|
||||
.cast-l {
|
||||
font-size: 32rpx;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.conatiner_card {
|
||||
margin: 28rpx;
|
||||
background-color: #FFFFFF;
|
||||
height: fit-content;
|
||||
border-radius: 20rpx;
|
||||
padding: designTo(28rpx);
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.column {
|
||||
padding: 10rpx 20rpx;
|
||||
border-radius: 40rpx;
|
||||
background-color: #f3f4f8;
|
||||
}
|
||||
}
|
||||
|
||||
.container_chioe {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
background-color: #FFFFFF;
|
||||
height: designTo(108rpx);
|
||||
padding: 0 28rpx designTo(30rpx) 28rpx;
|
||||
|
||||
.chioe_share {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.chioe_btn {
|
||||
color: #FFFFFF;
|
||||
background: linear-gradient(to right, #fbaf1a, #fbaf1a);
|
||||
height: designTo(66rpx);
|
||||
width: designTo(228rpx);
|
||||
text-align: center;
|
||||
line-height: designTo(66rpx);
|
||||
border-radius: designTo(33rpx);
|
||||
}
|
||||
|
||||
.btn_Blue {
|
||||
background: linear-gradient(to right, #95aefb, #4b74f7);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view class="app_container">
|
||||
<view class="container_head">
|
||||
<view class="row">
|
||||
<view class="head_left">
|
||||
<view class="left_title">在德阳市开设</view>
|
||||
<view class="left_content">
|
||||
<view class="content_item">
|
||||
<view class="fs_28">1</view>
|
||||
<view class="fs_24">主市场</view>
|
||||
</view>
|
||||
<view class="content_item">
|
||||
<view class="fs_28">15</view>
|
||||
<view class="fs_24">分市场</view>
|
||||
</view>
|
||||
<view class="content_item">
|
||||
<view class="fs_28">136</view>
|
||||
<view class="fs_24">服务站</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="head_right">
|
||||
<image src="../../static/img/deyang.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="broadcast">
|
||||
<view class="cast-l"><u-icon style="margin-right: 10rpx;" name="volume" color="#fb6a09"
|
||||
size="20"></u-icon>周六常态化招聘会通知</view>
|
||||
<u-icon name="arrow-right" color="#666666" size="16"></u-icon>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<view class="conatiner_card">
|
||||
<view class="row blod fs_34">宜昌市智慧就业市场</view>
|
||||
<view class="row color_666 fs_30 marT_30">
|
||||
<u-icon style="margin-right: 10rpx" name="calendar" color="#666666" size="16"></u-icon>
|
||||
营业时间
|
||||
</view>
|
||||
<view class="row color_666 fs_30">上午9:00-12:00 下午14:00-18:00</view>
|
||||
<view class="row color_666 fs_30 marT_30">
|
||||
<u-icon style="margin-right: 10rpx" name="map" color="#666666" size="16"></u-icon>
|
||||
四川省德阳市旌阳区天山南路1段108号
|
||||
<!-- <u-icon style="margin-left: 10rpx;" name="arrow-right" color="#666666" size="16"></u-icon> -->
|
||||
</view>
|
||||
<!-- <view class="row color_666 fs_28 marT_10">
|
||||
<view class="column">距离我7km</view>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<view class="conatiner_card">
|
||||
<view class="row blod fs_34">关于市场</view>
|
||||
<view class="row color_666 fs_30">
|
||||
德阳市公共就业服务市场，为进一步促进公共就业服务提质增效，保障重点企业用工需求，助力高校毕业生等重点群体实现更充分更高质量就业，德阳市人社局进一步加强统筹、靶向施力，充分利用市本级和各区(市、县)现有招聘网站、微信小程序、抖音号等以及线下人力资源招聘市场，全力打造集“手机端”+“电脑端”+“线下端”三位一体立体招聘矩阵，通过深挖收集企业用工岗位信息，坚持定向推送，进一步拓宽招聘信息发布渠道，提升招聘求职成功率。
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- <view class="container_chioe">
|
||||
<view class="chioe_share color_666 fs_24">
|
||||
<u-icon name="share" color="#666666" size="16"></u-icon>分享
|
||||
</view>
|
||||
<view class="chioe_btn">电话咨询</view>
|
||||
<view class="chioe_btn btn_Blue">到这去</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
methods: {},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@function designTo($num) {
|
||||
@return ($num / 620rpx) * 750rpx;
|
||||
}
|
||||
|
||||
@for $i from 10 to 60 {
|
||||
.fs_#{$i} {
|
||||
font-size: #{$i}rpx;
|
||||
}
|
||||
}
|
||||
|
||||
@for $i from 1 to 60 {
|
||||
.marT_#{$i} {
|
||||
margin-top: #{$i}rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.color_666 {
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.app_container {
|
||||
background-color: #f3f4f8;
|
||||
min-height: calc(100vh - var(--window-top) - var(--status-bar-height) - var(--window-bottom));
|
||||
|
||||
.container_head {
|
||||
min-height: 300rpx;
|
||||
padding: 28rpx;
|
||||
background: linear-gradient(to bottom, rgba(69, 112, 250, 1), rgba(69, 112, 250, 0));
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
align-content: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.head_left {
|
||||
color: #ffffff;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
flex-direction: column;
|
||||
|
||||
.left_title {
|
||||
}
|
||||
|
||||
.left_content {
|
||||
height: designTo(87rpx);
|
||||
width: designTo(313rpx);
|
||||
background-color: rgba(69, 104, 252, 0.4);
|
||||
border-radius: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
|
||||
.content_item {
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.head_right {
|
||||
width: designTo(220rpx);
|
||||
height: designTo(148rpx);
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.broadcast {
|
||||
margin-top: designTo(65rpx);
|
||||
height: designTo(77rpx);
|
||||
background-color: rgba(244, 230, 224, 1);
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 24rpx;
|
||||
|
||||
.cast-l {
|
||||
font-size: 32rpx;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.conatiner_card {
|
||||
margin: 28rpx;
|
||||
background-color: #ffffff;
|
||||
height: fit-content;
|
||||
border-radius: 20rpx;
|
||||
padding: designTo(28rpx);
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.column {
|
||||
padding: 10rpx 20rpx;
|
||||
border-radius: 40rpx;
|
||||
background-color: #f3f4f8;
|
||||
}
|
||||
}
|
||||
|
||||
.container_chioe {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
background-color: #ffffff;
|
||||
height: designTo(108rpx);
|
||||
padding: 0 28rpx designTo(30rpx) 28rpx;
|
||||
|
||||
.chioe_share {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.chioe_btn {
|
||||
color: #ffffff;
|
||||
background: linear-gradient(to right, #fbaf1a, #fbaf1a);
|
||||
height: designTo(66rpx);
|
||||
width: designTo(228rpx);
|
||||
text-align: center;
|
||||
line-height: designTo(66rpx);
|
||||
border-radius: designTo(33rpx);
|
||||
}
|
||||
|
||||
.btn_Blue {
|
||||
background: linear-gradient(to right, #95aefb, #4b74f7);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user