zhc077
/
hnjd_comp
forked from wangjiadong/comp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改操作栏目样式问题

Browse Source
dev
JayChou 5 months ago
parent 6b820337aa
commit 057925af0f
2 changed files with 246 additions and 270 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      jeecgboot-vue3-master/src/views/annualCompPoint/committee/AnnualCompPointList.vue
  2. 514
      jeecgboot-vue3-master/src/views/annualCompPoint/superAdmin/AnnualCompPointListPass.vue

2
jeecgboot-vue3-master/src/views/annualCompPoint/committee/AnnualCompPointList.vue
Unescape View File

@ -105,7 +105,7 @@
canResize: false,
useSearchForm: false,
actionColumn: {
width: 550,
width: 220,
fixed: 'right',
},
beforeFetch: (params) => {

514
jeecgboot-vue3-master/src/views/annualCompPoint/superAdmin/AnnualCompPointListPass.vue
Unescape View File

@ -2,23 +2,17 @@
<div>
<!--查询区域-->
<div class="jeecg-basic-table-form-container">
<a-form ref="formRef" @keyup.enter.native="searchQuery" :model="queryParam"
:label-col="labelCol" :wrapper-col="wrapperCol">
<a-row :gutter="24">
</a-row>
<a-form ref="formRef" @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-row :gutter="24"> </a-row>
</a-form>
</div>
<!--引用表格-->
<BasicTable @register="registerTable" :rowSelection="rowSelection">
<!--插槽:table标题-->
<template #tableTitle>
<a-button type="primary" @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增
</a-button>
<a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出
</a-button>
<j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">
导入
</j-upload-button>
<a-button type="primary" @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增 </a-button>
<a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出 </a-button>
<j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls"> 导入 </j-upload-button>
<a-dropdown v-if="selectedRowKeys.length > 0">
<template #overlay>
<a-menu>
@ -28,28 +22,27 @@
</a-menu-item>
</a-menu>
</template>
<a-button>批量操作
<a-button
>批量操作
<Icon icon="mdi:chevron-down"></Icon>
</a-button>
</a-dropdown>
</template>
<!--操作栏-->
<template #action="{ record }">
<TableAction :actions="getTableAction(record)"/>
<TableAction :actions="getTableAction(record)" />
</template>
<!--字段回显插槽-->
<template #htmlSlot="{text}">
<template #htmlSlot="{ text }">
<div v-html="text"></div>
</template>
<!--省市区字段回显插槽-->
<template #pcaSlot="{text}">
<template #pcaSlot="{ text }">
{{ getAreaTextByCode(text) }}
</template>
<template #fileSlot="{text}">
<span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
<a-button v-else :ghost="true" type="primary" preIcon="ant-design:download-outlined"
size="small" @click="downloadFile(text)">下载
</a-button>
<template #fileSlot="{ text }">
<span v-if="!text" style="font-size: 12px; font-style: italic">无文件</span>
<a-button v-else :ghost="true" type="primary" preIcon="ant-design:download-outlined" size="small" @click="downloadFile(text)">下载 </a-button>
</template>
</BasicTable>
<!-- 表单区域 -->
@ -58,282 +51,265 @@
</template>
<script lang="ts" name="AnnualCompPoint-annualCompPoint" setup>
import {ref, reactive} from 'vue';
import {BasicTable, useTable, TableAction} from '/@/components/Table';
import {useListPage} from '/@/hooks/system/useListPage';
import {columns} from './AnnualCompPoint.data';
import {
list,
deleteOne,
batchDelete,
getImportUrl,
getExportUrl,
updateApply
} from './AnnualCompPoint.api';
import {downloadFile} from '/@/utils/common/renderUtils';
import AnnualCompPointModal from './components/AnnualCompPointModal.vue'
import JSwitch from '/@/components/Form/src/jeecg/components/JSwitch.vue';
import JSelectMultiple from '/@/components/Form/src/jeecg/components/JSelectMultiple.vue';
import JPopup from '/@/components/Form/src/jeecg/components/JPopup.vue';
import {router} from "/@/router";
import {useRouter} from "vue-router";
import {award} from "/@/views/award/AwardManagement.api.ts";
import { ref, reactive } from 'vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage';
import { columns } from './AnnualCompPoint.data';
import { list, deleteOne, batchDelete, getImportUrl, getExportUrl, updateApply } from './AnnualCompPoint.api';
import { downloadFile } from '/@/utils/common/renderUtils';
import AnnualCompPointModal from './components/AnnualCompPointModal.vue';
import JSwitch from '/@/components/Form/src/jeecg/components/JSwitch.vue';
import JSelectMultiple from '/@/components/Form/src/jeecg/components/JSelectMultiple.vue';
import JPopup from '/@/components/Form/src/jeecg/components/JPopup.vue';
import { router } from '/@/router';
import { useRouter } from 'vue-router';
import { award } from '/@/views/award/AwardManagement.api.ts';
const formRef = ref();
const queryParam = reactive<any>({});
const toggleSearchStatus = ref<boolean>(false);
const registerModal = ref();
//注册table数据
const {prefixCls, tableContext, onExportXls, onImportXls} = useListPage({
tableProps: {
title: '年度比赛项目管理',
api: list,
// api: () => list({ ...params, compStatus: compStatus }),
columns,
canResize: false,
useSearchForm: false,
actionColumn: {
width: 180,
fixed: 'right',
const formRef = ref();
const queryParam = reactive<any>({});
const toggleSearchStatus = ref<boolean>(false);
const registerModal = ref();
//注册table数据
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
tableProps: {
title: '年度比赛项目管理',
api: list,
// api: () => list({ ...params, compStatus: compStatus }),
columns,
canResize: false,
useSearchForm: false,
actionColumn: {
width: 180,
fixed: 'right',
},
beforeFetch: (params) => {
queryParam.annualCompState = 2;
return Object.assign(params, queryParam);
},
},
beforeFetch: (params) => {
queryParam.annualCompState=2;
return Object.assign(params, queryParam);
exportConfig: {
name: '年度比赛项目管理',
url: getExportUrl,
params: queryParam,
},
importConfig: {
url: getImportUrl,
success: handleSuccess,
},
},
exportConfig: {
name: "年度比赛项目管理",
url: getExportUrl,
params: queryParam,
},
importConfig: {
url: getImportUrl,
success: handleSuccess
},
});
const [registerTable, {
reload,
collapseAll,
updateTableDataRecord,
findTableDataRecord,
getDataSource
}, {rowSelection, selectedRowKeys}] = tableContext;
const labelCol = reactive({
xs: {span: 24},
sm: {span: 7},
});
const wrapperCol = reactive({
xs: {span: 24},
sm: {span: 16},
});
/**
* 新增事件
*/
function handleAdd() {
registerModal.value.disableSubmit = false;
registerModal.value.add();
}
/**
* 编辑事件
*/
function handleEdit(record: Recordable) {
registerModal.value.disableSubmit = false;
registerModal.value.edit(record);
}
/**
* 详情
*/
function handleDetail(record: Recordable) {
registerModal.value.disableSubmit = true;
registerModal.value.edit(record);
}
/**
* 年度项目管理 评奖
*/
const router = useRouter()
function pingjiang(record: Recordable) {
// console.log(record.id)
award({annualCompid:record.id})
router.push({
path: '/award/AwardManagementList',
query: {id: record.id}
});
}
/**
* 年度项目管理 报名管理
*/
function applicationManage(record: Recordable) {
router.push({
path: '/workManage/works',
query: {annualCompPointId: record.id}
});
}
/**
* 年度项目管理 选题管理
*/
function topicManage(record: Recordable) {
router.push({
path: '/workManage/works',
query: {annualCompPointId: record.id}
});
}
/**
* 年度项目管理 作品管理
*/
function workManage(record: Recordable) {
router.push({
path: '/workManage/works',
query: {annualCompPointId: record.id}
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] =
tableContext;
const labelCol = reactive({
xs: { span: 24 },
sm: { span: 7 },
});
}
/**
* 年度项目管理 评分管理
*/
function scoreManage(record: Recordable) {
router.push({
path: '/workManage/works',
query: {annualCompPointId: record.id}
const wrapperCol = reactive({
xs: { span: 24 },
sm: { span: 16 },
});
}
/**
* 新增事件
*/
function handleAdd() {
registerModal.value.disableSubmit = false;
registerModal.value.add();
}
/**
* 年度项目管理 评奖管理
*/
function awardManage(record: Recordable) {
router.push({
path: '/workManage/works',
query: {annualCompPointId: record.id}
});
}
/**
* 编辑事件
*/
function handleEdit(record: Recordable) {
registerModal.value.disableSubmit = false;
registerModal.value.edit(record);
}
/**
* 详情
*/
function handleDetail(record: Recordable) {
registerModal.value.disableSubmit = true;
registerModal.value.edit(record);
}
/**
* 年度项目管理 评奖
*/
const router = useRouter();
function pingjiang(record: Recordable) {
// console.log(record.id)
award({ annualCompid: record.id });
router.push({
path: '/award/AwardManagementList',
query: { id: record.id },
});
}
/**
* 年度项目管理 报名管理
*/
function applicationManage(record: Recordable) {
router.push({
path: '/workManage/works',
query: { annualCompPointId: record.id },
});
}
/**
* 年度项目管理 提交审核按钮
*/
function handleSubmitandApply(record: Recordable) {
updateApply({id: record.id, annualCompState: record.annualCompState}, handleSuccess);
}
/**
* 年度项目管理 选题管理
*/
function topicManage(record: Recordable) {
router.push({
path: '/workManage/works',
query: { annualCompPointId: record.id },
});
}
/**
* 删除事件
*/
async function handleDelete(record) {
await deleteOne({id: record.id}, handleSuccess);
}
/**
* 年度项目管理 作品管理
*/
function workManage(record: Recordable) {
router.push({
path: '/workManage/works',
query: { annualCompPointId: record.id },
});
}
/**
* 年度项目管理 评分管理
*/
function scoreManage(record: Recordable) {
router.push({
path: '/workManage/works',
query: { annualCompPointId: record.id },
});
}
/**
* 批量删除事件
*/
async function batchHandleDelete() {
await batchDelete({ids: selectedRowKeys.value}, handleSuccess);
}
/**
* 年度项目管理 评奖管理
*/
function awardManage(record: Recordable) {
router.push({
path: '/workManage/works',
query: { annualCompPointId: record.id },
});
}
/**
* 成功回调
*/
function handleSuccess() {
(selectedRowKeys.value = []) && reload();
}
/**
* 年度项目管理 提交审核按钮
*/
function handleSubmitandApply(record: Recordable) {
updateApply({ id: record.id, annualCompState: record.annualCompState }, handleSuccess);
}
/**
* 操作栏
*/
function getTableAction(record) {
const actions = [
{
label: '报名',
onClick: applicationManage.bind(null, record),
},
{
label: '选题',
onClick: topicManage.bind(null, record),
},
{
label: '作品管理',
onClick: workManage.bind(null, record),
},
{
label: '评分',
onClick: scoreManage.bind(null, record),
},
{
label: '评奖',
onClick: awardManage.bind(null, record),
},
{
label: '详情',
onClick: handleDetail.bind(null, record),
}, {
label: '删除',
popConfirm: {
title: '是否确认删除',
confirm: handleDelete.bind(null, record),
}
},
];
return actions;
}
/**
* 删除事件
*/
async function handleDelete(record) {
await deleteOne({ id: record.id }, handleSuccess);
}
/**
* 批量删除事件
*/
async function batchHandleDelete() {
await batchDelete({ ids: selectedRowKeys.value }, handleSuccess);
}
/**
* 查询
*/
function searchQuery() {
reload();
}
/**
* 成功回调
*/
function handleSuccess() {
(selectedRowKeys.value = []) && reload();
}
/**
* 重置
*/
function searchReset() {
formRef.value.resetFields();
selectedRowKeys.value = [];
//刷新数据
reload();
}
/**
* 操作栏
*/
function getTableAction(record) {
const actions = [
{
label: '报名',
onClick: applicationManage.bind(null, record),
},
{
label: '选题',
onClick: topicManage.bind(null, record),
},
{
label: '作品管理',
onClick: workManage.bind(null, record),
},
{
label: '评分',
onClick: scoreManage.bind(null, record),
},
{
label: '评奖',
onClick: awardManage.bind(null, record),
},
{
label: '详情',
onClick: handleDetail.bind(null, record),
},
{
label: '删除',
popConfirm: {
title: '是否确认删除',
confirm: handleDelete.bind(null, record),
},
},
];
return actions;
}
/**
* popup组件值改变事件
*/
function setFieldsValue(map) {
Object.keys(map).map((key) => {
queryParam[key] = map[key];
});
}
/**
* 查询
*/
function searchQuery() {
reload();
}
/**
* 重置
*/
function searchReset() {
formRef.value.resetFields();
selectedRowKeys.value = [];
//刷新数据
reload();
}
/**
* popup组件值改变事件
*/
function setFieldsValue(map) {
Object.keys(map).map((key) => {
queryParam[key] = map[key];
});
}
</script>
<style lang="less" scoped>
.jeecg-basic-table-form-container {
.table-page-search-submitButtons {
display: block;
margin-bottom: 24px;
white-space: nowrap;
}
.jeecg-basic-table-form-container {
.table-page-search-submitButtons {
display: block;
margin-bottom: 24px;
white-space: nowrap;
}
.query-group-cust {
width: calc(50% - 15px);
min-width: 100px !important;
}
.query-group-cust {
width: calc(50% - 15px);
min-width: 100px !important;
}
.query-group-split-cust {
width: 30px;
display: inline-block;
text-align: center
.query-group-split-cust {
width: 30px;
display: inline-block;
text-align: center;
}
}
::v-deep(.ant-table-row) {
height: 120px !important;
}
}
</style>

Write Preview
Loading…
Cancel
Save