initial commit

This commit is contained in:
Ling53666
2025-04-28 15:59:21 +08:00
commit 36cc2fe7ba
55 changed files with 2627 additions and 0 deletions

160
pages/jiedan/jiedan.js Normal file
View File

@ -0,0 +1,160 @@
// pages/jiedan/jiedan.js
Page({
data: {
show:false,
picture:[{
image:'/image/20250407154233.jpg'
},
{
image:'/image/20250407154300.png'
},
{
image:'/image/20250407154310.png'
}
],
message:[
{
person:'1000人正在进行',
level:'简单',
title:'推广豆包',
money:'40'
},
{
person:'1000人正在进行',
level:'简单',
title:'推广豆包',
money:'40'
},
{
person:'1000人正在进行',
level:'简单',
title:'推广豆包',
money:'40'
},
{
person:'1000人正在进行',
level:'简单',
title:'推广豆包',
money:'40'
},
{
person:'1000人正在进行',
level:'简单',
title:'推广豆包',
money:'40'
},
{
person:'1000人正在进行',
level:'简单',
title:'推广豆包',
money:'40'
},
{
person:'1000人正在进行',
level:'简单',
title:'推广豆包',
money:'40'
},
{
person:'1000人正在进行',
level:'简单',
title:'推广豆包',
money:'40'
},
],
lie:[
{
name:'全部分类'
},
{
name:'派发'
},
{
name:'推广'
},
{
name:'注册'
},
],
selectedIndex: 0,
},
change(){
this.setData({
show:!this.data.show
})
},
bindKeyInput: function (e) {
this.setData({
inputValue: e.detail.value
})
console.log(this.data.inputValue);
},
onSelect(e) {
console.log('jashdjkasdjahs');
const index = e.currentTarget.dataset.index;
console.log(index);
const name = this.data.lie[index].name;
this.setData({
selectedIndex: index,
show:!this.data.show
});
console.log('你点击了:', name);
// 你也可以触发其他逻辑,比如发送请求等
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})

4
pages/jiedan/jiedan.json Normal file
View File

@ -0,0 +1,4 @@
{
"navigationBarTitleText": "接单界面",
"usingComponents": {}
}

86
pages/jiedan/jiedan.wxml Normal file
View File

@ -0,0 +1,86 @@
<!--pages/jiedan/jiedan.wxml-->
<view class="box">
<!-- 轮播图 -->
<view class="swiper">
<swiper autoplay="true">
<swiper-item wx:for="{{picture}}" wx:key="image">
<image class="imagesize" src="{{item.image}}" mode="aspectFill"/>
</swiper-item>
</swiper>
<view class="text-overlay">
<text>校园接单 实现财富自由</text>
</view>
</view>
<!-- 下半部分 -->
<view class="xiabox">
<!-- 搜索框部分 -->
<view class="sousuo tongyong">
<view class="hhhh">
<view class="inputkuang tongyong">
<view class="souimage tongyong">
<image class="sousuosize" src="/image/sousuo.png" mode="aspectFill"/>
</view>
<view class="inputk tongyong" >
<input bindinput="bindKeyInput" placeholder="请输入内容"/>
</view>
</view>
</view>
<!-- 筛选 -->
<view class="sidebox tongyong" bind:tap="change">
<view class="saixuan tongyong">
<image class="imageshai" src="/image/shaiixuan.png" mode="aspectFill"/>
<text>筛选</text>
</view>
</view>
</view>
<!-- 推广部分 -->
<view class="messagebox">
<view class="kuang" wx:for="{{message}}">
<view class="touxianmg tongyong">
<image class="touxiangimage" src="https://pic4.zhimg.com/v2-f10ac7fc477596faf538ca274852c68f_b.jpg" mode="aspectFill"/>
</view>
<view class="messagesize">
<text class="text" style="font-size: 15px;color: #FC7E09;">{{item.title}}</text>
<text class="text" style="font-size: 12px;color: rgb(161, 154, 154);">容易度:{{item.level}}</text>
<text class="text" style="font-size: 12px;color: rgb(161, 154, 154);" >{{item.person}}</text>
</view>
<view class="moneybox">
<view style="width: 100%;height: 50%;" class="tongyong">
<text style="color: #FC7E09;font-size: 14px;">佣金:{{item.money}}积分</text>
</view>
<view style="width: 100%;height: 50%;" class="weizhi">
<view class="jiedan tongyong">
<text>接单</text>
</view>
</view>
</view>
<view>
</view>
</view>
</view>
</view>
</view>
<!-- 侧边栏 -->
<view class="cebianlan" wx:if="{{show}}">
<view class="zuo" bind:tap="change">
</view>
<view class="you">
<view class="wenzi">
<view class="chengsehezi">
<view class="chengse">
</view>
<view class="wenzicheng">
<text style="margin-left: 20rpx;font-size: 18px;font-weight: bolder;">任务分类</text>
</view>
</view>
<view class="xuazhongbox">
<view class="he {{index === selectedIndex ? 'active' : ''}}" wx:for="{{lie}}" wx:key="index" data-index="{{index}}" bind:tap="onSelect" >
<text style="font-size: 13px;">{{item.name}}</text>
</view>
</view>
</view>
</view>
</view>

197
pages/jiedan/jiedan.wxss Normal file
View File

@ -0,0 +1,197 @@
/* pages/jiedan/jiedan.wxss */
.box{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.text-overlay {
width: 100%;
position: absolute;
top: 80%;
left: 70%;
transform: translate(-50%, -50%);
color: white;
font-size: 25px;
font-weight: bold;
text-shadow: 1px 2px 4px rgba(0, 0, 0, 0.6);
z-index: 10;
font-style: italic;
}
.sousuo{
width: 100%;
height: 7vh;
}
.zuo{
width: 40%;
height: 100%;
background-color: rgba(36, 34, 34, 0.2);
}
.wenzi{
width: 100%;
height: 40%;
}
.you{
width: 60%;
height: 100%;
background-color: #ffffff;
}
.chengsehezi{
width: 100%;
height: 10%;
display: flex;
align-items: center;
}
.chengse{
width: 4%;
height: 80%;
background-color: #FC7E09;
margin-left: 10rpx;
}
.wenzicheng{
width: 96%;
height: 100%;
display: flex;
align-items: center;
}
.xuazhongbox{
width: 100%;
display: flex;
flex: 1;
flex-wrap: wrap;
gap: 20rpx;
}
.he{
display: flex;
justify-content: center;
align-items: center;
padding: 5px;
margin: 20rpx;
}
.he.active {
background-color: #f37b1d; /* 高亮背景色 */
}
.cebianlan{
width: 100%;
height: 100%;
display: flex;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
}
.shuzhi{
display: flex;
align-items: center;
}
.tongyong{
display: flex;
justify-content: center;
align-items: center;
}
.souimage{
width: 20%;
height: 100%;
}
.sousuosize{
width: 20px;
height: 20px;
}
.sidebox{
width: 20%;
height: 100%;
}
.saixuan{
width: 100%;
height: 100%;
}
.hhhh{
width: 80%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.inputk{
width: 80%;
height: 100%;
}
.xiabox{
width: 100%;
background-color: #EFEFEF;
}
.swiper {
width: 100%;
height: 30vh;
position: relative;
overflow: hidden;
}
.inputkuang{
width: 80%;
height: 70%;
border-radius: 50px;
background-color: #ffffff;
}
.imageshai{
width: 30px;
height: 30px;
}
.imagesize{
width: 100%;
height: 100%;
}
swiper,swiper-item {
width: 100%;
height: 100%;
}
.messagebox{
width: 100%;
height: 100%;
display: flex;
align-items: center;
flex-direction: column;
}
.kuang{
width: 90%;
height: 140px;
border-radius: 20px;
margin-top: 20rpx;
background-color: #ffffff;
display: flex;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}
.touxianmg{
width: 30%;
height: 100%;
}
.touxiangimage{
width: 100px;
height: 100px;
border-radius: 50px;
}
.messagesize{
width: 40%;
height: 100%;
display: flex;
flex-direction: column;
}
.text{
margin-top: 20rpx;
}
.moneybox{
width: 30%;
display: flex;
flex-direction: column;
}
.jiedan{
width: 50px;
height: 30px;
background-color: #EFEFEF;
margin-right: 20rpx;
}
.weizhi{
display: flex;
justify-content: flex-end;
}