yxt_group
/
supervise
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
866 Commits
1 Branch
0 Tags
102 MiB
 
 
 
 
 
 
Tree: 53928586d8
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '53928586d8'
${ noResults }
supervise/supervise-uniapp/pages/index/WaitingProcessed.vue

939 lines
20 KiB
Raw Blame History

<template>
<view class="page" @touchome.stop.prevent="preventHandler">
<view class="search">
<view class="search-input">
<image class="search-input-img" src="../../static/baseIcon/search.png" mode="aspectFill"></image>
<input class="search-input-text" placeholder="输入待办工作名称" @input="searchInput" :disabled="false" />
</view>
<text class="search-text" @click="drawerClick">筛选</text>
</view>
<scroll-view class="scrollviewCss" scroll-y="false" refresher-enabled="true" :refresher-triggered="triggered"
:refresher-threshold="45" refresher-background="#f8f8f8" @refresherrefresh="onRefresh"
@refresherrestore="onRestore" @refresherabort="onAbort" @scrolltolower="scrollBottem">
<view>
<view v-for="(item,index) in dataList" class="newslist">
<view class="item-top">
<image class="item-top-img" src="../../static/baseIcon/work.png" mode="aspectFill"></image>
<view class="item-top-text" v-html="highLight(item.workName)">{{item.workName}}</view>
<text class="item-top-text2">{{item.state}}</text>
</view>
<view class="item-con">
<view>
<text class="item-con-text">发起人：</text>
<text class="item-con-text">{{item.name}}</text>
</view>
<view style="margin-top: 8px;">
<text class="item-con-text">发起部门：</text>
<text class="item-con-text">{{item.department}}</text>
</view>
<view style="margin-top: 8px;">
<text class="item-con-text">发起日期：</text>
<text class="item-con-text">{{item.startDate}}</text>
</view>
</view>
<view class="item-bom">
<view style="flex: 1;"></view>
<image class="item-bom-img" src="../../static/baseIcon/submitTime.png" mode="aspectFill">
</image>
<text class="item-bom-text">{{item.submitDate}}</text>
</view>
</view>
<!-- <uni-load-more :status="loadingType"></uni-load-more> -->
</view>
<!-- 加载....没有更多 -->
<view style="line-height: 60rpx;margin-bottom: 50rpx;">
<u-loadmore :status="status" :icon-type="iconType" :load-text="loadText" />
</view>
</scroll-view>
<uni-drawer ref="drawer" width="320" mode="right">
<view class="drawerView">
<text style="color: #101010;font-size: 16px;font-weight: 600;font-family: sans-serif;">申请日期</text>
<view class="drawerView-date">
<input class="drawerView-date-text" v-model="search.startDate" placeholder="开始日期" :disabled="true"
@click="openDate(1)">
<text style="margin-left: 10px;margin-right: 10px;color: #777;">至</text>
<input class="drawerView-date-text" v-model="search.endDate" placeholder="结束日期" :disabled="true"
@click="openDate(2)">
</view>
<text
style="color: #101010;font-size: 16px;font-weight: 600;font-family: sans-serif; margin-top: 20px;">发起人</text>
<!-- <uni-data-checkbox @change="checkboxChange" selectedColor="#007AFF" mode="list" :localdata="personnelList" :multiple="false" >
</uni-data-checkbox> -->
<scroll-view scroll-y :show-scrollbar="true"
style="display: flex;flex-direction: column; margin-top: 20px;width: 100%; height:50%; overflow:auto;">
<view class="to_do_content_list" :class="{'to_do_finish':item.checked}"
v-for="(item,index) in personnelList" :key="index" @click="select(item.id)">
<view class="to_do_content_list_checkbox">
<view class="checkbox"></view>
</view>
<!-- 内容 -->
<view class="to_do_content_list_cont">{{item.name}}</view>
</view>
</scroll-view>
<view class="drawerView-bom">
<text class="drawerView-bom-text1" @click="resetClik">重置</text>
<text class="drawerView-bom-text2" @click="assignClick">确定</text>
</view>
<u-datetime-picker ref="datetimePicker" :closeOnClickOverlay='true' @close="cancelClick"
@cancel="cancelClick" @confirm="confirmClick" :show="datetimeShow" v-model="selectDate" mode="date"
:formatter="formatter">
</u-datetime-picker>
</view>
</uni-drawer>
</view>
</template>
<script>
import {
formatTimeTwo
} from "@/utils/index";
export default {
data() {
return {
searchText: "",
search: {
startDate: "",
endDate: "",
promoter: ""
},
selectDate: "",
datetimeShow: false,
datetimeIndex: "1",
personnelList: [{
id: "1",
name: "张安1",
department: "研发部",
checked: false
},
{
id: "2",
name: "张安2",
department: "研发部",
checked: false
},
{
id: "3",
name: "张安3",
department: "研发部",
checked: false
},
{
id: "4",
name: "张安4",
department: "研发部",
checked: false
},
{
id: "5",
name: "张安5",
department: "研发部",
checked: false
},
{
id: "6",
name: "张安6",
department: "研发部",
checked: false
},
{
id: "7",
name: "张安7",
department: "研发部",
checked: false
},
{
id: "8",
name: "张安8",
department: "研发部",
checked: false
},
{
id: "9",
name: "张安9",
department: "研发部",
checked: false
},
{
id: "10",
name: "张安10",
department: "研发部",
checked: false
},
{
id: "11",
name: "张安11",
department: "研发部",
checked: false
},
{
id: "12",
name: "张安12",
department: "研发部",
checked: false
},
{
id: "13",
name: "张安13",
department: "研发部",
checked: false
},
{
id: "14",
name: "张安14",
department: "研发部",
checked: false
},
{
id: "1",
name: "张安1",
department: "研发部",
checked: false
},
{
id: "15",
name: "张安16",
department: "研发部",
checked: false
},
],
triggered: true,
status: 'loadmore',
iconType: 'flower',
loadText: {
loadmore: '轻轻上拉',
loading: '努力加载中',
nomore: '拉也没用，没有了'
},
listQuery: {
current: 1,
size: 10,
params: {
woekName: "",
}
},
loadingType: 'more', //加载更多状态
dataList: [{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
{
workName: "测试XXXX申请",
state: "经理审核",
name: "张磊",
department: "研发部",
startDate: "2022-01-23-10:26",
currentProcessor: "张衡、吴",
submitDate: "2022.01.28 10:28"
},
],
};
},
created() {
this.$bus.$on('wholeSpin', msg => {
//这里获取到http工具js文件中传过来的wholeSpin值
console.log(">>>>>", this.isShow)
var userSid = getApp().globalData.sid
console.log(">>>>>", userSid)
this.loadData();
});
},
onLoad() {
},
onShow() {
console.log('onShow', getApp().globalData.isLogin)
let token = uni.getStorageSync("Global-Auth-Token")
if (token != null && token.length != 0) {
getApp().globalData.token = token
}
let isLogin = uni.getStorageSync("isLogin")
if (isLogin != null && isLogin == 1) {
getApp().globalData.isLogin = isLogin
}
let sid = uni.getStorageSync("sid")
if (sid != null && sid.length != 0) {
getApp().globalData.sid = sid
}
console.log('用户Sid', getApp().globalData.sid)
console.log('token', getApp().globalData.token)
console.log('是否登陆', getApp().globalData.isLogin)
// setTimeout(() => {
if (getApp().globalData.isLogin) {
var userSid = getApp().globalData.sid
console.log(">>>>>", userSid)
this.loadData();
// uni.setTabBarBadge({ //显示数字
// index: 0, //tabbar下标
// text: '100' //数字
// })
} else {
/* #ifdef MP-WEIXIN */
this.WxSilentLogin()
/* #endif */
/* #ifdef APP-PLUS */
uni.redirectTo({
url: '../login/login'
})
/* #endif */
}
},
// onShow() {
// this.listQuery.current = 1
// this.dataList = [];
// this.loadData();
// },
// onLoad() {
// },
// onPullDownRefresh() {
// this.listQuery.current = 1
// this.loadData('refresh');
// setTimeout(function() {
// uni.stopPullDownRefresh();
// }, 2000);
// },
// //加载更多
// onReachBottom() {
// this.listQuery.current = this.listQuery.current + 1
// this.loadData();
// },
onReady() {
/* #ifdef MP-WEIXIN */
// 微信小程序需要用此写法
this.$refs.datetimePicker.setFormatter(this.formatter)
/* #endif */
},
methods: {
// 禁止滑动
preventHandler() {
return
},
/* 滚动到底部 */
scrollBottem() {
console.log("滚动高度")
this.status = "nomore"
},
onRefresh() {
setTimeout(() => {
this.triggered = false;
}, 2000)
console.log("进入");
},
/* 下拉被复位 */
onRestore() {
this.triggered = true; // 需要重置
console.log(this.triggered);
console.log("停止");
},
/* 下拉被中止，没下拉完就松手就会触发 */
onAbort() {
console.log("onAbort");
},
searchInput(e) {
console.log("searchText》》》", e.detail.value);
this.searchText = e.detail.value
},
highLight(value) {
console.log("highLight》》》", value);
if (value == '' || value == undefined || value == null)
return
if (value.includes(this.searchText)) {
value = value.replace(
this.searchText,
"<font style='color:red!important'>" + this.searchText + "</font>"
)
return value
} else {
return value
}
},
drawerClick() {
this.$refs['drawer'].open()
},
openDate(type) {
switch (type) {
case 1:
this.datetimeIndex = "1"
this.datetimeShow = true
break;
case 2:
this.datetimeIndex = "2"
this.datetimeShow = true
break;
default:
break;
}
},
formatter(type, value) {
if (type === 'year') {
return `${value}年`
}
if (type === 'month') {
return `${value}月`
}
if (type === 'day') {
return `${value}日`
}
return value
},
cancelClick() {
this.datetimeShow = false
},
confirmClick(date) {
console.log('confirmClick', date)
console.log('confirmClick', formatTimeTwo(parseInt(date.value), "Y-M-D"))
switch (this.datetimeIndex) {
case "1":
this.search.startDate = formatTimeTwo(parseInt(date.value), "Y-M-D")
break;
case "2":
this.search.endDate = formatTimeTwo(parseInt(date.value), "Y-M-D")
break;
default:
break;
}
this.datetimeShow = false
},
// 点击item 选中
select(id) {
for (var i = 0; i < this.personnelList.length; i++) {
let item = this.personnelList[i]
if (item.id == id) {
item.checked = !item.checked
} else {
item.checked = false
}
}
let index = this.personnelList.findIndex((item) => item.id == id)
console.log("我被点击了", this.personnelList[index].name);
this.search.promoter = this.personnelList[index].checked ? this.personnelList[index].name : ""
console.log("promoter", this.search.promoter);
// this.personnelList[index].checked = !this.personnelList[index].checked
},
resetClik() {
this.search = {
startDate: "",
endDate: "",
promoter: ""
}
},
assignClick() {
console.log('confirm', this.search)
this.datetimeShow = false
this.$refs['drawer'].close()
uni.showToast({
icon: "none",
title: JSON.stringify(this.search),
duration: 5000,
});
},
//加载商品 ，带下拉刷新和上滑加载
async loadData(type = 'add', loading) {
//没有更多直接返回
if (type === 'add') {
if (this.loadingType === 'nomore') {
return;
}
this.loadingType = 'loading';
} else {
this.loadingType = 'more';
}
var list = []
this.$api.storeHouseListPage(this.listQuery).then((resp) => {
// if (resp.success) {
console.log('1111', resp)
this.listQuery = {
current: resp.current,
size: 10,
params: {
}
}
list = resp.records
console.log("消息列表", list)
// this.goodsList = list;
// let goodsList = await this.$api.json('goodsList');
if (type === 'refresh') {
this.dataList = [];
}
this.dataList = this.dataList.concat(list);
console.log("消息列表>>>>>", this.dataList.length)
//判断是否还有下一页，有是more 没有是nomore(测试数据判断大于20就没有了)
this.loadingType = this.dataList.length > list.total ? 'nomore' : 'more';
if (type === 'refresh') {
if (loading == 1) {
uni.hideLoading();
} else {
uni.stopPullDownRefresh();
}
}
}).catch(e => {
console.log('eeeee', e)
})
},
}
}
</script>
<style lang="scss">
.popup-show {
overflow: hidden;
position: fixed;
height: 100%;
width: 100%;
}
.page {
width: 100%;
height: 100%;
.drawerView {
height: 100%;
display: flex;
flex-direction: column;
padding: 15px 20px;
background: #fff;
.drawerView-date {
margin-top: 20px;
display: flex;
flex-direction: row;
align-items: center;
.drawerView-date-text {
text-align: center;
background-color: #F4F5F9;
border-radius: 20px;
padding: 10px 20px;
font-size: 14px;
}
}
.to_do_content_list {
position: relative;
padding: 15px;
margin: 15px;
border-radius: 5px;
background: #eee;
color: #666;
overflow: hidden;
display: flex;
align-items: center;
}
// .to_do_content_list::after {
// position: absolute;
// content: "";
// top: 0;
// bottom: 0;
// left: 0;
// width: 10px;
// background: #2C405A;
// }
.to_do_content_list_checkbox {
padding-right: 20px;
padding-left: 10px;
}
.checkbox {
width: 20px;
height: 20px;
border-radius: 50%;
background: #FFFFFF;
}
.to_do_finish .checkbox {
position: relative;
background: #FFFFFF;
}
.to_do_finish .checkbox:after {
position: absolute;
content: "";
height: 10px;
width: 10px;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
border-radius: 50%;
background: #007AFF;
}
.to_do_finish .to_do_content_list_cont {
color: #007AFF;
}
// .to_do_finish.to_do_content_list:before {
// position: absolute;
// content: "";
// left: 40px;
// right: 10px;
// top: 0;
// bottom: 0;
// height: 2px;
// margin: auto 0;
// background: #007AFF;
// }
.to_do_finish.to_do_content_list::after {
background: #C35CDF;
}
.drawerView-bom {
width: 85%;
position: fixed;
display: flex;
flex-direction: row;
align-items: center;
bottom: 0;
min-height: 40px;
margin-bottom: 50px;
background: #EA4726;
border-radius: 20px;
padding: 1px;
.drawerView-bom-text1 {
flex: 1;
text-align: center;
min-height: 38px;
line-height: 38px;
color: #EA4726;
background: #fff;
font-size: 14px;
border-radius: 20px 0px 20px 20px;
// border-top-left-radius: 20px;
// border-bottom-left-radius: 20px;
// border-bottom-right-radius:20px;
}
.drawerView-bom-text2 {
flex: 1;
line-height: 38px;
color: #fff;
font-size: 14px;
text-align: center;
}
}
}
.search {
display: flex;
flex-direction: row;
align-items: center;
background: #007AFF;
width: 100%;
padding: 10px;
.search-input {
flex: 1;
margin-left: 15px;
background: #fff;
border-radius: 30px;
padding: 5px;
display: flex;
flex-direction: row;
align-items: center;
margin-right: 20px;
.search-input-img {
margin-left: 10px;
width: 20px;
height: 20px;
}
.search-input-text {
margin-left: 10px;
font-size: 14px;
color: #000;
}
}
.search-text {
margin-right: 30px;
font-size: 15px;
color: #fff;
}
}
.scrollviewCss {
overflow-y: hidden;
height: 90vh;
.newslist {
display: flex;
flex-direction: column;
background: #fff;
border-radius: 12px;
margin-left: 12px;
margin-right: 12px;
margin-top: 12px;
padding: 15px 20px;
.item-top {
display: flex;
flex-direction: row;
align-items: center;
padding-bottom: 12px;
padding-left: 5px;
padding-right: 5px;
border-bottom: 1px solid #F1F3F5;
.item-top-img {
width: 18px;
height: 18px;
}
.item-top-text {
flex: 1;
margin-left: 5px;
margin-right: 10px;
font-size: 16px;
color: #101010;
font-weight: 600;
font-family: sans-serif;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.item-top-text2 {
font-size: 14px;
color: #0A59F7;
}
}
.item-con {
margin-top: 12px;
display: flex;
flex-direction: column;
.item-con-text {
font-size: 15px;
color: #666666;
}
}
.item-bom {
width: 100%;
margin-top: 12px;
padding-top: 10px;
border-top: 1px solid #F1F3F5;
display: flex;
flex-direction: row;
align-items: center;
justify-content: end;
.item-bom-img {
width: 14px;
height: 14px;
}
.item-bom-text {
margin-left: 5px;
font-size: 14px;
color: #999;
}
}
}
}
}
</style>