优化组件效果,新增任务管理模块

This commit is contained in:
weipengfei 2023-07-31 16:31:59 +08:00
parent 68d1bc8218
commit 7cb722455b
8 changed files with 528 additions and 45 deletions

View File

@ -171,7 +171,6 @@
url: `/subpkg/pdfView/pdfView?url=${res.data.url}`
})
})
},
naviBack() {
uni.navigateBack()

View File

@ -46,9 +46,9 @@
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 8rpx;
.title {
height: 39rpx;
font-size: 28rpx;
font-weight: 500;
line-height: 35rpx;
@ -95,11 +95,11 @@
}
.center {
height: 35rpx;
font-size: 25rpx;
font-weight: 400;
color: #333333;
line-height: 35rpx;
margin-bottom: 8rpx;
}
.bottom {

View File

@ -337,6 +337,15 @@
"navigationBarTextStyle": "white"
}
}, {
"path": "taskAdmin/taskAdmin",
"style": {
"navigationBarTitleText": "任务管理",
"enablePullDownRefresh": false,
"navigationBarBackgroundColor": "#3175f9",
"navigationBarTextStyle": "white"
}
}]
}],
"globalStyle": {

View File

@ -1,9 +1,8 @@
<template>
<view class="all_box">
<!-- 任务搜索框 -->
<view class="task_box">
<!-- <view class="task_box">
<u-search shape="round" placeholder="搜索任务状态、优先级、部门等"></u-search>
<!-- 筛选按钮 -->
<view>
<u-popup :show="show" @close="close" @open="open" mode="top" overlayStyle="position: fixed;top:100rpx">
<view class="search_box">
@ -21,36 +20,13 @@
</u-popup>
<view @click="show = true" class="screening" :class="show?'choose_style':''">筛选</view>
</view>
</view>
</view> -->
<!-- 新建任务 -->
<!-- <view class="new_task" @click="goNewTask">+新建任务</view> -->
<!-- 事件列表 -->
<view class="task_list">
<!-- <taskCard class="task_card" v-for="item in 10" :key="item"></taskCard> -->
<taskCard class="task_card" v-for="item in 10" :key="item"></taskCard>
</view>
<!-- <view class="eventList_box" v-for="item in eventData" :key="item.id">
<view class="head_box">
<text class="title">{{item.title}}</text>
<text class="status" :class="item.status=='驳回'?'another_color':''">{{item.flow_name}}</text>
</view>
<view class="line"></view>
<view class="responsible">
<text>负责人:{{item.director_name}}</text>
<text class="department">{{item.did_name ? item.did_name :'' }}</text>
</view>
<view class="responsible">
<text>协办人:{{item.assist_admin_names}}</text>
</view>
<view class="responsible">
<text>发布人:{{item.admin_name}}</text>
</view>
<view class="responsible">
<text v-if="item.is_bug==0">任务性质:部门工作</text>
<text v-if="item.is_bug==1">任务性质:部门协助</text>
<text v-if="item.is_bug==2">任务性质:临时任务</text>
</view>
<view class="end_time">预计结束时间:{{item.end_time}}</view>
</view> -->
<u-loadmore :status="status" :loading-text="loadingText" :loadmore-text="loadmoreText" :nomore-text="nomoreText" />
<!-- <tabbar></tabbar> -->
</view>

View File

@ -214,11 +214,16 @@ export const oaHomeData = [
icon: prefix + 'oa/cgsq@2x.png',
url: '/subpkg/contract/contract'
},
// {
// text: '公司管理',
// icon: prefix + 'oa/bxsq@2x.png',
// url: '/subpkg/companyAdmin/companyAdmin',
// admin: true
// },
{
text: '公司管理',
text: '任务管理',
icon: prefix + 'oa/bxsq@2x.png',
url: '/subpkg/companyAdmin/companyAdmin',
admin: true
url: '/subpkg/taskAdmin/taskAdmin',
},
{
text: '档案管理',

View File

@ -1,23 +1,308 @@
<template>
<view class=""></view>
<view class="">
<view class="card">
<view class="top">
<image src="../../static/img/contract/company.png"></image>
<view class="title">
<view class="name">租赁公司名称</view>
<view class="type">公司类型</view>
<view class="code">社会代码1321346351615</view>
</view>
</view>
<view class="location">
<view class="left">
<uni-icons type="location"></uni-icons>
<text>地址:</text>
</view>
<view class="right">
泸州市江阳区通滩镇
</view>
</view>
<u-line color="#999999FF" style="margin: 21rpx 0;"></u-line>
<view class="center">
<view class="car">
<image src="../../static/logo.png" @click="priview('/static/logo.png')"></image>
<view class="right">
<view class="car_name">
<view class="name">三轮车</view>
<view>100天后到期</view>
</view>
<view class="time">租赁时间:2023-01-01 2024-01-01</view>
</view>
</view>
<view class="info">
<view>型号:电动三轮车</view>
<view>数量:1</view>
<view>租赁责任人:XXX</view>
<view>联系方式:110120130</view>
</view>
</view>
<view class="bottom">
<view class="title">租赁合同附件</view>
<view class="contract">
<view class="left">
<image class="contract_img" src="../../static/img/contract/pdf.png"></image>
<view class="text">
<view class="name">三轮车租赁合同</view>
<view>
<!-- <text class="nickname">张郭郭</text> -->
<text>2023年01月01日</text>
</view>
</view>
</view>
<view class="right" @click="naviTo(contract.contract_no)">
<!-- <image class="icon"></image> -->
<uni-icons type="paperclip" color="#3274F9"></uni-icons>
<view>查看</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
onLoad() {},
onShow() {},
methods: {},
onPullDownRefresh() {
import { download_file } from "@/api/junziqian.js"
export default {
data() {
return {
}
},
onLoad() {},
onShow() {},
methods: {
naviTo(contract_no) {
download_file({ applyNo: contract_no }).then(res => {
if (res.code != 1) {
Toast(res.msg)
}
uni.navigateTo({
url: `/subpkg/pdfView/pdfView?url=${res.data.url}`
})
})
},
//
priview(url) {
uni.previewImage({
urls: [url],
longPressActions: {
itemList: ['保存图片'],
success: function(data) {
if (data.tapIndex === 0) {
uni.saveImageToPhotosAlbum({
filePath: url,
success: function() {
uni.showToast({
title: '保存成功',
icon: 'success'
})
},
fail: function() {
uni.showToast({
title: '保存失败',
icon: 'none'
})
}
})
}
}
}
})
},
},
onPullDownRefresh() {
uni.stopPullDownRefresh()
}
}
</script>
<style lang="scss">
.card {
margin: 0 auto;
margin-top: 28rpx;
padding: 28rpx;
width: 694rpx;
// height: 913rpx;
background: #FFFFFF;
border-radius: 14rpx 14rpx 14rpx 14rpx;
opacity: 1;
</style>
.top {
display: flex;
image {
width: 140rpx;
height: 140rpx;
margin-right: 28rpx;
}
.title {
display: flex;
flex-direction: column;
justify-content: space-around;
.name {
font-size: 32rpx;
font-weight: 500;
color: #333333;
}
.type {
font-size: 28rpx;
font-weight: 500;
color: #3274F9;
}
.code {
font-size: 25rpx;
font-weight: 400;
color: #999999;
}
}
}
.location {
display: flex;
font-size: 28rpx;
font-weight: 400;
color: #666666;
line-height: 35rpx;
margin-top: 24rpx;
.right {
flex: 1;
}
}
.center {
.car {
display: flex;
image {
width: 140rpx;
height: 140rpx;
margin-right: 28rpx;
}
.right {
display: flex;
flex-direction: column;
justify-content: space-around;
.car_name {
display: flex;
justify-content: space-between;
font-size: 28rpx;
font-weight: 500;
color: #3274F9;
.name {
font-size: 32rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: rgba(0, 0, 0, 0.8);
line-height: 35rpx;
}
}
.time {
font-size: 28rpx;
font-weight: 400;
color: #666666;
line-height: 35rpx;
}
}
}
.info {
margin-top: 21rpx;
font-size: 28rpx;
font-weight: 400;
color: #666666;
line-height: 45rpx;
}
}
.bottom{
.title{
font-size: 32rpx;
font-weight: 500;
color: #333333;
display: flex;
align-items: center;
margin: 28rpx 0;
&::before{
content: "";
width: 6rpx;
height: 32rpx;
border-radius: 6rpx;
margin-right: 12rpx;
display: inline-block;
background-color: $theme-oa-color;
}
}
.contract {
display: flex;
justify-content: space-between;
.left {
display: flex;
.contract_img {
width: 102rpx;
height: 102rpx;
background: #F5F5F5;
border-radius: 14rpx 14rpx 14rpx 14rpx;
margin-right: 21rpx;
}
.text {
display: flex;
flex-direction: column;
justify-content: space-between;
.name {
font-size: 32rpx;
font-weight: 500;
color: rgba(0, 0, 0, 0.8);
line-height: 35rpx;
}
.nickname {
margin-right: 35rpx;
}
text {
height: 39rpx;
font-size: 28rpx;
font-weight: 400;
color: #666666;
line-height: 35rpx;
}
}
}
.right {
font-size: 28rpx;
font-weight: 500;
color: $theme-oa-color;
line-height: 35rpx;
display: flex;
justify-content: center;
align-items: center;
.icon {
width: 35rpx;
height: 39rpx;
background-color: $theme-oa-color;
opacity: 1;
margin-right: 10rpx
}
}
}
}
}
</style>

View File

@ -196,6 +196,8 @@
<style lang="scss">
.calendar {
background-color: #fff;
padding-bottom: 28rpx;
.date {
display: flex;
align-items: flex-end;

View File

@ -0,0 +1,207 @@
<template>
<view class="">
<view class="calendar">
<picker mode="date" fields="month" @change="bindDateChangeMonth">
<view class="date">
<view class="month">{{nowDate.m}}</view>
<view>{{nowDate.y}}</view>
</view>
</picker>
<uni-calendar :insert="true" @change="changeDate" :date="nowYMD" :showMonth="false" />
</view>
<view class="task_list">
<uni-section class="title" titleFontSize="32rpx" :title="'任务清单 '+ nowYMD" type="line"></uni-section>
<view class="task_card" v-for="item in 10" :key="item">
<view class="top">
<view class="title" :class="item%3?'title_tow':''">完成OA移动端界面设计移动端界面设计</view>
<view class="price">
<!-- <text>收益</text> -->
<image src="../../static/icons/price.png"></image>
<text>11.00</text>
</view>
</view>
<view class="center">
关于设计app常用页面的美化按照原型图美化页面
</view>
<view class="bottom">
<view class="left">负责人张三三</view>
<view class="right">指派时间2023-03-25 23:59</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
current: 0,
nowDate: {
y: '',
m: '',
d: ''
},
loadConfig: {
page: 1,
limit: 25,
loadingText: '努力加载中',
loadmoreText: '轻轻上拉',
nomoreText: '没有更多账单了~~',
status: 'loadmore'
},
}
},
onLoad() {
this.initDate();
},
onShow() {},
computed: {
nowYMD() {
let m = this.nowDate.m < 10 ? '0' + this.nowDate.m : this.nowDate.m;
let d = this.nowDate.d < 10 ? '0' + this.nowDate.d : this.nowDate.d;
return this.nowDate.y + '-' + m + '-' + d;
},
},
methods: {
initDate() {
let date = new Date();
this.nowDate.y = date.getFullYear();
this.nowDate.m = date.getMonth() + 1;
this.nowDate.d = date.getDate();
},
//
changeDate(e) {
this.nowDate.y = e.year;
this.nowDate.m = +e.month;
this.nowDate.d = e.date;
this.loadConfig.page = 1;
this.loadConfig.status = 'loadmore';
console.log('加载任务');
},
//
bindDateChangeMonth(e) {
this.nowDate.y = e.detail.value.split('-')[0];
let m = e.detail.value.split('-')[1];
this.nowDate.m = m < 10 ? +m : m;
}
},
onPullDownRefresh() {
uni.stopPullDownRefresh()
}
}
</script>
<style lang="scss">
.calendar {
background-color: #fff;
padding-bottom: 28rpx;
.date {
display: flex;
align-items: flex-end;
background-color: #fff;
padding: 28rpx;
color: #333333;
font-size: 25rpx;
.month {
margin-right: 15rpx;
height: 49rpx;
font-size: 35rpx;
font-weight: bold;
}
}
}
.task_list {
.title {
background-color: transparent;
}
.task_card {
margin: 0 auto;
margin-bottom: 28rpx;
width: 694rpx;
background: #FFFFFF;
border-radius: 21rpx 21rpx 21rpx 21rpx;
opacity: 1;
box-sizing: border-box;
padding: 25rpx;
display: flex;
justify-content: space-between;
flex-direction: column;
.top {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 8rpx;
.title {
font-size: 28rpx;
font-weight: 500;
line-height: 35rpx;
&::before {
content: '未完成';
display: inline-block;
color: #F24848;
padding: 2px 8px;
background: #FFE4E4;
margin-right: 20rpx;
border-radius: 7rpx 7rpx 7rpx 7rpx;
}
}
.title_tow {
&::before {
content: '已完成';
display: inline-block;
color: #3274F9;
padding: 2px 8px;
background: #E4EDFF;
margin-right: 20rpx;
border-radius: 7rpx 7rpx 7rpx 7rpx;
}
}
.price {
width: 158rpx;
// width: 200rpx;
height: 49rpx;
background: #FFF1DB;
border-radius: 74rpx 74rpx 74rpx 74rpx;
display: flex;
justify-content: center;
align-items: center;
color: #F9AA32;
image {
width: 28.99rpx;
height: 28.99rpx;
margin-right: 5.5rpx;
}
}
}
.center {
font-size: 25rpx;
font-weight: 400;
color: #333333;
line-height: 35rpx;
margin-bottom: 8rpx;
}
.bottom {
display: flex;
justify-content: space-between;
font-size: 25rpx;
font-weight: 400;
color: #999999;
line-height: 35rpx;
}
}
}
</style>