|
|
@ -1,9 +1,73 @@ |
|
|
|
<template> |
|
|
|
<view class="page"> |
|
|
|
|
|
|
|
<navbar |
|
|
|
title="记工记账" |
|
|
|
/> |
|
|
|
<navbar title="记工记账" /> |
|
|
|
<view class="page-tag"> |
|
|
|
<uv-tabs :list="list" 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="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="list" lineWidth="0" lineHeight="0" :activeStyle="{ |
|
|
|
color: '#3796F8', |
|
|
|
}"></uv-tabs> |
|
|
|
</view> |
|
|
|
|
|
|
|
<uv-overlay :show="show"> |
|
|
|
<view class="warp"> |
|
|
|
<view class="rect"> |
|
|
|
<view class="warp-top"> |
|
|
|
新建项目 |
|
|
|
</view> |
|
|
|
<view class="rect-two"> |
|
|
|
<view class="designation">项目名称:</view> |
|
|
|
<view class="wire" /> |
|
|
|
<view class="description">请输入项目名称:</view> |
|
|
|
<input class="rect-input" /> |
|
|
|
<view class="wire" style="margin-top: 20rpx;" /> |
|
|
|
<view class="option"> |
|
|
|
<select class="select"> |
|
|
|
<option value="option1">收入 </option> |
|
|
|
</select> |
|
|
|
</view> |
|
|
|
<view class="introduce"> |
|
|
|
项目金额:1314元 |
|
|
|
</view> |
|
|
|
<view class="button"> |
|
|
|
<view @click="isShohw">取消</view> |
|
|
|
<view>确定</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</uv-overlay> |
|
|
|
|
|
|
|
|
|
|
|
<tabber select="1" /> |
|
|
@ -19,19 +83,152 @@ |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
|
|
|
|
list: [{ |
|
|
|
name: '个人记工', |
|
|
|
}, { |
|
|
|
name: '班组记工', |
|
|
|
}], |
|
|
|
show: false |
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
|
|
|
|
}, |
|
|
|
onReady() { |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
methods: { |
|
|
|
isShohw(){ |
|
|
|
this.show = false |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</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%; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.warp { |
|
|
|
display: flex; |
|
|
|
justify-content: center; |
|
|
|
align-items: center; |
|
|
|
height: 100%; |
|
|
|
|
|
|
|
.rect { |
|
|
|
width: 90%; |
|
|
|
height: 700rpx; |
|
|
|
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: 60rpx; |
|
|
|
background-color: #EBF0FC; |
|
|
|
border: 2rpx solid #4280FD; |
|
|
|
border-radius: 14rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.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-top: 70rpx; |
|
|
|
|
|
|
|
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> |