<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>
|