126 lines
3.5 KiB
Vue
126 lines
3.5 KiB
Vue
<template>
|
|
<div class="container-wrapper">
|
|
<div class="top">
|
|
<el-button type="primary" :icon="Plus" @click="is_add = true">新增领用</el-button>
|
|
</div>
|
|
<div class="content">
|
|
<el-table :data="dataList" style="width: 100%" @row-click="rowClick">
|
|
<el-table-column prop="useCode" label="单号" width="180"></el-table-column>
|
|
<el-table-column prop="status" label="状态" width="180"></el-table-column>
|
|
<el-table-column prop="useUserId" label="领用人" width="180"></el-table-column>
|
|
<el-table-column prop="createDatetime" label="创建时间" width="300">
|
|
<template #default="scope">
|
|
{{ formatDate(scope.row.createDatetime) }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="remark" label="备注"></el-table-column>
|
|
</el-table>
|
|
</div>
|
|
<div class="bottom">
|
|
<div class="page_btn_list">
|
|
<el-pagination
|
|
background
|
|
layout="prev, pager, next"
|
|
:page-size="pageSize"
|
|
:current-page="page"
|
|
:total="total"
|
|
@current-change="changePage"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<Mask :width="1200" :height="600" :top="100" :is-show="is_add" @close="is_add=false" title="新增">
|
|
<AddApply @close="closeAddApply"/>
|
|
</Mask>
|
|
<Mask :width="1200" :height="600" :top="100" :is-show="is_detail" @close="is_detail=false" title="编辑">
|
|
<DetailApply :id="id" @close="closeDetailApply"/>
|
|
</Mask>
|
|
</div>
|
|
</template>
|
|
<script setup lang="ts">
|
|
import Mask from "@/components/common/Mask.vue";
|
|
import AddApply from "@/components/inventory/apply/AddApply.vue";
|
|
import {onMounted, ref} from "vue";
|
|
import {post} from "@/utils/request.ts";
|
|
import DetailApply from "@/components/inventory/apply/DetailApply.vue";
|
|
import {Plus} from "@element-plus/icons-vue";
|
|
|
|
const is_add = ref(false)
|
|
const is_detail = ref(false)
|
|
const id = ref('')
|
|
const dataList = ref([])
|
|
const getList = () => {
|
|
const query = {
|
|
pageNum: 1,
|
|
pageSize: 20,
|
|
}
|
|
post("inventory/apply/list", {query: query}).then((res: any) => {
|
|
dataList.value = res.list
|
|
})
|
|
}
|
|
onMounted(() => {
|
|
getList()
|
|
})
|
|
//分页
|
|
let pageSize = ref(20)
|
|
let total = ref(0)
|
|
let page = ref(1)
|
|
let changePage = (value: number) => {
|
|
page.value = value
|
|
const query = {
|
|
pageNum: value,
|
|
pageSize: pageSize.value,
|
|
}
|
|
post("inventory/apply/list", {query: query}).then((res: any) => {
|
|
dataList.value = res.list
|
|
total.value = res.total_count
|
|
})
|
|
}
|
|
const closeAddApply = () => {
|
|
is_add.value = false
|
|
getList()
|
|
}
|
|
const closeDetailApply = () => {
|
|
is_detail.value = false
|
|
}
|
|
// 转成YYYY-MM-DD格式
|
|
const formatDate = (isoStr: any) => {
|
|
const date = new Date(isoStr);
|
|
return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`;
|
|
}
|
|
const rowClick = (row: any) => {
|
|
id.value = row.id
|
|
is_detail.value = true
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@use "@/assets/scss/base.scss";
|
|
.container-wrapper {
|
|
box-sizing: border-box;
|
|
padding: 24px;
|
|
overflow: hidden;
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
.content {
|
|
width: 100%;
|
|
flex: 1;
|
|
overflow: hidden;
|
|
margin-top: base.$margin-base;
|
|
}
|
|
.bottom {
|
|
width: 100%;
|
|
height: 60px;
|
|
background-color: #FFF;
|
|
box-sizing: border-box;
|
|
padding: 10px;
|
|
position: relative;
|
|
border-top: 1px solid #EEE;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
|
|
</style> |