未验证 提交 5678f969 编写于 作者: 奇淼(piexlmax 提交者: GitHub

Revert "修改全局 dialog 样式,修改api管理的删除初始化显示问题"

上级 ce6a19ad
import { createApp } from 'vue'
import 'element-plus/dist/index.css'
import './style/element_visiable.scss'
import ElementPlus from 'element-plus'
import zhCn from 'element-plus/es/locale/lang/zh-cn'
// 引入gin-vue-admin前端初始化相关内容
......
......@@ -7,74 +7,15 @@ $--color-primary: #1890ff;
border-radius: 4px;
}
}
.el-dialog{
border-radius: 10px;
.dialog-footer{
margin-right: 8px;
}
}
///* 改变 icon 字体路径变量,必需 */
//$--font-path: '~element-ui/lib/theme-chalk/fonts';
//
//
//
//@import "~element-ui/packages/theme-chalk/src/index";
//
/* ZOOM FADE */
.zoom-fade-enter-active,
.zoom-fade-leave-active {
transition: transform 0.35s, opacity 0.28s ease-in-out;
}
.zoom-fade-enter {
transform: scale(0.97);
opacity: 0;
}
.zoom-fade-leave-to {
transform: scale(1.03);
opacity: 0;
}
/* FADE TRNASITION */
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.28s ease-in-out;
}
.fade-enter,
.fade-leave-to {
opacity: 0;
}
/* PAGE SLIDE */
.slide-fade-enter-active,
.slide-fade-leave-active {
transition: opacity 0.35s, transform 0.4s;
}
.slide-fade-enter {
opacity: 0;
transform: translateX(-30%);
}
.slide-fade-leave-to {
opacity: 0;
transform: translateX(30%);
}
/* ZOOM OUT */
.zoom-out-enter-active,
.zoom-out-leave-active {
transition: opacity 0.35s ease-in-out, transform 0.45s ease-out;
}
.zoom-out-enter,
.zoom-out-leave-to {
opacity: 0;
transform: scale(0);
}
/* UNFOLD SLIDE */
.fade-bottom-enter-active,
.fade-bottom-leave-active {
transition: opacity 0.3s, transform 0.35s;
}
.fade-bottom-enter {
opacity: 0;
transform: translateY(-8%);
}
.fade-bottom-leave-to {
opacity: 0;
transform: translateY(8%);
}
:export {
colorPrimary: $--color-primary
}
<template>
<el-container class="layout-cont">
<el-container :class="[isSider ? 'openside' : 'hideside', isMobile ? 'mobile' : '']">
<el-row :class="[isShadowBg ? 'shadowBg' : '']" @click="changeShadow()" />
<el-container :class="[isSider?'openside':'hideside',isMobile ? 'mobile': '']">
<el-row :class="[isShadowBg?'shadowBg':'']" @click="changeShadow()" />
<el-aside class="main-cont main-left">
<div class="tilte" :style="{ background: backgroundColor }">
<div class="tilte" :style="{background: backgroundColor}">
<img alt class="logoimg" :src="$GIN_VUE_ADMIN.appLogo">
<h2
v-if="isSider"
class="tit-text"
:style="{ color: textColor }"
>{{ $GIN_VUE_ADMIN.appName }}</h2>
<h2 v-if="isSider" class="tit-text" :style="{color:textColor}">{{ $GIN_VUE_ADMIN.appName }}</h2>
</div>
<Aside class="aside" />
</el-aside>
......@@ -17,10 +13,11 @@
<el-main class="main-cont main-right">
<transition :duration="{ enter: 800, leave: 100 }" mode="out-in" name="el-fade-in-linear">
<div
:style="{ width: `calc(100% - ${isMobile ? '0px' : isCollapse ? '54px' : '220px'})` }"
:style="{width: `calc(100% - ${isMobile?'0px':isCollapse?'54px':'220px'})`}"
class="topfix"
>
<el-row>
<!-- :xs="8" :sm="6" :md="4" :lg="3" :xl="1" -->
<el-col>
<el-header class="header-cont">
<el-row class="pd-0">
......@@ -33,7 +30,7 @@
<el-col :xs="10" :lg="14" :md="14" :sm="9" :xl="14" :pull="1">
<el-breadcrumb class="breadcrumb">
<el-breadcrumb-item
v-for="item in matched.slice(1, matched.length)"
v-for="item in matched.slice(1,matched.length)"
:key="item.path"
>{{ item.meta.title }}</el-breadcrumb-item>
</el-breadcrumb>
......@@ -41,11 +38,9 @@
<el-col :xs="12" :lg="9" :md="9" :sm="14" :xl="9">
<div class="right-box">
<Search />
<Screenfull class="screenfull" :style="{ cursor: 'pointer' }" />
<Screenfull class="screenfull" :style="{cursor:'pointer'}" />
<el-dropdown>
<div
class="dp-flex justify-content-center align-items height-full width-full"
>
<div class="dp-flex justify-content-center align-items height-full width-full">
<span class="header-avatar" style="cursor: pointer">
<CustomPic />
<span style="margin-left: 5px">{{ userInfo.nickName }}</span>
......@@ -55,17 +50,15 @@
<template #dropdown>
<el-dropdown-menu class="dropdown-group">
<el-dropdown-item>
<span
style="font-weight: 600;"
>当前角色:{{ userInfo.authority.authorityName }}</span>
<span style="font-weight: 600;">
当前角色:{{ userInfo.authority.authorityName }}
</span>
</el-dropdown-item>
<template v-if="userInfo.authorities">
<el-dropdown-item
v-for="item in userInfo.authorities.filter(i => i.authorityId !== userInfo.authorityId)"
:key="item.authorityId"
@click="changeUserAuth(item.authorityId)"
>
<span>切换为:{{ item.authorityName }}</span>
<el-dropdown-item v-for="item in userInfo.authorities.filter(i=>i.authorityId!==userInfo.authorityId)" :key="item.authorityId" @click="changeUserAuth(item.authorityId)">
<span>
切换为:{{ item.authorityName }}
</span>
</el-dropdown-item>
</template>
<el-dropdown-item icon="el-icon-s-custom" @click="toPerson">个人信息</el-dropdown-item>
......@@ -80,30 +73,20 @@
</el-col>
</el-row>
<!-- 当前面包屑用路由自动生成可根据需求修改 -->
<!--
:to="{ path: item.path }" 暂时注释不用-->
<HistoryComponent ref="layoutHistoryComponent" />
</div>
</transition>
<router-view
v-if="$route.meta.keepAlive && reloadFlag"
v-slot="{ Component }"
v-loading="loadingFlag"
element-loading-text="正在加载中"
class="admin-box"
>
<transition mode="out-in" name="zoom-fade">
<router-view v-if="$route.meta.keepAlive && reloadFlag" v-slot="{ Component }" v-loading="loadingFlag" element-loading-text="正在加载中" class="admin-box">
<transition mode="out-in" name="el-fade-in-linear">
<keep-alive>
<component :is="Component" />
</keep-alive>
</transition>
</router-view>
<router-view
v-if="!$route.meta.keepAlive && reloadFlag"
v-slot="{ Component }"
v-loading="loadingFlag"
element-loading-text="正在加载中"
class="admin-box"
>
<transition mode="out-in" name="zoom-fade">
<router-view v-if="!$route.meta.keepAlive && reloadFlag" v-slot="{ Component }" v-loading="loadingFlag" element-loading-text="正在加载中" class="admin-box">
<transition mode="out-in" name="el-fade-in-linear">
<component :is="Component" />
</transition>
</router-view>
......@@ -112,6 +95,7 @@
<setting />
</el-main>
</el-container>
</el-container>
</template>
......@@ -258,14 +242,14 @@ export default {
}
</script>
<style lang="scss" scoped>
@import "@/style/mobile.scss";
<style lang="scss">
@import '@/style/mobile.scss';
.dark {
.dark{
background-color: #191a23 !important;
color: #fff !important;
}
.light {
.light{
background-color: #fff !important;
color: #000 !important;
}
......
......@@ -75,7 +75,7 @@ export default {
right: 0
}
position: fixed;
right: 0;
right: -20px;
bottom: 15%;
height: 40px;
width: 40px;
......@@ -84,7 +84,7 @@ export default {
justify-content: center;
z-index: 999;
color: #fff;
border-radius: 4px 4px 0 0 ;
border-radius: 4px 0 0 4px;
cursor: pointer;
-webkit-box-shadow: inset 0 0 6px rgba(0 ,0 ,0, 10%);
}
......
......@@ -29,6 +29,7 @@
</div>
<div class="gva-table-box">
<div class="gva-btn-list">
<el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog('addApi')">新增</el-button>
<el-popover v-model:visible="deleteVisible" placement="top" width="160">
<p>确定要删除吗?</p>
......@@ -37,12 +38,7 @@
<el-button size="mini" type="primary" @click="onDelete">确定</el-button>
</div>
<template #reference>
<el-button
icon="el-icon-delete"
size="mini"
style="margin-left: 10px;"
:disabled="showTableHeadDelbtn"
>删除</el-button>
<el-button icon="el-icon-delete" size="mini" style="margin-left: 10px;">删除</el-button>
</template>
</el-popover>
</div>
......@@ -57,25 +53,26 @@
<el-table-column align="center" label="API简介" min-width="150" prop="description" sortable="custom" />
<el-table-column align="center" label="请求" min-width="150" prop="method" sortable="custom">
<template #default="scope">
<div>{{ scope.row.method }} / {{ methodFiletr(scope.row.method) }}</div>
<div>
{{ scope.row.method }} / {{ methodFiletr(scope.row.method) }}
</div>
</template>
</el-table-column>
<el-table-column align="center" fixed="right" label="操作" width="200">
<template #default="scope">
<el-button icon="el-icon-edit" size="small" type="text" @click="editApi(scope.row)">编辑</el-button>
<el-popconfirm
confirmButtonText="好的"
cancelButtonText="不用了"
icon="el-icon-info"
iconColor="red"
title="你确定要删除吗?"
@confirm="deleteApi(scope.row)"
>
<template #reference>
<el-button icon="el-icon-delete" size="small" type="text">删除</el-button>
</template>
</el-popconfirm>
<el-button
icon="el-icon-edit"
size="small"
type="text"
@click="editApi(scope.row)"
>编辑</el-button>
<el-button
icon="el-icon-delete"
size="small"
type="text"
@click="deleteApi(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
......@@ -90,11 +87,12 @@
@size-change="handleSizeChange"
/>
</div>
</div>
<el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="dialogTitle">
<warning-bar title="新增API,需要在角色管理内篇日志权限才可使用" />
<el-form ref="apiForm" :model="form" :rules="rules" label-width="120px">
<el-form ref="apiForm" :model="form" :rules="rules" label-width="80px">
<el-form-item label="路径" prop="path">
<el-input v-model="form.path" autocomplete="off" />
</el-form-item>
......@@ -194,8 +192,7 @@ export default {
description: [
{ required: true, message: '请输入api介绍', trigger: 'blur' }
]
},
showTableHeadDelbtn: true
}
}
},
created() {
......@@ -212,11 +209,6 @@ export default {
},
// 选中api
handleSelectionChange(val) {
if (val.length) {
this.showTableHeadDelbtn = false
} else {
this.showTableHeadDelbtn = true
}
this.apis = val
},
async onDelete() {
......@@ -284,17 +276,30 @@ export default {
this.openDialog('edit')
},
async deleteApi(row) {
const res = await deleteApi(row)
if (res.code === 0) {
this.$message({
type: 'success',
message: '删除成功!'
this.$confirm('此操作将永久删除所有角色下该api, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(async() => {
const res = await deleteApi(row)
if (res.code === 0) {
this.$message({
type: 'success',
message: '删除成功!'
})
if (this.tableData.length === 1 && this.page > 1) {
this.page--
}
this.getTableData()
}
})
.catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
if (this.tableData.length === 1 && this.page > 1) {
this.page--
}
this.getTableData()
}
},
async enterDialog() {
this.$refs.apiForm.validate(async valid => {
......
......@@ -30,6 +30,7 @@
<el-table
ref="multipleTable"
:data="tableData"
style="width: 100%"
tooltip-effect="dark"
>
<el-table-column type="selection" width="55" />
......
......@@ -80,4 +80,4 @@ export default ({
}
},
}
}
}
\ No newline at end of file
......@@ -1083,10 +1083,10 @@
"@babel/helper-validator-identifier" "^7.14.9"
to-fast-properties "^2.0.0"
"@element-plus/icons@0.0.11", "@element-plus/icons@^0.0.11":
"@element-plus/icons@^0.0.11":
version "0.0.11"
resolved "https://repo.huaweicloud.com/repository/npm/@element-plus/icons/-/icons-0.0.11.tgz#9b187c002774548b911850d17fa5fc2f9a515f57"
integrity sha512-iKQXSxXu131Ai+I9Ymtcof9WId7kaXvB1+WRfAfpQCW7UiAMYgdNDqb/u0hgTo2Yq3MwC4MWJnNuTBEpG8r7+A==
resolved "https://registry.nlark.com/@element-plus/icons/download/@element-plus/icons-0.0.11.tgz#9b187c002774548b911850d17fa5fc2f9a515f57"
integrity sha1-mxh8ACd0VIuRGFDRf6X8L5pRX1c=
"@hapi/address@2.x.x":
version "2.1.4"
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册