This commit is contained in:
xuziqiang
2024-07-08 10:02:30 +08:00
15 changed files with 1958 additions and 1 deletions

View File

@@ -8,7 +8,7 @@
ref="formElRef"
:model="formModel">
<div v-if="showAction && showExpandAll" class="ns-form-title ns-title-extra-box">
<span>查询</span>
<span> {{ title ? title : '查询' }}</span>
<a-button type="link" class="ns-operate-expand" @click="expandAll = !expandAll">
<template v-if="expandAll">
收起筛选
@@ -107,6 +107,7 @@
const isInitDefaultValueRef = ref(false);
const expandRef = ref(props.expand);
const expandAll = ref(props.expandAll);
const title = ref(props.title);
const formModel = computed(() => {
return props.model;
});
@@ -315,6 +316,7 @@
splitNumber,
finish,
expandAll,
title,
};
},
});

View File

@@ -18,4 +18,5 @@ export const formProps = {
// 收起全部
expandAll: PropTypes.bool.def(true), // 默认是否全部展开
showExpandAll: PropTypes.bool.def(true), // 是否展示右上角的全部收起展开
title: PropTypes.bool.def(false), // 是否展示右上角的全部收起展开
};

View File

@@ -30,6 +30,7 @@
:expand="expand"
:showExpand="showExpand"
:expandAll="expandAll"
:title="formConfig.title"
:showExpandAll="showExpandAll"
:model="formModel"
@finish="formFinish" />
@@ -140,6 +141,16 @@
<span class="text-ellipsis" v-else> - </span>
</span>
</template>
<!-- 添加关闭按钮 -->
<template v-if="data.column.dataIndex === 'isUse'">
<a-switch
v-model:checked="data.record.isUse"
:class="{
'blue-background': data.record.isUse,
'grey-background': !data.record.isUse,
}"
@click="clickSwitch({ isUse: data.record.isUse, record: data.record })" />
</template>
<template v-if="data.column.dataIndex === 'tableAction'">
<ns-table-action
:data="data.record"
@@ -349,6 +360,10 @@
page: 1,
});
}, 300);
/* 点击开关按钮 */
const clickSwitch = (data: object) => {
emit('switch', data);
};
function setLoading(loading: boolean) {
tableState.loading = loading;
@@ -632,6 +647,7 @@
tableState,
isEmpty,
formFinish,
clickSwitch,
tableChangeEvent,
treeSelect,
getTreeBindValue,
@@ -746,4 +762,27 @@
word-break: break-word;
width: 100%;
}
.blue-background.ant-switch-checked {
background-color: linear-gradient(
180deg,
rgba(1, 206, 255, 1) 0%,
rgba(0, 150, 229, 1) 100%
) !important;
}
.grey-background.ant-switch {
background-color: grey !important;
}
.blue-background.ant-switch-checked .ant-switch-handle {
background-color: linear-gradient(
180deg,
rgba(1, 206, 255, 1) 0%,
rgba(0, 150, 229, 1) 100%
) !important;
}
.grey-background.ant-switch .ant-switch-handle {
background-color: grey !important;
}
</style>