beta
This commit is contained in:
@@ -0,0 +1,297 @@
|
||||
<template>
|
||||
<view class="ant-layout page">
|
||||
<page-header></page-header>
|
||||
<head-title title="人员维护">
|
||||
<template #rightBtn>
|
||||
<view class="ant-btn" @click="add">新增</view>
|
||||
</template>
|
||||
</head-title>
|
||||
<view class="ant-layout-content content">
|
||||
<table class="ant-table">
|
||||
<thead class="ant-table-thead">
|
||||
<tr>
|
||||
<th>序号</th>
|
||||
<th>姓名</th>
|
||||
<th>科室</th>
|
||||
<th>工号</th>
|
||||
<th>卡号</th>
|
||||
<th>卡号2</th>
|
||||
</tr>
|
||||
|
||||
</thead>
|
||||
<tbody class="ant-table-tbody">
|
||||
<tr v-for="(item, index) in list" :key="index">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ item.name }}</td>
|
||||
<td>{{ item.type }}</td>
|
||||
<td>{{ item.number }}</td>
|
||||
<td>{{ item.ic }}</td>
|
||||
<td>{{ item.ic2 }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</view>
|
||||
<view class="ant-layout-footer footer">
|
||||
<view class="pagenation">
|
||||
<uni-row style="margin: 0;">
|
||||
<uni-col :span="8" style="text-align: left;">
|
||||
<view class="ant-btn" @click="pre">上一页</view>
|
||||
</uni-col>
|
||||
<uni-col :span="8" style="line-height: 48px;">
|
||||
第{{ page }}页/共 {{ totalPage }} 页
|
||||
</uni-col>
|
||||
<uni-col :span="8" style="text-align: right;">
|
||||
<view class="ant-btn" @click="next">下一页</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</view>
|
||||
</view>
|
||||
<notice ref="notice"/>
|
||||
<uni-popup ref="popup" :mask-click="false">
|
||||
<view class="pop-content">
|
||||
<uni-row>
|
||||
<uni-col :span="8">
|
||||
<view class="ant-input-group">
|
||||
<view class="ant-form-item-label">*姓名：</view>
|
||||
</view>
|
||||
</uni-col>
|
||||
<uni-col :span="16">
|
||||
<input class="ant-input" v-model="form.name"/>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
<uni-row>
|
||||
<uni-col :span="8">
|
||||
<view class="ant-input-group">
|
||||
<view class="ant-form-item-label">*卡号：</view>
|
||||
</view>
|
||||
</uni-col>
|
||||
<uni-col :span="16">
|
||||
<input class="ant-input" v-model="form.ic"/>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
<uni-row>
|
||||
<uni-col :span="8">
|
||||
<view class="ant-input-group">
|
||||
<view class="ant-form-item-label">卡号2：</view>
|
||||
</view>
|
||||
</uni-col>
|
||||
<uni-col :span="16">
|
||||
<input class="ant-input" v-model="form.ic2"/>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
<uni-row>
|
||||
<uni-col :span="8">
|
||||
<view class="ant-input-group">
|
||||
<view class="ant-form-item-label">工号：</view>
|
||||
</view>
|
||||
</uni-col>
|
||||
<uni-col :span="16">
|
||||
<input class="ant-input" v-model="form.number"/>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
<uni-row>
|
||||
<uni-col :span="8">
|
||||
<view class="ant-input-group">
|
||||
<view class="ant-form-item-label">科室：</view>
|
||||
</view>
|
||||
</uni-col>
|
||||
<uni-col :span="16">
|
||||
<input class="ant-input" v-model="form.type"/>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
<uni-row>
|
||||
<uni-col>
|
||||
<view class="form-btn">
|
||||
<view class="ant-btn" @click="submit">保存</view>
|
||||
<view class="ant-btn" style="margin-left: 20px;" @click="close">取消</view>
|
||||
</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</view>
|
||||
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PageHeader from '@/components/PageHeader.vue'
|
||||
import HeadTitle from '@/components/HeadTitle.vue'
|
||||
import Notice from '@/components/Notice.vue';
|
||||
import * as db from '@/db/sqlite.js'
|
||||
export default {
|
||||
components: {
|
||||
PageHeader,Notice,HeadTitle
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: [
|
||||
{
|
||||
ic: '11111111111111',
|
||||
name: '张三',
|
||||
type: '清洗科',
|
||||
number: '1111111111',
|
||||
}
|
||||
],
|
||||
page: 1,
|
||||
totalPage: 0,
|
||||
form: {
|
||||
name: '',
|
||||
ic: '',
|
||||
ic2: '',
|
||||
number: '',
|
||||
type: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
|
||||
add() {
|
||||
this.$refs.popup.open()
|
||||
this.form = {
|
||||
name: '',
|
||||
ic: '',
|
||||
ic2: '',
|
||||
number: '',
|
||||
type: ''
|
||||
}
|
||||
uni.$on('ic', (val) => {
|
||||
if (!this.form.ic) {
|
||||
this.form.ic = val
|
||||
} else if (!this.form.ic2) {
|
||||
this.form.ic2 = val
|
||||
}
|
||||
})
|
||||
},
|
||||
close() {
|
||||
this.$refs.popup.close()
|
||||
uni.$off('ic')
|
||||
},
|
||||
async submit() {
|
||||
if (this.form.name == '' || this.form.ic == '') {
|
||||
return false
|
||||
}
|
||||
let tableName = 'user'
|
||||
let isTable = await db.isTable(tableName)
|
||||
if (!isTable) {
|
||||
await db.addUserTable()
|
||||
}
|
||||
try {
|
||||
await db.addTabItem(tableName, { ...this.form })
|
||||
this.$refs.popup.close()
|
||||
uni.showToast({
|
||||
title: '保存成功',
|
||||
icon: 'none'
|
||||
})
|
||||
this.getList()
|
||||
} catch (error) {
|
||||
uni.showToast({
|
||||
title: '保存失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
getList() {
|
||||
db.getDataList('user', this.page, 15, '', '').then(res => {
|
||||
this.list = res.list
|
||||
this.totalPage = res.totalPage
|
||||
})
|
||||
},
|
||||
// 上一页
|
||||
pre() {
|
||||
if (this.page > 1) {
|
||||
this.page--
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
// 下一页
|
||||
next() {
|
||||
if (this.page < this.totalPage) {
|
||||
this.page++
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.page{
|
||||
background: transparent;
|
||||
height: 100%;
|
||||
}
|
||||
.content{
|
||||
color: #747A8D;
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.footer{
|
||||
background: transparent;
|
||||
padding: 20px;
|
||||
}
|
||||
.pagenation{
|
||||
height: 50px;
|
||||
color: #747A8D;
|
||||
font-size: 16px;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
.pagenation .ant-btn{
|
||||
width: 143px;
|
||||
height: 50px;
|
||||
border-radius: 50px;
|
||||
box-shadow: none;
|
||||
font-size: 24px;
|
||||
font-weight: 500;
|
||||
background: #2F3242;
|
||||
color: #fff;
|
||||
border-color: #2F3242;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
.pop-content{
|
||||
padding: 30px;
|
||||
padding-top: 50px;
|
||||
width: 500px;
|
||||
min-height: 400px;
|
||||
border-radius: 15px;
|
||||
background: #777D90;
|
||||
}
|
||||
.pop-content .uni-row{
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.ant-form-item-label{
|
||||
color: #fff;
|
||||
font-size: 18px;
|
||||
line-height: 40px;
|
||||
}
|
||||
.ant-input{
|
||||
height: 40px;
|
||||
font-size: 18px;
|
||||
}
|
||||
.form-text{
|
||||
color: #747A8D;
|
||||
line-height: 40px;
|
||||
text-align: left;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.ant-btn{
|
||||
line-height: 38px;
|
||||
background: #2F3242;
|
||||
border-color: #2F3242;
|
||||
height: 46px;
|
||||
width: 128px;
|
||||
border-radius: 50px;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
}
|
||||
.form-btn{
|
||||
margin-top: 30px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user