提交文件管理前端页面代码
This commit is contained in:
@@ -1,5 +1,108 @@
|
||||
<template>
|
||||
<div >
|
||||
文件管
|
||||
<span class="up-query-param-span">
|
||||
<a-form :model="queryParam" :label-col="2" :wrapper-col="3">
|
||||
<a-row :gutter="16">
|
||||
<a-col :span="5">
|
||||
<a-form-item label="文件名">
|
||||
<a-input v-model:value="queryParam.name" placeholder="Basic usage" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="5">
|
||||
<a-form-item label="文件状态">
|
||||
<a-select ref="select" v-model:value="queryParam.status">
|
||||
<a-select-option value="0">全部</a-select-option>
|
||||
<a-select-option value="1">未删除</a-select-option>
|
||||
<a-select-option value="2">已删除</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="5">
|
||||
<a-form-item label="文档状态">
|
||||
<a-select ref="select" v-model:value="queryParam.file">
|
||||
<a-select-option value="0">全部</a-select-option>
|
||||
<a-select-option value="1">未删除</a-select-option>
|
||||
<a-select-option value="2">已删除</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="5">
|
||||
<a-form-item label="文件类型">
|
||||
<a-select
|
||||
ref="select"
|
||||
v-model:value="queryParam.type"
|
||||
>
|
||||
<a-select-option value="0">全部</a-select-option>
|
||||
<a-select-option value="1">附件</a-select-option>
|
||||
<a-select-option value="2">文档内含附件</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="4">
|
||||
<a-button type="primary" @click="onSubmit">查询</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</span>
|
||||
<a-divider />
|
||||
<a-table :columns="columns" :data-source="table" :pagination="{ pageSize: 10 }" :scroll="{ x: 1200, y: 'calc(100vh - 280px)' }">
|
||||
<template v-slot:bodyCell="{ column, record ,index}">
|
||||
<span v-if="column.key === 'action'">
|
||||
<a-button @click="showDoc(record)">
|
||||
<template #icon><AimOutlined /></template>
|
||||
关联文档
|
||||
</a-button>
|
||||
</span>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import {AimOutlined} from '@ant-design/icons-vue';
|
||||
import {ref} from "vue";
|
||||
let visible = ref(false)
|
||||
let queryParam = ref({
|
||||
name:'',
|
||||
status:'0',
|
||||
file:'0',
|
||||
type:'0'
|
||||
})
|
||||
let table = ref([
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',},
|
||||
{key: 321, name: 'Edward Kingsssssssssssssssssssssssssssssssssssss ', age: 32, address: 'London, Park Lane no. ',}
|
||||
]);
|
||||
let columns = ref([
|
||||
{title: '文件名称', dataIndex: 'name', width: '500' ,},
|
||||
{title: '文件大小', dataIndex: 'age', width: '100',},
|
||||
{title: '文件状态', dataIndex: 'address', width: '100',},
|
||||
{title: '文档状态', dataIndex: 'address', width: '100',},
|
||||
{title: '上传者', dataIndex: 'address', width: '150',},
|
||||
{title: '上传时间', dataIndex: 'address', width: '150',},
|
||||
{ title: '详情查看', key: 'action', fixed: 'right',width: '150',},
|
||||
])
|
||||
const onSubmit = () => {
|
||||
}
|
||||
const showDoc = (record) => {
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.up-query-param-span{
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user