152 lines
4.6 KiB
Vue
152 lines
4.6 KiB
Vue
<template>
|
||
<div class="container">
|
||
<div>
|
||
<uni-datetime-picker
|
||
v-model="queryForm.dateRange"
|
||
type="daterange"
|
||
:end="new Date().toISOString().split('T')[0]"
|
||
@change="changeDate"
|
||
/>
|
||
<div style="display: flex; align-items: center; margin-top: 6px; margin-bottom: 10px">
|
||
<uni-easyinput v-model="queryForm.keyWord" placeholder="请输入内容"></uni-easyinput>
|
||
<button
|
||
size="mini"
|
||
@click="handleQuery"
|
||
style="margin: 0 5px; background: #f09937; color: #fff"
|
||
>
|
||
查询
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 列表 -->
|
||
<div>
|
||
<div v-for="(item, index) in listData" :key="item.id" @click="handleEdit(item)">
|
||
<uni-card is-shadow is-full spacing="0px" style="margin-bottom: 6px">
|
||
<div style="display: flex; align-items: flex-start">
|
||
<div style="margin-right: 6px">{{ index + 1 }}.</div>
|
||
<div>
|
||
<div>申请时间：{{ item.createTime }}</div>
|
||
<div>申请人：{{ item.createBy }}</div>
|
||
<div>租赁单位：{{ item.unitName }}</div>
|
||
<div>租赁工程：{{ item.projectName }}</div>
|
||
<div>租赁费用(元)：{{ item.leaseCost }}</div>
|
||
<div>维修费用(元)：{{ item.repairCost }}</div>
|
||
<div>丢失费用(元)：{{ item.loseCost }}</div>
|
||
<div>报废费用(元)：{{ item.scrapCost }}</div>
|
||
<div>减免费用(元)：{{ item.reductionCost }}</div>
|
||
<div>结算费用(元)：{{ item.totalCostAll }}</div>
|
||
<div>
|
||
状态：
|
||
<span v-if="item.status == '2'" class="text-color-success"
|
||
>已结算</span
|
||
>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</uni-card>
|
||
</div>
|
||
<div class="no-data">
|
||
{{ listData && listData.length == 0 ? '暂无数据' : '没有更多数据了~' }}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { ref, reactive, onMounted } from 'vue'
|
||
import { getSltRecordQueryList } from '@/services/integratedQuery'
|
||
|
||
// 查询表单
|
||
const queryForm = reactive({
|
||
dateRange: [
|
||
new Date(new Date().getTime() - 30 * 24 * 60 * 60 * 1000).toISOString().split('T')[0],
|
||
new Date().toISOString().split('T')[0],
|
||
],
|
||
keyWord: '',
|
||
})
|
||
|
||
const selectValue = ref(0) // 单选框选中的值
|
||
|
||
// 列表数据
|
||
const listData: any = ref([])
|
||
|
||
onMounted(() => {
|
||
getList()
|
||
})
|
||
|
||
// 获取列表数据
|
||
const getList = async () => {
|
||
try {
|
||
uni.showLoading({ title: '加载中', mask: true })
|
||
const params = {
|
||
startDate: queryForm.dateRange[0],
|
||
endDate: queryForm.dateRange[1],
|
||
keyWord: queryForm.keyWord,
|
||
}
|
||
console.log('🚀 ~ getList ~ params:', params)
|
||
const res = await getSltRecordQueryList(params)
|
||
console.log('🚀 ~ getList ~ res:', res)
|
||
listData.value = res.data
|
||
} catch (error) {
|
||
console.log('🚀 ~ getList ~ error', error)
|
||
} finally {
|
||
uni.hideLoading()
|
||
}
|
||
}
|
||
|
||
// 日期选择
|
||
const changeDate = () => {
|
||
console.log('changeDate', queryForm.dateRange)
|
||
}
|
||
|
||
// 查询
|
||
const handleQuery = () => {
|
||
console.log('🚀 ~ handleQuery ~ :', queryForm)
|
||
getList()
|
||
}
|
||
|
||
// 单选框
|
||
const changeCheckbox = () => {
|
||
console.log('🚀 ~ changeCheckbox ~ :', selectValue.value)
|
||
getList()
|
||
}
|
||
|
||
// 编辑
|
||
const handleEdit = (item) => {
|
||
console.log('🚀 ~ handleEdit ~ :', item)
|
||
// if (item.taskStatus == '0') {
|
||
// const params = item
|
||
// uni.navigateTo({
|
||
// url:
|
||
// '/pages/integratedQuery/receiveRecord/receiveRecordEdit?params=' +
|
||
// JSON.stringify(params),
|
||
// })
|
||
// }
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
page {
|
||
background-color: #f7f8fa;
|
||
}
|
||
.container {
|
||
padding: 8px;
|
||
// 长文本换行
|
||
white-space: normal;
|
||
word-break: break-all;
|
||
|
||
.text-color {
|
||
color: #f56c6c;
|
||
}
|
||
.text-color-success {
|
||
color: #67c23a;
|
||
}
|
||
}
|
||
.no-data {
|
||
text-align: center;
|
||
color: #999;
|
||
padding: 10px 0;
|
||
}
|
||
</style>
|