123 lines
3.6 KiB
Vue
Executable File
123 lines
3.6 KiB
Vue
Executable File
<template>
|
||
<div class="layout-padding">
|
||
<div class="layout-padding-auto layout-padding-view">
|
||
<!-- 搜索表单 -->
|
||
<el-row shadow="hover" v-show="showSearch">
|
||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||
<el-form-item label="单位名称" prop="companyName">
|
||
<el-input
|
||
v-model="state.queryForm.companyName"
|
||
placeholder="请输入单位名称"
|
||
clearable
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button icon="search" type="primary" @click="getDataList">
|
||
查询
|
||
</el-button>
|
||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
</el-row>
|
||
|
||
<!-- 表格 -->
|
||
<el-table
|
||
ref="tableRef"
|
||
:data="state.dataList"
|
||
v-loading="state.loading"
|
||
border
|
||
row-key="id"
|
||
:cell-style="tableStyle.cellStyle"
|
||
:header-cell-style="tableStyle.headerCellStyle"
|
||
>
|
||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||
|
||
<el-table-column prop="companyName" label="单位名称" min-width="200" align="center" show-overflow-tooltip />
|
||
|
||
<el-table-column label="允许时段" min-width="250" align="center">
|
||
<template #default="scope">
|
||
<span v-if="scope.row.allowStartTime && scope.row.allowEndTime">
|
||
{{ scope.row.allowStartTime }} - {{ scope.row.allowEndTime }}
|
||
</span>
|
||
<span v-else>-</span>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column prop="updateTime" label="更新时间" min-width="180" align="center" />
|
||
|
||
<!-- 操作列已注释，此页面为只读 -->
|
||
<!-- <el-table-column label="操作" width="150" align="center" fixed="right">
|
||
<template #default="scope">
|
||
<el-button
|
||
v-if="hasAuth('professional_outercompany_edit')"
|
||
icon="edit-pen"
|
||
text
|
||
type="primary"
|
||
@click="handleEdit(scope.row)">修改
|
||
</el-button>
|
||
<el-button
|
||
v-if="hasAuth('professional_outercompany_del')"
|
||
icon="delete"
|
||
text
|
||
type="danger"
|
||
style="margin-left: 12px"
|
||
@click="handleDel(scope.row)">删除
|
||
</el-button>
|
||
</template>
|
||
</el-table-column> -->
|
||
</el-table>
|
||
|
||
<!-- 分页 -->
|
||
<pagination
|
||
v-bind="state.pagination"
|
||
@current-change="currentChangeHandle"
|
||
@size-change="sizeChangeHandle"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { ref, reactive } from 'vue'
|
||
import { BasicTableProps, useTable } from '/@/hooks/table'
|
||
import { fetchList } from '/@/api/professional/stayschool/outercompany'
|
||
|
||
|
||
// 表格引用
|
||
const tableRef = ref()
|
||
const queryRef = ref()
|
||
|
||
// 搜索显示
|
||
const showSearch = ref(true)
|
||
|
||
// 配置 useTable
|
||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||
pageList: async (params: any) => {
|
||
const response = await fetchList({
|
||
...params,
|
||
companyType: '1'
|
||
})
|
||
return {
|
||
data: {
|
||
records: response.data.records || [],
|
||
total: response.data.total || 0
|
||
}
|
||
}
|
||
},
|
||
queryForm: {
|
||
companyName: ''
|
||
}
|
||
})
|
||
|
||
const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTable(state)
|
||
|
||
// 重置查询
|
||
const resetQuery = () => {
|
||
queryRef.value?.resetFields()
|
||
getDataList()
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
</style>
|