特易招,招聘小程序
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.
 
 
 

405 lines
8.0 KiB

<template>
<view class="page">
<navbar title="记工记账" />
<view class="page-tag">
<uv-tabs :list="tabs"
@click="clickTabsType"
lineWidth="55"
lineHeight="8" :activeStyle="{
color: '#3796F8',
}" :inactiveStyle="{
color: '#999999',
}" itemStyle="padding:60rpx 20rpx 20rpx 20rpx;width: 44%;"></uv-tabs>
</view>
<view class="page-picture">
<view class="page-picture-img">
<view class="page-picture-group" @click="form = {};show = true">
<image src="../../static/image/keepAccounts/artisan.png" mode="aspectFit" />
<view>
新建账本
</view>
</view>
</view>
<view class="page-picture-img"
@click="$utils.navigateTo('/pages_order/kepp/AnnualExpenditure')">
<view class="page-picture-group">
<image src="../../static/image/keepAccounts/wallet.png" mode="aspectFit" />
<view>全年收支</view>
</view>
</view>
<view class="page-picture-img" @click="$utils.navigateTo('/pages_order/kepp/MechanicProblem')">
<view class="page-picture-group">
<image src="../../static/image/keepAccounts/accountBook.png" mode="aspectFit" />
<view>
技工问题
</view>
</view>
</view>
</view>
<view style="font-weight: 500; margin-top: 20rpx;">
<uv-tabs :list="tabsSatus"
@click="clickTabsStatus"
lineWidth="0" lineHeight="0" :activeStyle="{
color: '#3796F8',
}"></uv-tabs>
</view>
<view class="list">
<view class="item"
v-for="(item, index) in list"
@click="$utils.navigateTo('/pages_order/kepp/keepAccountsDetail?id=' + item.id)"
:key="index">
<view class="top">
<view class="title">
{{ item.title }}
</view>
<view class="date">
{{ item.createTime }}
</view>
</view>
<view class="btn">
<view class="left"
@click.stop="openUpdate(item)">
<uv-icon
name="setting"
size="40rpx"></uv-icon>
设置
</view>
<view class="right">
<view class="b1"
@click.stop="$utils.navigateTo('/pages_order/kepp/addWorkEntryRecords?id=' + item.id)">
记工
</view>
<view class="b2"
@click.stop="$utils.navigateTo('/pages_order/kepp/addPriceEntryRecords?id=' + item.id)">
记账
</view>
</view>
</view>
</view>
</view>
<uv-empty mode="list" v-if="list.length == 0"></uv-empty>
<uv-overlay :show="show">
<view class="warp">
<view class="rect">
<view class="warp-top">
{{ addOrUpdate ? '编辑项目' : '新建项目'}}
</view>
<view class="rect-two">
<view class="designation">项目名称</view>
<view class="wire" />
<!-- <view class="description">请输入项目名称</view> -->
<input class="rect-input"
v-model="form.title"
placeholder="请输入项目名称"/>
<!-- <view class="option">
<select class="select">
<option value="option1">收入 </option>
</select>
</view> -->
<!-- <view class="introduce">
项目金额:1314元
</view> -->
<view class=""
v-if="form.id">
<uv-radio-group v-model="form.status">
<view style="display: flex;">
<uv-radio
:customStyle="{margin: '8px'}"
v-for="(item, index) in statusList"
:key="index"
iconSize="30rpx"
size="40rpx"
labelSize="26rpx"
:label="item.name"
:name="item.value">
</uv-radio>
</view>
</uv-radio-group>
</view>
<view class="button">
<view @click="show = false">取消</view>
<view @click="submit">确定</view>
</view>
</view>
</view>
</view>
</uv-overlay>
<tabber select="1" />
</view>
</template>
<script>
import tabber from '@/components/base/tabbar.vue'
import mixinList from '@/mixins/list.js'
export default {
mixins : [mixinList],
components: {
tabber,
},
data() {
return {
tabs: [
{
name: '个人记工',
},
{
name: '班组记工',
},
],
tabsSatus : [
{
name: '在建项目',
},
{
name: '结束项目',
},
],
statusList : [
{
name : '在建',
value : 0,
},
{
name : '结束',
value : 1,
},
],
show: false,
mixinsListApi : 'commonQueryNotebookList',
addOrUpdate : false,
form : {
title : '',
status : 0,
},
}
},
computed: {
},
onLoad() {
this.queryParams.status = 0
this.queryParams.type = 0
},
methods: {
clickTabsType({index}){
this.queryParams.type = index
this.getData()
},
clickTabsStatus({index}){
this.queryParams.status = index
this.getData()
},
submit(){
if(this.$utils.verificationAll(this.form, {
title : '请输入项目名称',//
})){
return
}
this.form.type = this.queryParams.type
this.$api('addNoteBook', this.form, res => {
if(res.code == 200){
this.show = false
this.form = {
title : '',
status : 0,
}
this.getData()
}
})
},
openUpdate(item){
this.form = {
id : item.id,
title : item.title,
status : item.status,
}
this.addOrUpdate = true
this.show = true
this.getData()
}
}
}
</script>
<style scoped lang="scss">
.page {
.page-tag {
font-weight: 600;
}
.page-picture {
margin-top: 40rpx;
display: flex;
justify-content: space-around;
.page-picture-img {
width: 220rpx;
height: 220rpx;
display: flex;
justify-content: center;
align-items: center;
background-color: #fff;
border-radius: 10rpx;
.page-picture-group {
height: 80rpx;
image {
width: 100%;
height: 100%;
}
}
}
}
.list{
.item{
margin: 30rpx;
background-color: #fff;
padding: 20rpx;
border-radius: 20rpx;
.top{
display: flex;
justify-content: space-between;
padding: 20rpx;
.title{
font-weight: 900;
}
.date{
}
}
.btn{
display: flex;
justify-content: space-between;
padding: 20rpx;
.left{
display: flex;
align-items: center;
}
.right{
display: flex;
view{
padding: 15rpx 40rpx;
margin: 0 10rpx;
border-radius: 10rpx;
}
.b1{
border: 1px solid #FFA011;
color: #FFA011;
}
.b2{
background: $uni-color;
color: #fff;
}
}
}
}
}
.warp {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
.rect {
width: 90%;
background-color: #fff;
border-radius: 20rpx;
overflow: hidden;
.warp-top {
text-align: center;
font-size: 24rpx;
padding: 15rpx 0;
color: #FFFFFF;
background-color: #3796F8;
}
.rect-two {
width: 90%;
margin-left: 5%;
font-size: 28rpx;
.designation {
padding: 20rpx 0;
color: #333;
font-weight: 600;
}
}
.wire {
border-bottom: 4rpx dashed rgb(168, 197, 255);
}
.description {
padding: 20rpx 0;
color: #666666;
}
.rect-input {
height: 40rpx;
background-color: #EBF0FC;
border: 2rpx solid #4280FD;
border-radius: 14rpx;
padding: 10rpx 20rpx;
}
.option {
padding: 40rpx 40rpx 40rpx 0rpx;
.select {
background-color: #EBF0FC;
padding: 10rpx 20rpx;
color: #4280FD;
border: 2rpx solid #4280FD;
border-radius: 5rpx;
}
}
.introduce {
text-align: center;
background-color: #EBF0FC;
padding: 20rpx 0;
color: #4280FD;
}
.button {
display: flex;
justify-content: space-around;
text-align: center;
align-content: center;
margin: 50rpx 0;
view:nth-child(1) {
color: #575757;
border: 2rpx solid #C7C7C7;
}
view:nth-child(2) {
color: #FFFFFF;
background-color: #3796F8;
}
view {
width: 45%;
padding: 15rpx 0;
border-radius: 32rpx;
font-size: 24rpx;
}
}
}
}
}
</style>