From 9057e04efad1b7d61c77a72e5c37a504d0aee935 Mon Sep 17 00:00:00 2001
From: doum <doum>
Date: 星期五, 26 九月 2025 09:24:03 +0800
Subject: [PATCH] H5静态化
---
admin/src/layouts/TableLayout1.vue | 175 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 175 insertions(+), 0 deletions(-)
diff --git a/admin/src/layouts/TableLayout1.vue b/admin/src/layouts/TableLayout1.vue
new file mode 100644
index 0000000..9cd8065
--- /dev/null
+++ b/admin/src/layouts/TableLayout1.vue
@@ -0,0 +1,175 @@
+<template>
+ <div class="table-layout">
+ <!-- 澶撮儴 -->
+ <!-- <div v-if="withBreadcrumb" class="table-header">
+ <el-breadcrumb separator="/">
+ <el-breadcrumb-item v-for="path in paths" :key="path">{{path}}</el-breadcrumb-item>
+ </el-breadcrumb>
+ </div>-->
+ <Profile :roles="roles" :permissions="permissions">
+ <div style="width: 100%; height: 100%; padding: 0 16px; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between;">
+ <div style="width: 240px; height: 100%; flex-shrink: 0; background: #ffffff;">
+ <slot name="menu"></slot>
+ </div>
+ <div style="width: calc(100% - 250px); height: 100%">
+ <!-- 鎼滅储琛ㄥ崟閮ㄥ垎 -->
+ <div class="table-search-form" style="padding: 0 !important;">
+ <div class="form-wrap">
+ <slot name="search-form"></slot>
+ </div>
+ </div>
+ <slot name="space"></slot>
+ <!-- 鍒楄〃鍜屽垎椤甸儴鍒� -->
+ <div class="table-content" style="padding: 0 !important;">
+ <div class="table-wrap">
+ <slot name="table-wrap"></slot>
+ </div>
+ </div>
+ </div>
+ </div>
+ </Profile>
+ </div>
+</template>
+
+<script>
+import Profile from '../components/common/Profile'
+export default {
+ name: 'TableLayout1',
+ components: { Profile },
+ props: {
+ // 瑙掕壊
+ roles: {
+ type: Array
+ },
+ // 鏉冮檺
+ permissions: {
+ type: Array
+ },
+ // 鏄惁灞曠ず澶撮儴闈㈠寘灞�
+ withBreadcrumb: {
+ type: Boolean,
+ default: true
+ }
+ },
+ computed: {
+ paths () {
+ return this.$route.meta.paths
+ }
+ }
+}
+</script>
+
+<style lang="scss">
+@import "@/assets/style/variables.scss";
+.table-layout {
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ .not-allow-wrap {
+ padding-top: 20;
+ }
+}
+// 澶撮儴
+.table-header {
+ overflow: hidden;
+ padding: 12px 16px;
+ flex-shrink: 0;
+ // 椤甸潰璺緞
+ .el-breadcrumb {
+ .el-breadcrumb__item {
+ .el-breadcrumb__inner {
+ color: #ABB2BE;
+ font-size: 12px;
+ }
+ &:last-of-type .el-breadcrumb__inner {
+ color: #606263;
+ font-size: 14px;
+ }
+ }
+ }
+}
+// 鎼滅储
+.table-search-form {
+ display: flex;
+ flex-wrap: wrap;
+ /*padding: 0 16px;*/
+ /*box-sizing: border-box;*/
+ .form-wrap {
+ padding: 16px 16px 0 16px;
+ width: 100%;
+ background: #fff;
+ &:empty {
+ padding: 0;
+ }
+ }
+ section {
+ display: inline-block;
+ margin-left: 16px;
+ margin-bottom: 18px;
+ }
+}
+// 鍒楄〃鍜屽垎椤�
+.table-content {
+ /*padding: 0 16px;*/
+ .table-wrap {
+ padding: 16px 16px 60px 16px;
+ background: #fff;
+ // 宸ュ叿鏍�
+ .toolbar {
+ border-bottom: 1px solid #eee;
+ padding-bottom: 10px;
+ li {
+ display: inline-block;
+ margin-right: 6px;
+ }
+ }
+ // 琛ㄦ牸
+ .el-table {
+ th {
+ .cell {
+ color: #666;
+ }
+ }
+ // 澶嶉�夋鍒�
+ .el-table-column--selection {
+ .cell {
+ text-align: center !important;
+ }
+ }
+ // 澶氬�煎瓧娈�
+ .table-column-strings {
+ ul {
+ li {
+ display: inline-block;
+ background: #eee;
+ border-radius: 3px;
+ padding: 0 3px;
+ margin-right: 3px;
+ margin-bottom: 3px;
+ }
+ }
+ }
+ // 鏍戣瑙夎皟鏁�
+ [class*=el-table__row--level] .el-table__expand-icon {
+ position: relative;
+ left: -6px;
+ margin-right: 0;
+ }
+ }
+ // 鍒嗛〉
+ .table-pagination {
+ margin-left: 0px;
+ padding: 16px 0px ;
+ text-align: left;
+ display: block;
+ z-index: 100;
+ width: -webkit-fill-available;
+ /* width: 80%; */
+ position: fixed;
+ bottom: 0px;
+ background-color: white;
+ margin-right: 50px;
+ }
+ }
+}
+</style>
--
Gitblit v1.9.3