任务明细页面
This commit is contained in:
@@ -41,7 +41,7 @@ Component({
|
||||
'iconList[1]': 'star-filled'
|
||||
})
|
||||
wx.redirectTo({
|
||||
url: '../today/index'
|
||||
url: '../task/index'
|
||||
})
|
||||
}
|
||||
if (cur == 3){
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
// pages/today/index.js
|
||||
// pages/task/index.js
|
||||
const app = getApp();
|
||||
import ActionSheet, { ActionSheetTheme } from '../../components/action-sheet/index';
|
||||
let pageStart = 1;
|
||||
@@ -9,23 +9,24 @@ Page({
|
||||
*/
|
||||
data: {
|
||||
tapCheckHandle: undefined,
|
||||
dateVisible: true,
|
||||
aIconList: ['check-rectangle', 'star-filled', 'notification', 'info-circle'],
|
||||
taskList: [{'taskId':'1','title':'标题德外旗舰店1','note':'2022-11-11'},{'taskId':'2','title':'标题德外旗舰店2','note':'2022-11-11'}],
|
||||
todayList: [{'taskId':'1','title':'标题德外旗舰店1','note':'2022-11-11'},{'taskId':'2','title':'标题德外旗舰店2','note':'2022-11-11'}],
|
||||
delayList: [{'taskId':'1','title':'si哦大家艾吉奥是我','note':'2022-11-11','complete':true},
|
||||
{'taskId':'2','title':'si哦大家艾吉奥是2321','note':'2022-11-11','complete':true},
|
||||
{'taskId':'3','title':'打SD卡我怕','note':'2022-11-11','complete':true},
|
||||
{'taskId':'4','title':'标无间道i文件舰店1','note':'2022-11-11','complete':true},
|
||||
{'taskId':'5','title':'标题大家啊我i家1','note':'2022-11-11','complete':false},
|
||||
{'taskId':'6','title':'标题德外而我却','note':'2022-11-11','complete':true},
|
||||
{'taskId':'7','title':'标题德外旗额我去问1','note':'2022-11-11','complete':false},
|
||||
{'taskId':'8','title':'千而万请问确京东卡来接我i的骄傲问你,我就是准备看看最棒的是的多长定德外旗舰店1','note':'2022-11-11','complete':true},
|
||||
{'taskId':'9','title':'标请问请问破千万1','note':'2022-11-11','complete':true},
|
||||
{'taskId':'10','title':'标而且我请问请问1','note':'2022-11-11','complete':true},
|
||||
{'taskId':'11','title':'代欧王大炮物品代码','note':'2022-11-11','complete':true},
|
||||
{'taskId':'12','title':'到ID我们','note':'2022-11-11','complete':true},
|
||||
{'taskId':'13','title':'我去哦额陪娃欧美大片请我们','note':'2022-11-11','complete':true},
|
||||
{'taskId':'14','title':'请问哦气雾剂群殴','note':'2022-11-11','complete':true}
|
||||
delayList: [{'taskId':'1','title':'si哦大家艾吉奥是我','note':'2022-11-11','complete':true,'notification':false},
|
||||
{'taskId':'2','title':'si哦大家艾吉奥是2321','note':'2022-11-11','complete':true,'notification':true},
|
||||
{'taskId':'3','title':'打SD卡我怕','note':'2022-11-11','complete':true,'notification':true},
|
||||
{'taskId':'4','title':'标无间道i文件舰店1','note':'2022-11-11','complete':true,'notification':false},
|
||||
{'taskId':'5','title':'标题大家啊我i家1','note':'2022-11-11','complete':false,'notification':true},
|
||||
{'taskId':'6','title':'标题德外而我却','note':'2022-11-11','complete':true,'notification':true},
|
||||
{'taskId':'7','title':'标题德外旗额我去问1','note':'2022-11-11','complete':false,'notification':true},
|
||||
{'taskId':'8','title':'千而万请问确京东卡来接我i的骄傲问你,我就是准备看看最棒的是的多长定德外旗舰店1','note':'2022-11-11','complete':true,'notification':true},
|
||||
{'taskId':'9','title':'标请问请问破千万1','note':'2022-11-11','complete':true,'notification':true},
|
||||
{'taskId':'10','title':'标而且我请问请问1','note':'2022-11-11','complete':true,'notification':true},
|
||||
{'taskId':'11','title':'代欧王大炮物品代码','note':'2022-11-11','complete':true,'notification':true},
|
||||
{'taskId':'12','title':'到ID我们','note':'2022-11-11','complete':true,'notification':true},
|
||||
{'taskId':'13','title':'我去哦额陪娃欧美大片请我们','note':'2022-11-11','complete':true,'notification':true},
|
||||
{'taskId':'14','title':'请问哦气雾剂群殴','note':'2022-11-11','complete':true,'notification':true}
|
||||
],
|
||||
duration: 300, // swiper-item 切换过渡时间
|
||||
categoryCur: 0, // 当前数据列索引
|
||||
@@ -123,32 +124,49 @@ Page({
|
||||
this.setCurrentData(currentCur,categoryData);
|
||||
},
|
||||
handleAction(e) {
|
||||
console.log(e.detail);
|
||||
let itemId = e.currentTarget.dataset.id;
|
||||
let items = [];
|
||||
items.push({
|
||||
label: '配置',
|
||||
operate: '0',
|
||||
dataId: itemId,
|
||||
});
|
||||
if (e.currentTarget.dataset.notify){
|
||||
items.push({
|
||||
label: '取消提醒',
|
||||
operate: '1',
|
||||
dataId: itemId,
|
||||
disabled: !e.currentTarget.dataset.notify,
|
||||
});
|
||||
}
|
||||
items.push({
|
||||
label: '删除',
|
||||
operate: '2',
|
||||
dataId: itemId,
|
||||
color: '#e34d59',
|
||||
});
|
||||
this.data.tapCheckHandle = ActionSheet.show({
|
||||
theme: ActionSheetTheme.List,
|
||||
selector: '#t-action-sheet',
|
||||
context: this,
|
||||
items: [
|
||||
{
|
||||
label: '详情xxx',
|
||||
},
|
||||
{
|
||||
label: '截止日期xxx',
|
||||
color: '#0052D9',
|
||||
},
|
||||
{
|
||||
label: '配置提醒',
|
||||
color: '#0052D9',
|
||||
},
|
||||
{
|
||||
label: '删除xxx',
|
||||
color: '#e34d59',
|
||||
},
|
||||
],
|
||||
items: items
|
||||
});
|
||||
},
|
||||
handleSelected(e) {
|
||||
console.log(e.detail);
|
||||
let operate = e.detail.selected.operate;
|
||||
let dataId = e.detail.selected.dataId;
|
||||
if (operate == 0){
|
||||
//进入详情页面 TODO
|
||||
wx.navigateTo({
|
||||
url: '/pages/taskDetail/index?id=' + dataId
|
||||
});
|
||||
}
|
||||
if (operate == 1){
|
||||
//取消提醒 //TODO
|
||||
}
|
||||
if (operate == 2){
|
||||
//删除 TODO
|
||||
}
|
||||
},
|
||||
selectCancel() {
|
||||
this.data.tapCheckHandle.close();
|
||||
@@ -3,6 +3,7 @@
|
||||
"foot-tab": "../foot-tab/foot-tab",
|
||||
"tab": "../../components/tab/index",
|
||||
"scroll": "../../components/scroll/index",
|
||||
"t-action-sheet": "../../components/action-sheet/action-sheet"
|
||||
"t-action-sheet": "../../components/action-sheet/action-sheet",
|
||||
"t-fab": "../../components/fab/fab"
|
||||
}
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
<!--pages/today/index.wxml-->
|
||||
<!--pages/task/index.wxml-->
|
||||
<view class="top-wrap">
|
||||
<tab id="category"
|
||||
tab-data="{{categoryMenu}}"
|
||||
@@ -22,7 +22,8 @@
|
||||
<view class="cell"
|
||||
wx:for="{{item.listData}}"
|
||||
wx:key="index"
|
||||
data-link="{{item.link}}"
|
||||
data-id="{{item.taskId}}"
|
||||
data-notify="{{item.notification}}"
|
||||
bind:longpress="handleAction">
|
||||
<view class="name">
|
||||
<t-checkbox wx:if="{{item.complete}}" borderless data-id="{{item.taskId}}" class="checkedBox" label="{{item.title}}" checked bind:change="changeCheck"/>
|
||||
@@ -30,16 +31,20 @@
|
||||
</view>
|
||||
<view class="remark">
|
||||
<!--截止时间-->
|
||||
<!--提醒时间-->
|
||||
<t-icon name="calendar"/>{{item.note}}
|
||||
<!--重复-->
|
||||
<t-icon wx:if="!{{item.repeat}}" name="refresh"/>
|
||||
<!--任务备注-->
|
||||
<t-icon name="app"></t-icon><text class="note">{{item.note}}</text>
|
||||
<t-icon wx:if="!{{item.repeat}}" name="books"/>
|
||||
<!--提醒-->
|
||||
<t-icon wx:if="{{item.notification}}" name="notification"/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<t-fab icon="add" bind:click="handleClick"></t-fab>
|
||||
<t-action-sheet id="t-action-sheet" bind:selected="handleSelected" bind:cancel="selectCancel"/>
|
||||
<view>
|
||||
<foot-tab iconList="{{aIconList}}"/>
|
||||
@@ -1,4 +1,4 @@
|
||||
/* pages/today/index.wxss */
|
||||
/* pages/task/index.wxss */
|
||||
.top-wrap {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
@@ -40,6 +40,7 @@ checkbox {
|
||||
|
||||
.cell .remark {
|
||||
display: flex;
|
||||
align-items:center;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
@@ -47,7 +48,3 @@ checkbox {
|
||||
text-decoration:line-through;
|
||||
}
|
||||
|
||||
.note {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
52
pages/taskDetail/index.js
Normal file
52
pages/taskDetail/index.js
Normal file
@@ -0,0 +1,52 @@
|
||||
let taskId = '';
|
||||
Page({
|
||||
data: {
|
||||
mode: '',
|
||||
dateVisible: false,
|
||||
date: new Date('2021-12-23').getTime(), // 支持时间戳传入
|
||||
dateText: '',
|
||||
// 指定选择区间起始值
|
||||
start: '2008-01-01 00:00:00',
|
||||
end: '2040-12-31 23:59:59',
|
||||
},
|
||||
onLoad: function (options) {
|
||||
taskId = options.id;
|
||||
},
|
||||
|
||||
onShow() {
|
||||
|
||||
},
|
||||
|
||||
showPicker(e) {
|
||||
const { mode } = e?.currentTarget?.dataset;
|
||||
this.setData({
|
||||
mode,
|
||||
[`${mode}Visible`]: true,
|
||||
});
|
||||
},
|
||||
hidePicker() {
|
||||
const { mode } = this.data;
|
||||
this.setData({
|
||||
[`${mode}Visible`]: false,
|
||||
});
|
||||
},
|
||||
onConfirm(e) {
|
||||
const { value } = e?.detail;
|
||||
const { mode } = this.data;
|
||||
|
||||
console.log('confim', value);
|
||||
|
||||
this.setData({
|
||||
[mode]: value,
|
||||
[`${mode}Text`]: value,
|
||||
});
|
||||
|
||||
this.hidePicker();
|
||||
},
|
||||
|
||||
onColumnChange(e) {
|
||||
console.log('pick', e?.detail?.value);
|
||||
},
|
||||
|
||||
|
||||
});
|
||||
5
pages/taskDetail/index.json
Normal file
5
pages/taskDetail/index.json
Normal file
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"usingComponents": {
|
||||
"t-date-time-picker": "../../components/date-time-picker/date-time-picker"
|
||||
}
|
||||
}
|
||||
25
pages/taskDetail/index.wxml
Normal file
25
pages/taskDetail/index.wxml
Normal file
@@ -0,0 +1,25 @@
|
||||
<t-input label="任务名" value="{{'任务的农安我i吗哇哦i对面'}}" placeholder="请输入任务名称" maxlength="{{10}}" clearable />
|
||||
<t-cell
|
||||
title="完成日期"
|
||||
hover
|
||||
note="{{dateText || '年 月 日'}}"
|
||||
arrow
|
||||
data-mode="date"
|
||||
bindtap="showPicker"
|
||||
class="test"
|
||||
t-class="pannel-item"
|
||||
t-class-note="{{dateText ? 'sub-text' : 'empty'}}"
|
||||
/>
|
||||
<t-date-time-picker
|
||||
title="选择日期"
|
||||
visible="{{dateVisible}}"
|
||||
mode="date"
|
||||
defaultValue="{{date}}"
|
||||
format="YYYY-MM-DD"
|
||||
bindchange="onConfirm"
|
||||
bindpick="onColumnChange"
|
||||
bindcancel="hidePicker"
|
||||
start="{{start}}"
|
||||
end="{{end}}"
|
||||
></t-date-time-picker>
|
||||
<t-input placeholder="最大输入10个字符" maxlength="{{10}}" clearable />
|
||||
18
pages/taskDetail/index.wxss
Normal file
18
pages/taskDetail/index.wxss
Normal file
@@ -0,0 +1,18 @@
|
||||
.pannel-item {
|
||||
font-size: 32rpx;
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.pannel-item::after {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.sub-text {
|
||||
color: #000;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.empty {
|
||||
color: #000;
|
||||
opacity: 0.32;
|
||||
}
|
||||
Reference in New Issue
Block a user