初始化移动端提交
This commit is contained in:
chenbowen
192
pages/app/democontract/index.vue
Normal file
192
pages/app/democontract/index.vue
Normal file
@@ -0,0 +1,192 @@
|
||||
<template>
|
||||
<view class="app-container">
|
||||
<!-- 搜索工作栏 -->
|
||||
<view class="search-section">
|
||||
<u-search
|
||||
placeholder="请输入合同名称"
|
||||
v-model="queryParams.name"
|
||||
:show-action="true"
|
||||
action-text="搜索"
|
||||
@custom="handleQuery"
|
||||
@search="handleQuery"
|
||||
></u-search>
|
||||
|
||||
<!-- 高级搜索 -->
|
||||
<view class="advanced-search" v-if="showAdvanced">
|
||||
<u-form :model="queryParams" label-width="120rpx">
|
||||
<u-form-item label="合同编号">
|
||||
<u-input v-model="queryParams.code" placeholder="请输入合同编号" />
|
||||
</u-form-item>
|
||||
<u-form-item label="合同金额">
|
||||
<u-input v-model="queryParams.amount" placeholder="请输入合同金额" type="number" />
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
</view>
|
||||
|
||||
<view class="search-toggle">
|
||||
<u-button type="info" size="small" @click="showAdvanced = !showAdvanced">
|
||||
{{ showAdvanced ? '收起' : '高级搜索' }}
|
||||
</u-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<view class="action-bar">
|
||||
<u-button type="primary" icon="plus" text="新增" @click="openForm('create')"></u-button>
|
||||
</view>
|
||||
|
||||
<!-- 列表 -->
|
||||
<u-list @scrolltolower="scrolltolower">
|
||||
<u-list-item v-for="item in list" :key="item.id">
|
||||
<u-cell :title="item.name" :label="item.code">
|
||||
<template #value>
|
||||
<view class="item-info">
|
||||
<text class="info-text">状态: {{ getStatusText(item.status) }}</text>
|
||||
<text class="info-text">金额: ¥{{ item.amount || 0 }}</text>
|
||||
<text class="info-text" v-if="item.signDate">签订: {{ sheep.$helper.timeFormat(item.signDate, 'yyyy-mm-dd') }}</text>
|
||||
</view>
|
||||
</template>
|
||||
<template #right-icon>
|
||||
<view class="action-buttons">
|
||||
<u-button type="primary" size="mini" @click="openForm('update', item.id)">编辑</u-button>
|
||||
<u-button type="error" size="mini" @click="handleDelete(item.id)">删除</u-button>
|
||||
</view>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-list-item>
|
||||
<u-loadmore :status="status" />
|
||||
</u-list>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import sheep from '@/sheep'
|
||||
import { ref, reactive, onMounted } from 'vue'
|
||||
import DemoContractApi from '@/sheep/api/infra/democontract'
|
||||
import { onPullDownRefresh, onReachBottom } from '@dcloudio/uni-app'
|
||||
|
||||
const loading = ref(false)
|
||||
const total = ref(0)
|
||||
const list = ref([])
|
||||
const showAdvanced = ref(false)
|
||||
const queryParams = reactive({
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
code: '',
|
||||
name: '',
|
||||
status: '',
|
||||
signDate: [],
|
||||
startDate: [],
|
||||
endDate: [],
|
||||
amount: '',
|
||||
remark: '',
|
||||
postId: ''
|
||||
})
|
||||
const status = ref('loadmore')
|
||||
|
||||
const getList = async () => {
|
||||
loading.value = true
|
||||
status.value = 'loading'
|
||||
try {
|
||||
const { data } = await DemoContractApi.getDemoContractPage(queryParams)
|
||||
if (queryParams.pageNo === 1) {
|
||||
list.value = data.list
|
||||
} else {
|
||||
list.value = list.value.concat(data.list)
|
||||
}
|
||||
total.value = data.total
|
||||
if (list.value.length >= total.value) {
|
||||
status.value = 'nomore'
|
||||
} else {
|
||||
status.value = 'loadmore'
|
||||
}
|
||||
} finally {
|
||||
loading.value = false
|
||||
uni.stopPullDownRefresh()
|
||||
}
|
||||
}
|
||||
|
||||
const handleQuery = () => {
|
||||
queryParams.pageNo = 1
|
||||
getList()
|
||||
}
|
||||
|
||||
const openForm = (type, id) => {
|
||||
let url = `/pages/app/democontract/form?type=${type}`
|
||||
if (id) {
|
||||
url += `&id=${id}`
|
||||
}
|
||||
uni.navigateTo({ url })
|
||||
}
|
||||
|
||||
const handleDelete = async (id) => {
|
||||
const [err, res] = await uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定要删除吗？'
|
||||
})
|
||||
if (res && res.confirm) {
|
||||
await DemoContractApi.deleteDemoContract(id)
|
||||
uni.showToast({ title: '删除成功' })
|
||||
handleQuery() // 重新加载列表
|
||||
}
|
||||
}
|
||||
|
||||
const getStatusText = (status) => {
|
||||
// 根据实际状态值进行映射，这里需要根据字典或枚举值调整
|
||||
const statusMap = {
|
||||
0: '草稿',
|
||||
1: '审核中',
|
||||
2: '已通过',
|
||||
3: '已拒绝'
|
||||
}
|
||||
return statusMap[status] || '未知'
|
||||
}
|
||||
|
||||
const scrolltolower = () => {
|
||||
if (status.value === 'loadmore') {
|
||||
queryParams.pageNo++
|
||||
getList()
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getList()
|
||||
})
|
||||
|
||||
onPullDownRefresh(() => {
|
||||
handleQuery()
|
||||
})
|
||||
|
||||
onReachBottom(() => {
|
||||
scrolltolower()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.search-wrap {
|
||||
padding: 20rpx;
|
||||
background: #fff;
|
||||
}
|
||||
.action-bar {
|
||||
padding: 20rpx;
|
||||
}
|
||||
.list-wrap {
|
||||
.list-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 20rpx;
|
||||
background: #fff;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
.item-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.item-desc {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user