通用css 替换为tailwindcss模式,剔除无用css。

This commit is contained in:
piexlMax
2023-08-09 15:51:18 +08:00
parent aee26bc9b2
commit 50b524fa7a
15 changed files with 37 additions and 362 deletions
+1 -37
View File
@@ -5,10 +5,8 @@
<div class="gva-top-card-left">
<div class="gva-top-card-left-title">早安,管理员,请开始一天的工作吧</div>
<div class="gva-top-card-left-dot">{{ weatherInfo }}</div>
<div class="gva-top-card-left-rows">
<el-row>
<el-row class="my-8 w-[500px]">
<el-col :span="8" :xs="24" :sm="8">
<div class="flex items-center">
<el-icon class="dashboard-icon">
<sort />
@@ -33,7 +31,6 @@
</div>
</el-col>
</el-row>
</div>
<div>
<div class="gva-top-card-left-item">
使用教学:
@@ -190,9 +187,6 @@ export default {
&-dot {
@apply mt-4 text-gray-600 text-lg;
}
&-rows {
@apply mt-4 flex flex-col text-gray-600 w-[500px];
}
&-item{
+.gva-top-card-left-item{
margin-top: 24px;
@@ -232,34 +226,4 @@ export default {
@apply flex items-center text-xl mr-2 text-blue-400;
}
//小屏幕不显示右侧,将登录框居中
@media (max-width: 750px) {
.gva-card {
@apply px-5 py-2.5;
.gva-top-card {
@apply h-auto;
&-left {
&-title {
font-size: 20px !important;
}
&-rows {
margin-top: 15px;
align-items: center;
}
}
&-right {
display: none;
}
}
.gva-middle-card {
&-item {
line-height: 20px;
}
}
.dashboard-icon {
font-size: 18px;
}
}
}
</style>
+4 -5
View File
@@ -1,11 +1,11 @@
<template>
<el-container class="layout-cont">
<el-container :class="[isSider?'openside':'hideside',isMobile ? 'mobile': '']">
<el-row :class="[isShadowBg?'shadowBg':'']" @click="changeShadow()" />
<el-row :class="[isShadowBg?'bg-black opacity-30 w-full h-full absolute top-0 left-0 z-[1001]':'']" @click="changeShadow()" />
<el-aside class="main-cont gva-aside" :style="{width:asideWidth()}">
<div class="tilte" :style="{background: backgroundColor}">
<div class="min-h-[60px] text-center transition-all duration-300 flex items-center justify-center gap-2" :style="{background: backgroundColor}">
<img alt class="w-9 h-9 p-1 bg-white rounded-full" :src="$GIN_VUE_ADMIN.appLogo">
<div v-if="isSider" class="tit-text" :style="{color:textColor}">{{ $GIN_VUE_ADMIN.appName }}</div>
<div v-if="isSider" class="inline-flex text-white font-bold text-2xl" :style="{color:textColor}">{{ $GIN_VUE_ADMIN.appName }}</div>
</div>
<Aside class="aside" />
</el-aside>
@@ -19,7 +19,7 @@
<el-row>
<el-col>
<el-header class="header-cont">
<el-row class="p-0">
<el-row class="p-0 h-full">
<el-col :xs="2" :lg="1" :md="1" :sm="1" :xl="1" class="z-50 flex items-center pl-3">
<div class="text-black cursor-pointer text-lg leading-5" @click="totalCollapse">
<div v-if="isCollapse" class="gvaIcon gvaIcon-arrow-double-right" />
@@ -292,7 +292,6 @@ const changeShadow = () => {
</script>
<style lang="scss">
@import '@/style/mobile.scss';
.button {
font-size: 12px;
color: #666;
+2 -39
View File
@@ -77,7 +77,6 @@
</div>
<el-dialog
v-model="addUserDialog"
custom-class="user-dialog"
title="用户"
:show-close="false"
:close-on-press-escape="false"
@@ -403,43 +402,7 @@ const switchEnable = async(row) => {
</script>
<style lang="scss">
.user-dialog {
.header-img-box {
width: 200px;
height: 200px;
border: 1px dashed #ccc;
border-radius: 20px;
text-align: center;
line-height: 200px;
cursor: pointer;
}
.avatar-uploader .el-upload:hover {
border-color: #409eff;
}
.avatar-uploader-icon {
border: 1px dashed #d9d9d9 !important;
border-radius: 6px;
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
line-height: 178px;
text-align: center;
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
}
.nickName{
display: flex;
justify-content: flex-start;
align-items: center;
}
.pointer{
cursor: pointer;
font-size: 16px;
margin-left: 2px;
}
@apply w-52 h-52 border border-solid border-gray-300 rounded-xl flex justify-center items-center cursor-pointer;
}
</style>
+4 -6
View File
@@ -1,6 +1,6 @@
<template>
<div>
<el-row :gutter="15" class="system_state">
<el-row :gutter="15" class="py-1">
<el-col :span="12">
<el-card v-if="state.os" class="card_item">
<template #header>
@@ -67,7 +67,7 @@
</el-card>
</el-col>
</el-row>
<el-row :gutter="15" class="system_state">
<el-row :gutter="15" class="py-1">
<el-col :span="12">
<el-card
v-if="state.cpu"
@@ -173,11 +173,9 @@ export default {
</script>
<style>
.system_state {
padding: 10px;
}
.card_item {
height: 280px;
@apply h-80 text-xl;
}
</style>
@@ -7,7 +7,7 @@
label-width="120px"
label-position="right"
:rules="rules"
class="grid-form"
class="grid grid-cols-2"
>
<el-form-item label="字段名称" prop="fieldName">
<el-input v-model="middleDate.fieldName" autocomplete="off" style="width:80%" />
@@ -187,9 +187,3 @@ export default {
name: 'FieldDialog'
}
</script>
<style scoped>
.grid-form{
display: grid;
grid-template-columns: 1fr 1fr;
}
</style>
@@ -1,11 +1,9 @@
<template>
<div class="previewCode">
<el-tabs v-model="activeName">
<el-tab-pane v-for="(item, key) in previewCode" :key="key" :label="key" :name="key">
<div :id="key" class="tab-info" />
<div :id="key" class="h-[50vh] bg-white px-5 overflow-y-scroll" />
</el-tab-pane>
</el-tabs>
</div>
</template>
<script setup>
@@ -81,14 +79,3 @@ export default {
}
</script>
<style lang="scss">
.previewCode {
.tab-info {
height: 50vh;
background: #fff;
padding: 0 20px;
overflow-y: scroll;
}
}
</style>
+4 -22
View File
@@ -89,8 +89,8 @@
<el-select v-model="form.package" style="width:194px">
<el-option v-for="item in pkgs" :key="item.ID" :value="item.packageName" :label="item.packageName" />
</el-select>
<el-icon class="auto-icon" @click="getPkgs"><refresh /></el-icon>
<el-icon class="auto-icon" @click="goPkgs"><document-add /></el-icon>
<el-icon class="cursor-pointer ml-2 text-gray-600" @click="getPkgs"><refresh /></el-icon>
<el-icon class="cursor-pointer ml-2 text-gray-600" @click="goPkgs"><document-add /></el-icon>
</el-form-item>
<el-form-item label="业务库" prop="businessDB">
<template #label>
@@ -262,7 +262,7 @@
</el-table-column>
</el-table>
<!-- 组件列表 -->
<div class="gva-btn-list justify-end auto-btn-list">
<div class="gva-btn-list justify-end mt-4">
<el-button type="primary" @click="enterForm(true)">预览代码</el-button>
<el-button type="primary" @click="enterForm(false)">生成代码</el-button>
</div>
@@ -280,7 +280,7 @@
<el-dialog v-model="previewFlag">
<template #header>
<div class="previewCodeTool">
<div class="flex items-center py-1.5">
<p>操作栏:</p>
<el-button type="primary" @click="selectText">全选</el-button>
<el-button type="primary" @click="copy">复制</el-button>
@@ -720,21 +720,3 @@ export default {
name: 'AutoCode'
}
</script>
<style scoped lang="scss">
.previewCodeTool {
display: flex;
align-items: center;
padding: 5px 0;
}
.auto-btn-list{
margin-top: 16px;
}
.auto-icon{
margin-left: 6px;
color: #666;
cursor: pointer;
}
</style>
@@ -171,13 +171,3 @@ const goAutoCode = (row) => {
}
</script>
<style scoped lang="scss">
.el-tag--mini {
margin-left: 5px;
}
.warning {
color: #dc143c;
}
</style>
@@ -1,7 +1,7 @@
<template>
<div>
<div class="gva-table-box">
<el-form label-width="140px" class="plug-form">
<el-form label-width="140px" class="w-[680px]">
<el-form-item label="插件名">
<el-input v-model="form.plugName" placeholder="必填(英文大写字母开头)" @blur="titleCase" />
</el-form-item>
@@ -205,18 +205,13 @@ const minkv = (arr, key) => {
</script>
<style lang="scss" scoped>
.plug-form{
width: 680px;
}
.plug-row{
display: flex;
align-items: center;
width: 100%;
@apply flex items-center w-full;
&+&{
margin-top: 12px;
@apply mt-3;
}
&>span{
margin-left: 8px;
@apply ml-2;
}
}
</style>
+2 -13
View File
@@ -1,7 +1,7 @@
<template>
<div class="gva-plugin-pub">
<div class="p-5 bg-white">
<WarningBar title="目前只支持标准插件(通过插件模板生成的标准目录插件),非标准插件请自行打包" />
<div class="plugin-pub-btn-list">
<div class="flex items-center gap-3">
<el-input v-model="plugName" placeholder="插件模板处填写的【插件名】" />
<el-button type="primary" @click="pubPlugin">打包插件</el-button>
</div>
@@ -24,14 +24,3 @@ const pubPlugin = async() => {
</script>
<style lang="scss" scope>
.gva-plugin-pub {
background-color: white;
padding: 20px;
}
.plugin-pub-btn-list{
display: flex;
align-items: center;
gap: 12px;
}
</style>
+3 -14
View File
@@ -371,7 +371,7 @@
</el-collapse-item>
</el-collapse>
</el-form>
<div class="gva-btn-list">
<div class="mt-4">
<el-button type="primary" @click="update">立即更新</el-button>
<el-button type="primary" @click="reload">重启服务(开发中)</el-button>
</div>
@@ -452,20 +452,9 @@ const email = async() => {
<style lang="scss">
.system {
background: #fff;
padding:36px;
border-radius: 2px;
@apply bg-white p-9 rounded;
h2 {
padding: 10px;
margin: 10px 0;
font-size: 16px;
box-shadow: -4px 0px 0px 0px #e7e8e8;
}
::v-deep(.el-input-number__increase){
top:5px !important;
}
.gva-btn-list{
margin-top:16px;
@apply p-2.5 my-2.5 text-lg shadow;
}
}
</style>