hly
/
recruitment-wechat-uniapp-241012
generated from hly/uniapp-shop-templates
1
0
Fork 0
Code Issues 0 Pull Requests 0 Projects 0 Releases 0 Wiki Activity
Browse Source

上传修改

master
前端-胡立永 7 months ago
parent
2e0cac7b8d
commit
632d61142d
7 changed files with 497 additions and 131 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +70
    -0
      components/list/userList/index.vue
  2. +128
    -0
      components/list/userList/userItem.vue
  3. +278
    -0
      components/screen/screenWork.vue
  4. +0
    -112
      components/user/productList.vue
  5. +21
    -19
      pages/index/index.vue
  6. BIN
      static/image/home/banner.png
  7. BIN
      static/image/product/favorable.png

+ 70
- 0
components/list/userList/index.vue View File

@ -0,0 +1,70 @@
<template>
<scroll-view
scroll-y="true"
:style="{height: height}"
@scrolltolower="loadMoreData">
<view class="bossList">
<view
@click="$utils.navigateTo('/pages_order/boss/bossDetail?id=' + 123)"
:key="index"
v-for="(item, index) in 10">
<userItem :item="item"/>
</view>
</view>
</scroll-view>
</template>
<script>
import userItem from './userItem.vue'
export default {
components : {
userItem,
},
props : {
height : {
default : 'auto'
},
api : {
default : ''
}
},
data() {
return {
queryParams: {
pageNo: 1,
pageSize: 10,
},
total : 0,
list : 10,
}
},
methods: {
queryVideoList(){
if(uni.getStorageSync('token')){
this.queryParams.token = uni.getStorageSync('token')
}
this.$api(this.api, this.queryParams, res => {
if(res.code == 200){
this.list = res.result
// this.total = res.result.total
}
})
},
loadMoreData(){
if(this.queryParams.pageSize <= this.list.length){
this.queryParams.pageSize += 10
this.queryVideoList()
}
},
}
}
</script>
<style scoped lang="scss">
.bossList {
&>view{
margin: 20rpx;
}
}
</style>

+ 128
- 0
components/list/userList/userItem.vue View File

@ -0,0 +1,128 @@
<template>
<view class="boss-item">
<view class="head">
<view class="headImage">
<image src="/static/image/center/headImage.png" mode=""></image>
</view>
<view class="info">
<view class="name">
李老板
<view>
装配电工
</view>
</view>
<view class="tips">
男 · 汉族 · 本科 · 应届生
</view>
</view>
<view class="right">
<view class="price">
12-18K
</view>
</view>
</view>
<view class="bottom">
<view class="time">
09月23日 16：20
</view>
<view class="phone">
<image src="/static/image/home/phone.png" mode=""></image>
联系他
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style scoped lang="scss">
.boss-item{
background-color: #fff;
border-radius: 20rpx;
.head {
display: flex;
align-items: center;
position: relative;
padding: 20rpx;
image {
width: 100%;
height: 100%;
}
.headImage {
width: 80rpx;
height: 80rpx;
background-size: 100% 100%;
overflow: hidden;
border-radius: 50%;
margin-right: 40rpx;
}
.info {
font-size: 28rpx;
.name {
font-size: 32rpx;
display: flex;
padding-bottom: 10rpx;
view {
display: flex;
font-size: 24rpx;
align-items: center;
margin-left: 20rpx;
background: rgba($uni-color, 0.2);
color: $uni-color;
padding: 10rpx;
border-radius: 10rpx;
}
}
.tips {
font-size: 24rpx;
}
}
.right{
margin-left: auto;
font-size: 24rpx;
.price{
color: $uni-color;
}
}
}
.bottom{
display: flex;
justify-content: space-between;
align-items: flex-end;
font-size: 24rpx;
padding: 20rpx;
padding-top: 0;
.time{
color: #999999;
}
.phone{
background-color: rgba($uni-color, 0.2);
color: $uni-color;
padding: 8rpx 16rpx;
border-radius: 10rpx;
image{
width: 20rpx;
height: 20rpx;
}
}
}
}
</style>

+ 278
- 0
components/screen/screenWork.vue View File

@ -0,0 +1,278 @@
<template>
<view class="page">
<uv-drop-down ref="dropDown"
sign="dropDown_1"
text-active-color="#3796F8"
:extra-icon="{name:'arrow-down-fill',color:'#666',size:'26rpx'}"
:extra-active-icon="{name:'arrow-up-fill',color:'#3796F8',size:'26rpx'}"
:defaultValue="defaultValue"
:custom-style="{padding: '0 30rpx'}"
@click="selectMenu">
<uv-drop-down-item name="area" type="2"
:label="dropItem('area').label"
:value="dropItem('area').value">
</uv-drop-down-item>
<uv-drop-down-item
name="craft" type="2"
:label="dropItem('craft').label"
:value="dropItem('craft').value">
</uv-drop-down-item>
<uv-drop-down-item
name="vip_type"
type="1"
label='智能推荐'
:value="0">
</uv-drop-down-item>
</uv-drop-down>
<uv-drop-down-popup
sign="dropDown_1"
:click-overlay-on-close="true"
:currentDropItem="currentDropItem"
@clickItem="clickItem"
@popupChange="change"></uv-drop-down-popup>
<uv-popup ref="popup" :round="30"
:safeAreaInsetBottom="false">
<view class="popup">
<view class="list">
<view class="item"
v-for="(item, index) in list"
:key="index">
<view class="title">
{{ item.title }}
</view>
<view class="tagList">
<view
:class="{act : i == item.index}"
@click="clickTag(item, i)"
v-for="(t, i) in item.tag"
:key="t">
{{ t }}
</view>
</view>
</view>
</view>
<view class="btn" @click="submit">
<button class="a">提交</button>
</view>
</view>
</uv-popup>
</view>
</template>
<script>
export default {
data() {
return {
// 表示value等于这些值，就属于默认值
defaultValue: [0, 'all'],
// 筛选结果
result: [],
activeName: 'area',
area: {
label: '全国',
value: 0,
activeIndex: 0,
color: '#333',
activeColor: '#3796F8',
child: [
{
label: '全国',
value: 0,
},
{
label: '金牌讲解员',
value: 1
},
{
label: '专业讲解员',
value: 2
},
]
},
craft: {
label: '工种',
value: 'all',
activeIndex: 0,
color: '#333',
activeColor: '#3796F8',
child: [
{
label: '全部',
value: 'all'
},
]
},
list : [
{
title : '您目前所属的年龄段',
tag : ['18岁～35岁', '35岁～45岁', '45岁～50岁', '50岁以上'],
index : 0,
},
{
title : '您希望从事的工种',
tag : ['电工', '焊工', '叉车', '其他'],
index : 0,
},
{
title : '您希望从事的工作性质',
tag : ['全职', '临时工',],
index : 0,
},
]
}
},
computed : {
dropItem(name) {
return (name) => {
const result = {};
const find = this.result.find(item => item.name === name);
if (find) {
result.label = find.label;
result.value = find.value;
} else {
result.label = this[name].label;
result.value = this[name].value;
}
return result;
}
},
// 获取当前下拉筛选项
currentDropItem() {
return this[this.activeName];
},
},
methods: {
clickTag(item, i){
console.log(i);
item.index = i
},
change(e) {},
/**
* 点击每个筛选项回调
* @param {Object} e { name, active, type } = e
*/
selectMenu(e) {
const {
name,
active,
type
} = e;
this.activeName = name;
if(type == 1){
this.$refs.popup.open()
return
}
const find = this.result.find(item => item.name == this.activeName);
if (find) {
const findIndex = this[this.activeName]
.child.findIndex(item => item.label == find.label && item
.value == find.value);
this[this.activeName].activeIndex = findIndex;
} else {
this[this.activeName].activeIndex = 0;
}
},
/**
* 点击菜单回调处理
* @param {Object} item 选中项 { label,value } = e
*/
clickItem(e) {
// 下面有重新赋值，所以用let
let {
label,
value
} = e;
const findIndex = this.result.findIndex(item => item.name == this.activeName);
if (this.defaultValue.indexOf(value) > -1 && this[this.activeName].label) {
label = this[this.activeName].label;
}
// 已经存在筛选项
if (findIndex > -1) {
this.$set(this.result, findIndex, {
name: this.activeName,
label,
value
})
} else {
this.result.push({
name: this.activeName,
label,
value
});
}
this.result = this.result.filter(item => this.defaultValue.indexOf(item.value) == -1);
this.$emit('clickItem', this.result)
},
submit(){
},
}
}
</script>
<style scoped lang="scss">
.page{
.popup{
width: 80vw;
padding: 40rpx;
.list{
.item{
margin-top: 20rpx;
.title{
font-weight: 900;
font-size: 30rpx;
}
.tagList{
display: flex;
flex-wrap: wrap;
padding: 10rpx 0;
view{
background: rgba($uni-color, 0.1);
padding: 10rpx 20rpx;
margin: 10rpx;
border-radius: 10rpx;
font-size: 26rpx;
}
.act{
color: #fff;
background: $uni-color;
}
}
}
}
.btn {
display: flex;
justify-content: center;
width: 100%;
margin-top: 20rpx;
.a {
display: flex;
justify-content: center;
align-items: center;
width: 90%;
color: #FFF;
background-color: $uni-color;
border: 1px solid rgba($uni-color, 0.2);
border-radius: 100rpx;
font-size: 30rpx;
}
}
}
}
</style>

+ 0
- 112
components/user/productList.vue View File

@ -1,112 +0,0 @@
<template>
<view class="list">
<view class="item"
v-for="(item, index) in 10"
@click="$utils.navigateTo('/pages_order/product/productDetail?id=123')"
:key="index">
<image
class="image"
src="https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg" mode=""></image>
<view class="info">
<view class="title">
桌布租赁
</view>
<view class="price">
<text>￥58</text>元/起
</view>
<view class="favorable">
<view class="t">
限时优惠
</view>
<view class="p">
￥48
</view>
</view>
<view class="num">
已售卖5000+件
</view>
</view>
<view class="btn">
<uv-icon name="shopping-cart"
color="#fff"></uv-icon>
</view>
</view>
</view>
</template>
<script>
export default {
name:"productList",
data() {
return {
};
},
methods : {
},
}
</script>
<style scoped lang="scss">
.list{
display: flex;
flex-wrap: wrap;
.item{
position: relative;
width: 300rpx;
padding: 20rpx;
background-color: #fff;
border-radius: 20rpx;
margin-top: 20rpx;
&:nth-child(odd){
margin-right: 20rpx;
}
.image{
width: 300rpx;
height: 250rpx;
border-radius: 20rpx;
}
.info{
font-size: 26rpx;
.title{
font-size: 30rpx;
}
.price{
color: #D03F25;
margin-top: 6rpx;
text{
font-size: 34rpx;
font-weight: 900;
}
}
.favorable{
display: flex;
background-image: url(/static/image/product/favorable.png);
background-size: 100% 100%;
width: fit-content;
padding: 5rpx 10rpx;
font-size: 18rpx;
margin-top: 6rpx;
.p{
color: #fff;
margin-left: 10rpx;
}
}
.num{
margin-top: 6rpx;
font-size: 22rpx;
color: #888;
}
}
.btn{
position: absolute;
right: 20rpx;
bottom: 20rpx;
padding: 10rpx;
border-radius: 50%;
background-color: $uni-color;
}
}
}
</style>

+ 21
- 19
pages/index/index.vue View File

@ -6,13 +6,13 @@
:list="bannerList"
indicator
height="620rpx"
indicatorStyle="bottom: 100rpx;"
keyName="imageContent"></uv-swiper>
keyName="url"></uv-swiper>
<!-- indicatorStyle="bottom: 100rpx;" -->
<view class="top">
<view class="search">
<uv-search
placeholder="请输入搜索文章"
placeholder="请输入岗位/公司名称"
:showAction="false"
search-icon-size="40rpx"
@search="search"
@ -21,7 +21,7 @@
</view>
</view>
<view class="content">
<!-- <view class="content">
<view class="grid">
<uv-grid :border="false"
:col="5">
@ -34,12 +34,14 @@
</uv-grid-item>
</uv-grid>
</view>
</view>
</view> -->
<!-- 筛选器 -->
<screenWork @clickItem="clickItem"/>
<!-- 列表 -->
<workList ref="workList"/>
<!-- <workList ref="workList"/> -->
<userList ref="workList"/>
<PrivacyAgreementPoup/>
@ -50,12 +52,16 @@
<script>
import PrivacyAgreementPoup from '@/components/config/PrivacyAgreementPoup.vue'
import workList from '@/components/list/workList/index.vue'
import userList from '@/components/list/userList/index.vue'
import tabber from '@/components/base/tabbar.vue'
import screenWork from '@/components/screen/screenWork.vue'
export default {
components : {
PrivacyAgreementPoup,
workList,
tabber
tabber,
screenWork,
userList
},
data() {
return {
@ -88,14 +94,8 @@
],
bannerList: [
{
url: 'https://img-s-msn-com.akamaized.net/tenant/amp/entityid/BB1msKSi.img',
},
{
url: 'https://img-s-msn-com.akamaized.net/tenant/amp/entityid/BB1msKSi.img',
url: '/static/image/home/banner.png',
},
{
url: 'https://img-s-msn-com.akamaized.net/tenant/amp/entityid/BB1msKSi.img',
},
],
productList: [],
keyword : '',
@ -116,6 +116,9 @@
// this.$refs.videoList.loadMoreData()
// },
methods: {
clickItem(){
},
}
}
</script>
@ -127,18 +130,17 @@
background-color: $uni-color;
.top{
position: absolute;
top: var(--status-bar-height);
left: 0;
top: 190rpx;
left:00rpx;
padding-top: 30rpx;
display: flex;
width: 100%;
flex-direction: column;
align-items: center;
.search{
width: 400rpx;
margin-left: -100rpx;
width: 700rpx;
/deep/ .uv-search__content__icon{
padding: 30rpx 0;
padding: 10rpx 0;
}
}
.title{


BIN
static/image/home/banner.png View File

Before After
Width: 375  |  Height: 294  |  Size: 30 KiB

BIN
static/image/product/favorable.png View File

Before After
Width: 60  |  Height: 15  |  Size: 282 B

Write Preview
Loading…
Cancel
Save