Merge branch 'master' of http://36.137.93.232:3000/hf/byte-sailing-new

src/components/headerBar/header-bar.vue

@@ -1,88 +1,86 @@
 <template>
-  <div id="main" class="header-bar">
-    <header>
-      <ul class="nav">
-        <div class="logo">ByteSailing</div>
-        <li class="header-bar-hover-warp nav-li">
-          <div
-            @click="isChildMenu = !isChildMenu"
-            class="menu-modal"
-            style="font-size: 12px"
-          >
-            功能导览
-            <i class="el-icon-arrow-down el-icon--right"></i>
-          </div>
-        </li>
-
-        <li class="nav-li" v-for="i in barData" :key="i.id">
-          <span>{{ i.name }}</span>
-        </li>
-        <div
-          class="header-bar-warp"
-          v-if="isChildMenu"
-          @click.stop="isChildMenu = false"
-        >
-          <div class="header-bar-hover" @click.stop>
-            <div class="header-bar-hover-content">
-              <div class="left-banner">
-                <div class="first-order">
-                  <el-icon size="16" color="#0084FF">
-                    <edit />
-                  </el-icon>
-                  常用功能
-                </div>
-                <div class="first-order">
-                  <el-icon size="16" color="#0084FF">
-                    <edit />
-                  </el-icon>
-                  功能菜单
-                </div>
-                <ul>
-                  <li>外贸ERP</li>
-                  <li>云仓</li>
-                  <li>办公OA</li>
-                  <li>供应链</li>
-                  <li>产品库</li>
-                </ul>
-                <!-- <div class="first-order">
+	<div id="main" class="header-bar">
+		<header>
+			<ul class="nav">
+				<div class="logo">ByteSailing</div>
+				<li class="header-bar-hover-warp nav-li">
+					<div @click="isChildMenu = !isChildMenu" class="menu-modal" style="font-size: 12px;">
+						功能导览
+						<i class="el-icon-arrow-down el-icon--right"></i>
+					</div>
+					
+				</li>
+				
+				<li class="nav-li" v-for="i in barData" :key="i.id">
+					<span>{{ i.name }}</span>
+				</li>
+				<div class="header-bar-warp"  v-if="isChildMenu" @click.stop="isChildMenu = false">
+					<div class="header-bar-hover" @click.stop>
+						<div class="header-bar-hover-content">
+							<div class="left-banner">
+								<div class="first-order">
+									<el-icon size="16" color="#0084FF">
+										<edit />
+									</el-icon>
+									常用功能
+								</div>
+								<div class="first-order">
+									<el-icon size="16" color="#0084FF">
+										<edit />
+									</el-icon>
+									功能菜单
+								</div>
+								<ul>
+									<li>外贸ERP</li>
+									<li>云仓</li>
+									<li>办公OA</li>
+									<li>供应链</li>
+									<li>产品库</li>
+								</ul>
+								<!-- <div class="first-order">
 									<el-icon size="16" color="#0084FF">
 										<edit /> 
 									</el-icon>
 									推荐服务
 								</div> -->
-              </div>
-              <div class="menu-warp">
-                <div class="first-order-title">外贸ERP</div>
-                <ul class="second-level">
-                  <div v-for="(i, index) in sidebarRouters" :key="index">
-                    <li
-                      v-if="i.isNone"
-                      class="menu-ul"
-                      style="cursor: auto"
-                    ></li>
-                    <li class="menu-title" v-else-if="i.isTitle">
-                      <el-icon size="16" color="#0084FF">
-                        <edit />
-                      </el-icon>
-                      {{ i.meta.title }}
-                    </li>
-                    <li
-                      v-else
-                      class="menu-ul"
-                      @click="routerPush(i)"
-                      style="cursor: pointer"
-                    >
-                      {{ i.meta.title }}
-                    </li>
-                  </div>
-                </ul>
-              </div>
-            </div>
-          </div>
-        </div>
-      </ul>
-      <div class="fr">
-        <!-- <el-input
+							</div>
+							<div class="menu-warp">
+								<div class="first-order-title">
+									外贸ERP
+								</div>
+								<ul class="second-level">
+									<div v-for="(i, index) in sidebarRouters"
+											:key="index">
+										<li
+											v-if="i.isNone"
+											class="menu-ul"
+											style="cursor: auto;"
+										></li>
+										<li class="menu-title" v-else-if="i.isTitle">
+											<el-icon size="16" color="#0084FF">
+												<edit />
+											</el-icon>
+											{{ i.meta.title }}
+										</li>
+										<li
+											v-else
+											class="menu-ul"
+											@click="routerPush(i)"
+											style="cursor: pointer"
+										>
+											{{ i.meta.title }}
+										</li>
+									</div>
+									
+								</ul>
+								
+							</div>
+						</div>
+					</div>
+				</div>
+			</ul>
+			<div class="fr">
+				<!-- <el-input
             class="input-search"
             placeholder="请输入关键词"
             suffix-icon="el-icon-search"
@@ -98,352 +96,348 @@
               <el-dropdown-item>中文</el-dropdown-item>
             </el-dropdown-menu>
           </el-dropdown> -->
-        <el-badge :value="12" class="badge">
-          <el-icon :size="20">
-            <BellFilled />
-          </el-icon>
-        </el-badge>
+				<el-badge :value="12" class="badge">
+					<el-icon :size="20">
+						<BellFilled />
+					</el-icon>
+				</el-badge>
 
-        <el-dropdown
-          @command="handleCommand"
-          class="right-menu-item hover-effect"
-          trigger="click"
-        >
-          <div class="dropdown-box">
-            {{ nickName }}
-          </div>
-          <template #dropdown>
-            <el-dropdown-menu>
-              <router-link to="/user/profile">
-                <el-dropdown-item>个人中心</el-dropdown-item>
-              </router-link>
-              <el-dropdown-item command="setLayout">
-                <span>布局设置</span>
-              </el-dropdown-item>
-              <el-dropdown-item divided command="logout">
-                <span>退出登录</span>
-              </el-dropdown-item>
-            </el-dropdown-menu>
-          </template>
-        </el-dropdown>
-      </div>
-    </header>
-  </div>
+				<el-dropdown
+					@command="handleCommand"
+					class="right-menu-item hover-effect"
+					trigger="click"
+				>
+					<div class="dropdown-box">
+						{{ userData }}
+					</div>
+					<template #dropdown>
+						<el-dropdown-menu>
+							<router-link to="/user/profile">
+								<el-dropdown-item>个人中心</el-dropdown-item>
+							</router-link>
+							<el-dropdown-item command="setLayout">
+								<span>布局设置</span>
+							</el-dropdown-item>
+							<el-dropdown-item divided command="logout">
+								<span>退出登录</span>
+							</el-dropdown-item>
+						</el-dropdown-menu>
+					</template>
+				</el-dropdown>
+			</div>
+		</header>
+	</div>
 </template>
   
 <script setup>
-import Cookies from "js-cookie";
-import { ElMessageBox, ElNotification } from "element-plus";
-import useUserStore from "@/store/modules/user";
-import usePermissionStore from "@/store/modules/permission";
-import { ref } from "vue";
-const router = useRouter();
-const userStore = useUserStore();
-const permissionStore = usePermissionStore();
+import Cookies from 'js-cookie'
+import { ElMessageBox,ElNotification } from 'element-plus'
+import useUserStore from '@/store/modules/user'
+import usePermissionStore from '@/store/modules/permission'
+const router = useRouter()
+const userStore = useUserStore()
+const permissionStore = usePermissionStore()
+
+const sidebarRouters = ref([])
+const input1 = ref('')
+const isChildMenu = ref(false)
+const menuData = ref([])
+const barData = ref([])
+const userData = ref(Cookies.get('username') || '')
 
-const sidebarRouters = ref([]);
-const input1 = ref("");
-const isChildMenu = ref(false);
-const menuData = ref([]);
-const barData = ref([]);
-const userData = ref(Cookies.get("username") || "");
-let nickName = ref("");
-const routerInit = () => {
-  //二维转一维
-  const arr = [];
-  for (let i = 0; i < permissionStore.addRoutes.length; i++) {
-    const element = permissionStore.addRoutes[i];
-    element.isTitle = true;
-    arr.push(element);
-    if (element.children && element.children.length > 0) {
-      for (let j = 0; j < element.children.length; j++) {
-        const jelement = element.children[j];
-        jelement.isTitle = false;
-        arr.push({ ...jelement, fatherPath: element.path });
-      }
-    }
-  }
-  let num = 0;
-  //添加剩余子元素，补齐一列
-  for (let i = 0; i < arr.length; i++) {
-    const element = arr[i];
-    if (element.isTitle) {
-      //判断是否存在
-      if (element.children && element.children.length > 0) {
-        //判断余数加上子项列会不会爆掉
-        if (
-          (num % 11) + element.children.length + 1 > 11 &&
-          element.children.length < 11
-        ) {
-          element.pushNum = 11 - (num % 11);
-          for (let j = 0; j < 11 - (num % 11); j++) {
-            arr.splice(i, 0, { ...element, isNone: true });
-            i++;
-          }
-        }
-      }
-      num++;
-    } else {
-      num++;
-    }
-  }
-  sidebarRouters.value = arr;
-};
+const routerInit = (() => {
+	//二维转一维
+	const arr = []
+	for (let i = 0; i < permissionStore.addRoutes.length; i++) {
+		const element = permissionStore.addRoutes[i];
+		if(element.type === 1) {
+			element.isTitle = true
+			arr.push(element)
+		}
+		
+		if(element.children && element.children.length > 0){
+			for (let j = 0; j < element.children.length; j++) {
+				const jelement = element.children[j];
+				jelement.isTitle = false
+				arr.push({...jelement, fatherPath:element.path})
+			}
+		}		
+	}
+	let num = 0
+	//添加剩余子元素，补齐一列
+	for (let i = 0; i < arr.length; i++) {
+		const element = arr[i];
+		if(element.isTitle) {
+			//判断是否存在
+			if(element.children && element.children.length > 0){
+				//判断余数加上子项列会不会爆掉
+				if(num % 11 + element.children.length > 11 && element.children.length < 11){
+					element.pushNum = 11 - num % 11
+					for (let j = 0; j < 11 - num % 11; j++) {
+						arr.splice(i, 0, {...element,isNone:true})
+						i++
+					}
+				}
+			}
+			num ++ 
+		}else{
+			num ++ 
+		}
+	}
+	sidebarRouters.value = arr
+})
 function handleCommand(command) {
-  switch (command) {
-    case "setLayout":
-      setLayout();
-      break;
-    case "logout":
-      logout();
-      break;
-    default:
-      break;
-  }
+	switch (command) {
+		case 'setLayout':
+			setLayout()
+			break
+		case 'logout':
+			logout()
+			break
+		default:
+			break
+	}
 }
 
+
 function logout() {
-  ElMessageBox.confirm("确定注销并退出系统吗？", "提示", {
-    confirmButtonText: "确定",
-    cancelButtonText: "取消",
-    type: "warning",
-  })
-    .then(() => {
-      userStore.logOut().then(() => {
-        location.href = "/index";
-      });
-    })
-    .catch(() => {});
+	
+	ElMessageBox.confirm('确定注销并退出系统吗？', '提示', {
+		confirmButtonText: '确定',
+		cancelButtonText: '取消',
+		type: 'warning',
+	})
+		.then(() => {
+			userStore.logOut().then(() => {
+				location.href = '/index'
+			})
+		})
+		.catch(() => {})
 }
 //拼接url跳转
 function routerPush(i) {
-  router.push(i.fatherPath + "/" + i.path);
-  isChildMenu.value = false;
+	router.push(i.fatherPath + '/' + i.path)
+	isChildMenu.value = false
 }
 
-const getInfo = () => {
-  userStore.getInfo().then((res) => {
-    nickName.value = res.user.nickName;
-  });
-};
+onMounted(()=>{
+	routerInit()
+})
+
 
-onMounted(() => {
-  routerInit();
-  getInfo();
-});
 </script>
   
 <style  lang="scss">
 .header-bar-warp {
-  position: fixed;
-  top: 50px;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0, 0, 0, 0.5);
-  z-index: 1100;
+	position: fixed;
+	top: 50px;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	background: rgba(0, 0, 0, 0.5);
+	z-index: 1100;
+	
 }
 .header-bar {
-  background: #20222a;
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  z-index: 1100;
-  ul,
-  li {
-    list-style: none;
-    padding: 0;
-  }
-  .avatar-wrapper {
-    margin-top: 10px;
-  }
-  .menu-modal {
-    cursor: pointer;
-    font-size: 12px;
-    font-weight: 300;
-  }
-  .header-bar-hover {
-    position: fixed;
-    z-index: 205;
-    top: 50px;
-    left: 0px;
-    right: 0;
-    background: #fff;
-    box-shadow: 0px 3px 10px 1px rgba(0, 0, 0, 0.1);
-    height: 500px;
+	background: #20222a;
+	position: fixed;
+	top: 0;
+	left: 0;
+	right: 0;
+	z-index: 1100;
+	ul,li{
+		list-style: none;
+		padding: 0;
+	}
+	.avatar-wrapper {
+		margin-top: 10px;
+	}
+	.menu-modal {
+		cursor: pointer;
+		font-size: 12px;
+		font-weight: 300;
+	}
+	.header-bar-hover {
+		position: fixed;
+		z-index: 205;
+		top: 50px;
+		left: 0px;
+		right: 0;
+		background: #fff;
+		box-shadow: 0px 3px 10px 1px rgba(0, 0, 0, 0.1);
+		height: 500px;
 
-    .header-bar-hover-content {
-      display: flex;
-      text-align: left;
-      .left-banner {
-        width: 230px;
-        ul {
-          background: #f1f1f1;
-          li {
-            height: 50px;
-            line-height: 50px;
-            padding: 0 50px;
-            font-size: 12px;
-            cursor: pointer;
-          }
-        }
-        .first-order {
-          height: 50px;
-          padding: 0 20px;
-          line-height: 50px;
-          font-size: 14px;
-          font-weight: bold;
-          background: #f9f9f9;
-          cursor: pointer;
-          i {
-            position: relative;
-            top: 3px;
-            margin-right: 5px;
-          }
-        }
-      }
-      .el-alert {
-        line-height: 20px;
-        text-align: center;
-        background: #dfecff;
-        color: #666666;
-        font-weight: 400;
-        margin-bottom: 20px;
-        i {
-          color: #46a6ff;
-        }
-      }
-    }
-    .menu-warp {
-      width: calc(100vw - 230px);
-      background: #fff;
-      overflow: hidden;
-      box-sizing: border-box;
-      padding: 0 40px;
-      height: 500px;
-      overflow-y: auto;
-      .first-order-title {
-        height: 70px;
-        line-height: 70px;
-        color: #333333;
-        font-size: 15px;
-        font-weight: bold;
-      }
-      .second-level {
-        overflow: hidden;
-        height: 420px;
-        display: flex;
-        flex-wrap: wrap;
-        flex-direction: column;
-        flex-grow: 0;
-        flex-basis: auto;
-      }
-      .menu-title {
-        font-weight: 600;
-        color: #0084ff;
-        height: 40px;
-        line-height: 40px;
-        border-bottom: 1px solid #ddd;
-        font-size: 14px;
-        width: 140px;
-        margin: 0 100px 0 0;
-        i {
-          position: relative;
-          top: 3px;
-          margin-right: 5px;
-        }
-      }
-      .menu-ul {
-        float: left;
-        width: 140px;
-        list-style: none;
-        margin: 0 100px 0 0;
-        padding: 0;
-        height: 36px;
-        line-height: 36px;
-        font-size: 12px;
-        font-weight: 400;
-        cursor: pointer;
-      }
-      .menu-ul:hover {
-        color: #0084ff;
-      }
-    }
-  }
-  .nav {
-    display: flex;
-    padding: 0;
-    margin: 0;
-    height: 50px;
-    overflow: hidden;
-    .logo {
-      color: #fff;
-      font-size: 20px;
-      font-weight: bold;
-      line-height: 50px;
-      margin: 0 20px;
-    }
-    .nav-li {
-      width: 130px;
-      height: 50px;
-      font-size: 16px;
-      font-weight: 700;
-      text-align: center;
-      line-height: 50px;
-      list-style: none;
-      color: #fff;
-      a {
-        color: #fff;
-      }
-    }
-    .nav-li.active {
-      background: #0084ff;
-      color: #fff;
-      a {
-        color: #fff;
-      }
-    }
-  }
-  header {
-    z-index: 11205;
-    left: 0;
-    right: 0;
-    top: 0;
-    height: 50px;
-    display: flex;
-    justify-content: space-between;
-    .fr {
-      display: flex;
-      .input-search {
-        margin: 12px 40px 12px 0;
-        width: 240px;
-        input {
-          height: 30px;
-        }
-      }
-      .dropdown-box {
-        margin: 0 24px 0 0px;
-        line-height: 50px;
-        cursor: pointer;
-      }
-      .badge {
-        margin: 15px 24px 15px 0;
-        height: 20px;
-        width: 20px;
-        i {
-          color: #bbbbbb;
-        }
-      }
-      .user-img {
-        margin: 12px 12px 12px 0;
-      }
-    }
-  }
+		.header-bar-hover-content {
+			display: flex;
+			text-align: left;
+			.left-banner{
+				width: 230px;
+				ul{
+					background: #F1F1F1;
+					li{
+						height: 50px;
+						line-height: 50px;
+						padding: 0 50px;
+						font-size: 12px;
+						cursor: pointer;
+					}
+				}
+				.first-order{
+					height: 50px;
+					padding: 0 20px;
+					line-height: 50px;
+					font-size: 14px;
+					font-weight: bold;
+					background: #F9F9F9;
+					cursor: pointer;
+					i{
+						position: relative;
+						top: 3px;
+						margin-right: 5px;
+					}
+				}
+			}
+			.el-alert {
+				line-height: 20px;
+				text-align: center;
+				background: #dfecff;
+				color: #666666;
+				font-weight: 400;
+				margin-bottom: 20px;
+				i {
+					color: #46a6ff;
+				}
+			}
+		}
+		.menu-warp {
+			width: calc(100vw - 230px);
+			background: #fff;
+			overflow: hidden;
+			box-sizing: border-box;
+			padding: 0 40px;
+			height: 500px;
+			overflow-y: auto;
+			.first-order-title{
+				height: 70px;
+				line-height: 70px;
+				color: #333333;
+				font-size: 15px;
+				font-weight: bold;
+			}
+			.second-level{
+				overflow: hidden;
+				height:420px;
+				display: flex;
+				flex-wrap:wrap;
+				flex-direction:column;
+				flex-grow:0;
+				flex-basis:auto;
+			}
+			.menu-title {
+				font-weight: 600;
+				color: #0084FF;
+				height: 40px;
+				line-height: 40px;
+				border-bottom: 1px solid #ddd;
+				font-size: 14px;
+				width: 140px;
+				margin: 0 100px 0 0;
+				i{
+					position: relative;
+					top:3px;
+					margin-right: 5px;
+				}
+			}
+			.menu-ul {
+				float: left;
+				width: 140px;
+				list-style: none;
+				margin: 0 100px 0 0;
+				padding: 0;
+				height: 36px;
+				line-height: 36px;
+				font-size: 12px;
+				font-weight: 400;
+				cursor: pointer;
+			}
+			.menu-ul:hover{
+				color: #0084ff;
+			}
+		}
+	}
+	.nav {
+		display: flex;
+		padding: 0;
+		margin: 0;
+		height: 50px;
+		overflow: hidden;
+		.logo {
+			color: #fff;
+			font-size: 20px;
+			font-weight: bold;
+			line-height: 50px;
+			margin: 0 20px;
+		}
+		.nav-li {
+			width: 130px;
+			height: 50px;
+			font-size: 16px;
+			font-weight: 700;
+			text-align: center;
+			line-height: 50px;
+			list-style: none;
+			color: #fff;
+			a {
+				color: #fff;
+			}
+		}
+		.nav-li.active {
+			background: #0084ff;
+			color: #fff;
+			a {
+				color: #fff;
+			}
+		}
+	}
+	header {
+		z-index: 11205;
+		left: 0;
+		right: 0;
+		top: 0;
+		height: 50px;
+		display: flex;
+		justify-content: space-between;
+		.fr {
+			display: flex;
+			.input-search {
+				margin: 12px 40px 12px 0;
+				width: 240px;
+				input {
+					height: 30px;
+				}
+			}
+			.dropdown-box {
+				margin: 0 24px 0 0px;
+				line-height: 50px;
+				cursor: pointer;
+			}
+			.badge {
+				margin: 15px 24px 15px 0;
+				height: 20px;
+				width: 20px;
+				i {
+					color: #bbbbbb;
+				}
+			}
+			.user-img {
+				margin: 12px 12px 12px 0;
+			}
+		}
+	}
 }
 
 header > a {
-  margin: 0 20px;
+	margin: 0 20px;
 }
 </style>
 

src/layout/components/AppMain.vue

@@ -34,7 +34,7 @@ const tagsViewStore = useTagsViewStore()
 .hasTagsView {
   .app-main {
     /* 84 = navbar + tags-view = 50 + 34 */
-    min-height: calc(100vh - 84px);
+    min-height: calc(100vh - 100px);
   }
 
   .fixed-header + .app-main {

src/layout/components/TagsView/ScrollPane.vue

@@ -99,7 +99,7 @@ defineExpose({
     bottom: 0px;
   }
   :deep(.el-scrollbar__wrap) {
-    height: 49px;
+    height: 50px;
   }
 }
 </style>

src/layout/components/TagsView/index.vue

@@ -8,12 +8,13 @@
         :class="isActive(tag) ? 'active' : ''"
         :to="{ path: tag.path, query: tag.query, fullPath: tag.fullPath }"
         class="tags-view-item"
-        :style="activeStyle(tag)"
+        
         @click.middle="!isAffix(tag) ? closeSelectedTag(tag) : ''"
         @contextmenu.prevent="openMenu(tag, $event)"
       >
         {{ tag.title }}
-        <span v-if="!isAffix(tag)" @click.prevent.stop="closeSelectedTag(tag)">
+        <!-- v-if="!isAffix(tag)" -->
+        <span  style="margin-left:8px" @click.prevent.stop="closeSelectedTag(tag)">
           <close class="el-icon-close" style="width: 1em; height: 1em;vertical-align: middle;" />
         </span>
       </router-link>
@@ -86,7 +87,7 @@ function activeStyle(tag) {
   if (!isActive(tag)) return {};
   return {
     "background-color": theme.value,
-    "border-color": theme.value
+    "border-color": 'none'
   };
 }
 function isAffix(tag) {
@@ -243,45 +244,43 @@ function handleScroll() {
 
 <style lang='scss' scoped>
 .tags-view-container {
-  height: 34px;
+  height: 50px;
   width: 100%;
   background: #fff;
-  border-bottom: 1px solid #d8dce5;
-  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);
+  
   .tags-view-wrapper {
     .tags-view-item {
       display: inline-block;
       position: relative;
       cursor: pointer;
-      height: 26px;
-      line-height: 26px;
-      border: 1px solid #d8dce5;
-      color: #495060;
+      height: 50px;
+      line-height: 50px;
+      
+      color: #999999;
       background: #fff;
-      padding: 0 8px;
+      padding: 0 20px;
       font-size: 12px;
-      margin-left: 5px;
-      margin-top: 4px;
+      margin:0;
       &:first-of-type {
-        margin-left: 15px;
+        // margin-left: 15px;
       }
       &:last-of-type {
         margin-right: 15px;
       }
       &.active {
-        background-color: #42b983;
-        color: #fff;
-        border-color: #42b983;
-        &::before {
-          content: "";
-          background: #fff;
-          display: inline-block;
-          width: 8px;
-          height: 8px;
-          border-radius: 50%;
-          position: relative;
-          margin-right: 2px;
-        }
+        background-color: #D9EDFF!important;
+        color: #0084FF!important;
+        //border-color: #42b983;
+        // &::before {
+        //   content: "";
+        //   background: #fff;
+        //   display: inline-block;
+        //   width: 8px;
+        //   height: 8px;
+        //   border-radius: 50%;
+        //   position: relative;
+        //   margin-right: 2px;
+        // }
       }
     }
   }

src/views/index.vue

@@ -1,12 +1,8 @@
 <template>
 	<div class="app-container home">
-		<byTableDemo></byTableDemo>
-		<div id="pdfDom" style="padding:20px">
-			
-			<div>啊是多久啊还是打卡机圣诞卡啊是多久啊还是打卡机圣诞卡啊是多久啊还是打卡机圣诞卡啊是多久啊还是打卡机圣诞卡啊是多久啊还是打卡机圣诞卡啊是多久啊还是打卡机圣诞卡啊是多久啊还是打卡机圣诞卡啊是多久啊还是打卡机圣诞卡啊是多久啊还是打卡机圣诞卡啊是多久啊还是打卡机圣诞卡啊是多久啊还是打卡机圣诞卡</div>
-			
-		</div>
-		<el-button @click="xiazai">xiazai</el-button>
+		<!-- <byTableDemo></byTableDemo> -->
+		
+		
 	</div>
 </template>
 
@@ -19,138 +15,6 @@ import JsPDF from 'jspdf'
 function goTarget(url) {
 	window.open(url, '__blank')
 }
-
-const pdfDoc = new JsPDF()
-// let pWidth = pdfDoc.internal.pageSize.width; // 595.28 is the width of a4
-// let srcWidth = element.scrollWidth;
-// let margin = 18; // narrow margin - 1.27 cm (36);
-// let scale = (pWidth - margin * 2) / srcWidth;
-// pdfDoc.html(element, {
-// 	x: 10,
-// 	y: 10,
-// 	html2canvas: {
-// 		scale: scale,
-// 	},
-// 	callback: function (doc) {
-// 		doc.save()
-// 	},
-// })
-
-const getPdf = (title) => {
-	// pdfDom 这个就是你vue页面中定义的ID  比如<div id="pdfDom">  这个也要避下雷
-	const element = document.getElementById('pdfDom')
-	console.log(element)
-	window.pageYoffset = 0
-	document.documentElement.scrollTop = 0
-	document.body.scrollTop = 0
-	setTimeout(() => {
-		const nowDate = new Date()
-		const date = {
-			year: nowDate.getFullYear(),
-			month: nowDate.getMonth() + 1,
-			date: nowDate.getDate(),
-			hours: nowDate.getHours(),
-			minutes: nowDate.getMinutes(),
-			seconds: nowDate.getSeconds(),
-		}
-		const newmonth = date.month > 10 ? date.month : '0' + date.month
-		const newday = date.date > 10 ? date.date : '0' + date.date
-		const newminutes = date.minutes < 10 ? '0' + date.minutes : date.minutes
-		const newseconds = date.seconds < 10 ? '0' + date.seconds : date.seconds
-		const value =
-			date.year + newmonth + newday + date.hours + newminutes + newseconds
-		let id = ''
-		//创建一个画布    ---  增加导出的pdf水印 ！！
-		let can = document.createElement('canvas')
-		//设置画布的长宽
-		can.width = 400
-		can.height = 500
-
-		let cans = can.getContext('2d')
-		//旋转角度
-		cans.rotate((-15 * Math.PI) / 180)
-		cans.font = '18px Vedana'
-		//设置填充绘画的颜色、渐变或者模式
-		cans.fillStyle = 'rgba(200, 200, 200, 0.40)'
-		//设置文本内容的当前对齐方式
-		cans.textAlign = 'left'
-		//设置在绘制文本时使用的当前文本基线
-		cans.textBaseline = 'Middle'
-		//在画布上绘制填色的文本（输出的文本，开始绘制文本的X坐标位置，开始绘制文本的Y坐标位置）
-		//cans.fillText(value, can.width / 8, can.height / 2)
-		let div = document.createElement('div')
-
-		div.id = id
-		div.style.pointerEvents = 'none'
-		div.style.top = '20px'
-		div.style.left = '-20px'
-		div.style.position = 'fixed'
-		div.style.zIndex = '100000'
-		div.style.width = document.getElementById('pdfDom').scrollHeight + 'px'
-		div.style.height = document.getElementById('pdfDom').scrollHeight + 'px'
-		div.style.background =
-			'url(' + can.toDataURL('image/png') + ') left top repeat'
-		document.getElementById('pdfDom').appendChild(div) // 到页面中
-		console.log(html2canvas)
-		html2canvas(element, {
-			allowTaint: true,
-			useCORS: true, // 需要注意，element的 高度 宽度一定要在这里定义一下，不然会存在只下载了当前你能看到的页面   避雷避雷！！！
-			// scale: 2, // 提升画面质量，但是会增加文件大小
-			height: document.getElementById('pdfDom').scrollHeight,
-			windowHeight: document.getElementById('pdfDom').scrollHeight,
-		}).then(function (canvas) {
-			var contentWidth = canvas.width
-			var contentHeight = canvas.height
-			console.log('contentWidth', contentWidth)
-			console.log('contentHeight', contentHeight)
-			// 一页pdf显示html页面生成的canvas高度;
-			var pageHeight = (contentWidth * 841.89) / 592.28
-			// 未生成pdf的html页面高度
-			var leftHeight = contentHeight
-
-			console.log('pageHeight', pageHeight)
-			console.log('leftHeight', leftHeight)
-			// 页面偏移
-			var position = 0
-			// a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的宽高
-			var imgWidth = 595.28
-			var imgHeight = (592.28 / contentWidth) * contentHeight
-
-			var pageData = canvas.toDataURL('image/jpeg', 1.0)
-
-			var pdf = new JsPDF('', 'pt', 'a4')
-
-			// 有两个高度需要区分，一个是html页面的实际高度，和生成pdf的页面高度(841.89)
-			// 当内容未超过pdf一页显示的范围，无需分页
-			if (leftHeight < pageHeight) {
-				console.log('没超过1页')
-				pdf.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
-			} else {
-				while (leftHeight > 0) {
-					console.log('超过1页')
-					pdf.addImage(
-						pageData,
-						'JPEG',
-						0,
-						position,
-						imgWidth,
-						imgHeight
-					)
-					leftHeight -= pageHeight
-					position -= 841.89
-					// 避免添加空白页
-					if (leftHeight > 0) {
-						pdf.addPage()
-					}
-				}
-			}
-			pdf.save(title + '.pdf')
-		})
-	}, 1000)
-}
-const xiazai = (() => {
-	getPdf('xxxxx')
-})
 // ​
 onMounted(() => {