mirror of
https://gitee.com/dromara/mayfly-go
synced 2025-11-02 15:30:25 +08:00
refactor: 引入tailwind css & 后端部分非公共包位置调整
This commit is contained in:
meilin.huang
@@ -44,6 +44,7 @@
|
||||
"vuedraggable": "^4.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/vite": "^4.1.4",
|
||||
"@types/crypto-js": "^4.2.2",
|
||||
"@types/node": "^18.14.0",
|
||||
"@types/nprogress": "^0.2.0",
|
||||
@@ -52,14 +53,17 @@
|
||||
"@typescript-eslint/parser": "^6.7.4",
|
||||
"@vitejs/plugin-vue": "^5.2.3",
|
||||
"@vue/compiler-sfc": "^3.5.13",
|
||||
"code-inspector-plugin": "^0.4.5",
|
||||
"autoprefixer": "^10.4.21",
|
||||
"code-inspector-plugin": "^0.20.9",
|
||||
"dotenv": "^16.3.1",
|
||||
"eslint": "^8.35.0",
|
||||
"eslint": "^9.24.0",
|
||||
"eslint-plugin-vue": "^10.0.0",
|
||||
"prettier": "^3.2.5",
|
||||
"postcss": "^8.5.3",
|
||||
"prettier": "^3.5.3",
|
||||
"sass": "^1.86.3",
|
||||
"tailwindcss": "^4.1.4",
|
||||
"typescript": "^5.8.2",
|
||||
"vite": "^6.2.6",
|
||||
"vite": "^6.3.2",
|
||||
"vite-plugin-progress": "0.0.7",
|
||||
"vue-eslint-parser": "^10.1.3"
|
||||
},
|
||||
|
||||
6
frontend/postcss.config.js
Normal file
6
frontend/postcss.config.js
Normal file
@@ -0,0 +1,6 @@
|
||||
module.exports = {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
};
|
||||
@@ -1,13 +1,13 @@
|
||||
<template>
|
||||
<el-config-provider :size="getGlobalComponentSize" :locale="getGlobalI18n">
|
||||
<div class="h100">
|
||||
<div class="!h-full">
|
||||
<el-watermark
|
||||
:zIndex="10000000"
|
||||
:width="210"
|
||||
v-if="themeConfig.isWatermark"
|
||||
:font="{ color: 'rgba(180, 180, 180, 0.3)' }"
|
||||
:content="themeConfig.watermarkText"
|
||||
class="h100"
|
||||
class="!h-full"
|
||||
>
|
||||
<router-view v-show="themeConfig.lockScreenTime !== 0" />
|
||||
</el-watermark>
|
||||
|
||||
@@ -107,7 +107,6 @@ const handleItemKeyupEnter = (item: SearchItem) => {
|
||||
margin-bottom: 10px;
|
||||
|
||||
box-sizing: border-box;
|
||||
overflow-x: hidden;
|
||||
background-color: var(--el-bg-color);
|
||||
border: 1px solid var(--el-border-color-light);
|
||||
border-radius: 6px;
|
||||
|
||||
@@ -37,9 +37,9 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<div class="flex-align-center w100">
|
||||
<el-radio v-model="radioValue" :label="7" class="mr5"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 7" class="w100" clearable v-model="checkboxList" multiple>
|
||||
<div class="flex items-center w-full">
|
||||
<el-radio v-model="radioValue" :label="7" class="mr-1"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 7" class="!w-full" clearable v-model="checkboxList" multiple>
|
||||
<el-option v-for="item in 31" :key="item" :value="`${item}`">{{ item }}</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
@@ -22,9 +22,9 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<div class="flex-align-center w100">
|
||||
<el-radio v-model="radioValue" :label="4" class="mr5"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 4" class="w100" clearable v-model="checkboxList" multiple>
|
||||
<div class="flex items-center w-full">
|
||||
<el-radio v-model="radioValue" :label="4" class="mr-1"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 4" class="!w-full" clearable v-model="checkboxList" multiple>
|
||||
<el-option v-for="item in 60" :key="item" :value="`${item - 1}`">{{ item - 1 }}</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
@@ -22,9 +22,9 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<div class="flex-align-center w100">
|
||||
<el-radio v-model="radioValue" :label="4" class="mr5"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 4" class="w100" clearable v-model="checkboxList" multiple>
|
||||
<div class="flex items-center w-full">
|
||||
<el-radio v-model="radioValue" :label="4" class="mr-1"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 4" class="!w-full" clearable v-model="checkboxList" multiple>
|
||||
<el-option v-for="item in 60" :key="item" :value="`${item - 1}`">{{ item - 1 }}</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
@@ -22,9 +22,9 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<div class="flex-align-center w100">
|
||||
<el-radio v-model="radioValue" :label="4" class="mr5"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 4" class="w100" clearable v-model="checkboxList" multiple>
|
||||
<div class="flex items-center w-full">
|
||||
<el-radio v-model="radioValue" :label="4" class="mr-1"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 4" class="!w-full" clearable v-model="checkboxList" multiple>
|
||||
<el-option v-for="item in 12" :key="item" :value="`${item}`">{{ item }}</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
@@ -22,9 +22,9 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<div class="flex-align-center w100">
|
||||
<el-radio v-model="radioValue" :label="4" class="mr5"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 4" class="w100" clearable v-model="checkboxList" multiple>
|
||||
<div class="flex items-center w-full">
|
||||
<el-radio v-model="radioValue" :label="4" class="mr-1"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 4" class="!w-full" clearable v-model="checkboxList" multiple>
|
||||
<el-option v-for="item in 60" :key="item" :value="`${item - 1}`">{{ item - 1 }}</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
@@ -32,9 +32,9 @@
|
||||
</el-form-item> -->
|
||||
|
||||
<el-form-item>
|
||||
<div class="flex-align-center w100">
|
||||
<el-radio v-model="radioValue" :label="6" class="mr5"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 6" class="w100" clearable v-model="checkboxList" multiple>
|
||||
<div class="flex items-center w-full">
|
||||
<el-radio v-model="radioValue" :label="6" class="mr-1"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 6" class="!w-full" clearable v-model="checkboxList" multiple>
|
||||
<el-option v-for="(item, index) of weekList" :label="item" :key="index" :value="`${index + 1}`">{{ $t(item) }}</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
@@ -26,9 +26,9 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<div class="flex-align-center w100">
|
||||
<el-radio v-model="radioValue" :label="5" class="mr5"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 5" class="w100" clearable v-model="checkboxList" multiple>
|
||||
<div class="flex items-center w-full">
|
||||
<el-radio v-model="radioValue" :label="5" class="mr-1"> {{ $t('components.crontab.appoint') }} </el-radio>
|
||||
<el-select @click="radioValue = 5" class="!w-full" clearable v-model="checkboxList" multiple>
|
||||
<el-option v-for="item in 9" :key="item" :value="`${item - 1 + fullYear}`" :label="item - 1 + fullYear" />
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<div class="dynamic-form-edit w100">
|
||||
<el-table :data="formItems" stripe class="w100">
|
||||
<div class="dynamic-form-edit !w-full">
|
||||
<el-table :data="formItems" stripe class="!w-full">
|
||||
<el-table-column prop="name" label="model" min-width="100px">
|
||||
<template #header>
|
||||
<el-button class="ml0" type="primary" circle size="small" icon="Plus" @click="addItem()"> </el-button>
|
||||
<span class="ml10">model field</span>
|
||||
<span class="ml-2">model field</span>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row['model']" :placeholder="$t('components.df.fieldModelPlaceholder')" clearable> </el-input>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="icon-selector w100 h100">
|
||||
<div class="icon-selector !w-full !h-full">
|
||||
<el-input
|
||||
v-model="state.fontIconSearch"
|
||||
:placeholder="state.fontIconPlaceholder"
|
||||
@@ -12,7 +12,7 @@
|
||||
@blur="onIconBlur"
|
||||
>
|
||||
<template #prepend>
|
||||
<SvgIcon :name="state.fontIconPrefix === '' ? prepend : state.fontIconPrefix" class="font14" />
|
||||
<SvgIcon :name="state.fontIconPrefix === '' ? prepend : state.fontIconPrefix" class="!text-[14px]" />
|
||||
</template>
|
||||
</el-input>
|
||||
<el-popover
|
||||
@@ -25,7 +25,7 @@
|
||||
virtual-triggering
|
||||
>
|
||||
<template #default>
|
||||
<div class="ml5 mt5">{{ $t(title) }}</div>
|
||||
<div class="ml-1 mt-1">{{ $t(title) }}</div>
|
||||
<div class="icon-selector-warp">
|
||||
<el-tabs v-model="state.fontIconTabActive" @tab-click="onIconClick">
|
||||
<el-tab-pane lazy label="ele" name="ele">
|
||||
|
||||
@@ -1,9 +1,8 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full flex flex-col flex-1 overflow-hidden">
|
||||
<transition name="el-zoom-in-top">
|
||||
<!-- 查询表单 -->
|
||||
<SearchForm v-if="isShowSearch" :items="tableSearchItems" v-model="queryForm" :search="search"
|
||||
:reset="reset" :search-col="searchCol">
|
||||
<SearchForm v-if="isShowSearch" :items="tableSearchItems" v-model="queryForm" :search="search" :reset="reset" :search-col="searchCol">
|
||||
<!-- 遍历父组件传入的 solts 透传给子组件 -->
|
||||
<template v-for="(_, key) in useSlots()" v-slot:[key]>
|
||||
<slot :name="key"></slot>
|
||||
@@ -11,7 +10,7 @@
|
||||
</SearchForm>
|
||||
</transition>
|
||||
|
||||
<div class="card">
|
||||
<el-card class="h-full" body-class="h-full">
|
||||
<div class="table-main">
|
||||
<!-- 表格头部 操作按钮 -->
|
||||
<div class="table-header">
|
||||
@@ -25,48 +24,57 @@
|
||||
<!-- 简易单个搜索项 -->
|
||||
<div v-if="nowSearchItem" class="simple-search-form">
|
||||
<el-dropdown v-if="searchItems?.length > 1">
|
||||
<SvgIcon :size="16" name="CaretBottom" class="mr4 mt6 simple-search-form-btn" />
|
||||
<SvgIcon :size="16" name="CaretBottom" class="!mr-1 !mt-1.5 simple-search-form-btn" />
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item v-for="searchItem in searchItems"
|
||||
:key="searchItem.prop" @click="changeSimpleFormItem(searchItem)">
|
||||
<el-dropdown-item
|
||||
v-for="searchItem in searchItems"
|
||||
:key="searchItem.prop"
|
||||
@click="changeSimpleFormItem(searchItem)"
|
||||
>
|
||||
{{ $t(searchItem.label) }}
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
|
||||
<div class="simple-search-form-label mt5">
|
||||
<div class="simple-search-form-label mt-1">
|
||||
<el-text truncated tag="b">{{ `${$t(nowSearchItem?.label)} : ` }}</el-text>
|
||||
</div>
|
||||
|
||||
<el-form-item style="width: 200px" :key="nowSearchItem.prop">
|
||||
<SearchFormItem @keyup.enter.native="searchFormItemKeyUpEnter"
|
||||
v-if="!nowSearchItem.slot" :item="nowSearchItem"
|
||||
v-model="queryForm[nowSearchItem.prop]" />
|
||||
<SearchFormItem
|
||||
@keyup.enter.native="searchFormItemKeyUpEnter"
|
||||
v-if="!nowSearchItem.slot"
|
||||
:item="nowSearchItem"
|
||||
v-model="queryForm[nowSearchItem.prop]"
|
||||
/>
|
||||
|
||||
<slot @keyup.enter.native="searchFormItemKeyUpEnter" v-else
|
||||
:name="nowSearchItem.slot">
|
||||
</slot>
|
||||
<slot @keyup.enter.native="searchFormItemKeyUpEnter" v-else :name="nowSearchItem.slot"> </slot>
|
||||
</el-form-item>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<el-button v-if="showToolButton('search') && searchItems?.length" icon="Search"
|
||||
circle @click="search" />
|
||||
<el-button v-if="showToolButton('search') && searchItems?.length" icon="Search" circle @click="search" />
|
||||
|
||||
<!-- <el-button v-if="showToolButton('refresh')" icon="Refresh" circle @click="execQuery()" /> -->
|
||||
|
||||
<el-button v-if="showToolButton('search') && searchItems?.length > 1"
|
||||
:icon="isShowSearch ? 'ArrowDown' : 'ArrowUp'" circle
|
||||
@click="isShowSearch = !isShowSearch" />
|
||||
<el-button
|
||||
v-if="showToolButton('search') && searchItems?.length > 1"
|
||||
:icon="isShowSearch ? 'ArrowDown' : 'ArrowUp'"
|
||||
circle
|
||||
@click="isShowSearch = !isShowSearch"
|
||||
/>
|
||||
|
||||
<el-popover placement="bottom" title="表格配置"
|
||||
popper-style="max-height: 550px; overflow: auto; max-width: 450px" width="auto"
|
||||
trigger="click">
|
||||
<el-popover
|
||||
placement="bottom"
|
||||
title="表格配置"
|
||||
popper-style="max-height: 550px; overflow: auto; max-width: 450px"
|
||||
width="auto"
|
||||
trigger="click"
|
||||
>
|
||||
<div v-for="(item, index) in tableColumns" :key="index">
|
||||
<el-checkbox v-model="item.show" :label="item.label" :true-value="true"
|
||||
:false-value="false" />
|
||||
<el-checkbox v-model="item.show" :label="$t(item.label)" :true-value="true" :false-value="false" />
|
||||
</div>
|
||||
<template #reference>
|
||||
<el-button icon="Operation" circle :size="props.size"></el-button>
|
||||
@@ -78,55 +86,103 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-table ref="tableRef" v-bind="$attrs" :max-height="tableMaxHeight"
|
||||
@selection-change="handleSelectionChange" :data="tableData" highlight-current-row
|
||||
v-loading="loading" :size="props.size as any" :border="border">
|
||||
<el-table-column v-if="props.showSelection" :selectable="selectable" type="selection" width="40" />
|
||||
<div class="h-[calc(100%-100px)]">
|
||||
<el-table
|
||||
ref="tableRef"
|
||||
v-bind="$attrs"
|
||||
height="100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
:data="tableData"
|
||||
highlight-current-row
|
||||
v-loading="loading"
|
||||
:size="props.size as any"
|
||||
:border="border"
|
||||
>
|
||||
<el-table-column v-if="props.showSelection" :selectable="selectable" type="selection" width="40" />
|
||||
|
||||
<template v-for="(item, index) in tableColumns">
|
||||
<el-table-column :key="index" v-if="item.show" :prop="item.prop" :label="$t(item.label)"
|
||||
:fixed="item.fixed" :align="item.align" :show-overflow-tooltip="item.showOverflowTooltip"
|
||||
:min-width="item.minWidth" :sortable="item.sortable || false" :type="item.type"
|
||||
:width="item.width">
|
||||
<!-- 插槽：预留功能 -->
|
||||
<template #default="scope" v-if="item.slot">
|
||||
<slot :name="item.slotName ? item.slotName : item.prop" :data="scope.row"></slot>
|
||||
</template>
|
||||
<template v-for="(item, index) in tableColumns">
|
||||
<el-table-column
|
||||
:key="index"
|
||||
v-if="item.show"
|
||||
:prop="item.prop"
|
||||
:label="$t(item.label)"
|
||||
:fixed="item.fixed"
|
||||
:align="item.align"
|
||||
:show-overflow-tooltip="item.showOverflowTooltip"
|
||||
:min-width="item.minWidth"
|
||||
:sortable="item.sortable || false"
|
||||
:type="item.type"
|
||||
:width="item.width"
|
||||
>
|
||||
<!-- 插槽：预留功能 -->
|
||||
<template #default="scope" v-if="item.slot">
|
||||
<slot :name="item.slotName ? item.slotName : item.prop" :data="scope.row"></slot>
|
||||
</template>
|
||||
|
||||
<!-- 枚举类型使用tab展示 -->
|
||||
<template #default="scope" v-else-if="item.type == 'tag'">
|
||||
<enum-tag :size="props.size" :enums="item.typeParam"
|
||||
:value="item.getValueByData(scope.row)"></enum-tag>
|
||||
</template>
|
||||
<!-- 枚举类型使用tab展示 -->
|
||||
<template #default="scope" v-else-if="item.type == 'tag'">
|
||||
<enum-tag :size="props.size" :enums="item.typeParam" :value="item.getValueByData(scope.row)"></enum-tag>
|
||||
</template>
|
||||
|
||||
<template #default="scope" v-else>
|
||||
<!-- 配置了美化文本按钮以及文本内容大于指定长度，则显示美化按钮 -->
|
||||
<el-popover v-if="item.isBeautify && item.getValueByData(scope.row)?.length > 35"
|
||||
effect="light" trigger="click" placement="top" width="600px">
|
||||
<template #default>
|
||||
<el-input :autosize="{ minRows: 3, maxRows: 15 }" disabled v-model="formatVal"
|
||||
type="textarea" />
|
||||
</template>
|
||||
<template #reference>
|
||||
<el-link @click="formatText(item.getValueByData(scope.row))" :underline="false"
|
||||
type="success" icon="MagicStick" class="mr5"></el-link>
|
||||
</template>
|
||||
</el-popover>
|
||||
<template #default="scope" v-else>
|
||||
<!-- 配置了美化文本按钮以及文本内容大于指定长度，则显示美化按钮 -->
|
||||
<el-popover
|
||||
v-if="item.isBeautify && item.getValueByData(scope.row)?.length > 35"
|
||||
effect="light"
|
||||
trigger="click"
|
||||
placement="top"
|
||||
width="600px"
|
||||
>
|
||||
<template #default>
|
||||
<el-input :autosize="{ minRows: 3, maxRows: 15 }" disabled v-model="formatVal" type="textarea" />
|
||||
</template>
|
||||
<template #reference>
|
||||
<el-link
|
||||
@click="formatText(item.getValueByData(scope.row))"
|
||||
:underline="false"
|
||||
type="success"
|
||||
icon="MagicStick"
|
||||
class="mr-1"
|
||||
></el-link>
|
||||
</template>
|
||||
</el-popover>
|
||||
|
||||
<span>{{ item.getValueByData(scope.row) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
<span>{{ item.getValueByData(scope.row) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
<el-row v-if="props.pageable" class="!mt-4" type="flex" justify="end">
|
||||
<el-pagination
|
||||
:small="props.size == 'small'"
|
||||
@current-change="pageNumChange"
|
||||
@size-change="pageSizeChange"
|
||||
style="text-align: right"
|
||||
layout="prev, pager, next, total, sizes"
|
||||
:total="total"
|
||||
v-model:current-page="queryForm.pageNum"
|
||||
v-model:page-size="queryForm.pageSize"
|
||||
:page-sizes="pageSizes"
|
||||
/>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
<el-row v-if="props.pageable" class="mt20" type="flex" justify="end">
|
||||
<el-pagination :small="props.size == 'small'" @current-change="pageNumChange"
|
||||
@size-change="pageSizeChange" style="text-align: right" layout="prev, pager, next, total, sizes"
|
||||
:total="total" v-model:current-page="queryForm.pageNum" v-model:page-size="queryForm.pageSize"
|
||||
:page-sizes="pageSizes" />
|
||||
</el-row>
|
||||
</div>
|
||||
<!-- <el-row v-if="props.pageable" class="!mt-4" type="flex" justify="end">
|
||||
<el-pagination
|
||||
:small="props.size == 'small'"
|
||||
@current-change="pageNumChange"
|
||||
@size-change="pageSizeChange"
|
||||
style="text-align: right"
|
||||
layout="prev, pager, next, total, sizes"
|
||||
:total="total"
|
||||
v-model:current-page="queryForm.pageNum"
|
||||
v-model:page-size="queryForm.pageSize"
|
||||
:page-sizes="pageSizes"
|
||||
/>
|
||||
</el-row> -->
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -145,13 +201,12 @@ import SvgIcon from '@/components/svgIcon/index.vue';
|
||||
import { usePageTable } from '@/hooks/usePageTable';
|
||||
import { ElTable } from 'element-plus';
|
||||
|
||||
|
||||
const emit = defineEmits(['update:selectionData', 'pageSizeChange', 'pageNumChange']);
|
||||
|
||||
export interface PageTableProps {
|
||||
size?: string;
|
||||
pageApi?: Api; // 请求表格数据的 api
|
||||
columns: TableColumn[]; // 列配置项 ==> 必传
|
||||
columns: TableColumn[] | any[]; // 列配置项 ==> 必传
|
||||
showSelection?: boolean;
|
||||
selectable?: (row: any) => boolean; // 是否可选
|
||||
pageable?: boolean;
|
||||
@@ -385,45 +440,11 @@ defineExpose({
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// .el-table__header th {
|
||||
// height: 45px;
|
||||
// font-size: 15px;
|
||||
// font-weight: bold;
|
||||
// color: var(--el-text-color-primary);
|
||||
// background: var(--el-fill-color-light);
|
||||
// }
|
||||
|
||||
// .el-table__row {
|
||||
// height: 45px;
|
||||
// font-size: 14px;
|
||||
|
||||
// .move {
|
||||
// cursor: move;
|
||||
|
||||
// .el-icon {
|
||||
// cursor: move;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// 设置 el-table 中 header 文字不换行，并省略
|
||||
.el-table__header .el-table__cell>.cell {
|
||||
// white-space: nowrap;
|
||||
.el-table__header .el-table__cell > .cell {
|
||||
white-space: wrap;
|
||||
}
|
||||
|
||||
// 解决表格数据为空时样式不居中问题(仅在element-plus中)
|
||||
// .el-table__empty-block {
|
||||
// position: absolute;
|
||||
// top: 50%;
|
||||
// left: 50%;
|
||||
// transform: translate(-50%, -50%);
|
||||
|
||||
// .table-empty {
|
||||
// line-height: 30px;
|
||||
// }
|
||||
// }
|
||||
|
||||
// table 中 image 图片样式
|
||||
.table-image {
|
||||
width: 50px;
|
||||
|
||||
@@ -38,7 +38,7 @@ export class TableColumn {
|
||||
/**
|
||||
* 插槽名，
|
||||
*/
|
||||
private slotName: string = '';
|
||||
slotName: string = '';
|
||||
|
||||
showOverflowTooltip: boolean = true;
|
||||
|
||||
@@ -73,12 +73,12 @@ export class TableColumn {
|
||||
/**
|
||||
* 是否显示该列
|
||||
*/
|
||||
private show: boolean = true;
|
||||
show: boolean = true;
|
||||
|
||||
/**
|
||||
* 是否展示美化按钮（主要用于美化json文本等）
|
||||
*/
|
||||
private isBeautify: boolean = false;
|
||||
isBeautify: boolean = false;
|
||||
|
||||
constructor(prop: string, label: string) {
|
||||
this.prop = prop;
|
||||
|
||||
@@ -3,12 +3,12 @@
|
||||
<div ref="viewportRef" class="viewport" :style="{ width: state.size.width + 'px', height: state.size.height + 'px' }">
|
||||
<div ref="displayRef" class="display" tabindex="0" />
|
||||
<div class="btn-box">
|
||||
<SvgIcon name="DocumentCopy" @click="openPaste" :size="20" class="pointer-icon mr10" title="剪贴板" />
|
||||
<SvgIcon name="FolderOpened" @click="openFilesystem" :size="20" class="pointer-icon mr10" title="文件管理" />
|
||||
<SvgIcon name="FullScreen" @click="state.fullscreen ? closeFullScreen() : openFullScreen()" :size="20" class="pointer-icon mr10" title="全屏" />
|
||||
<SvgIcon name="DocumentCopy" @click="openPaste" :size="20" class="pointer-icon mr-2" title="剪贴板" />
|
||||
<SvgIcon name="FolderOpened" @click="openFilesystem" :size="20" class="pointer-icon mr-2" title="文件管理" />
|
||||
<SvgIcon name="FullScreen" @click="state.fullscreen ? closeFullScreen() : openFullScreen()" :size="20" class="pointer-icon mr-2" title="全屏" />
|
||||
|
||||
<el-dropdown>
|
||||
<SvgIcon name="Monitor" :size="20" class="pointer-icon mr10" title="发送快捷键" style="color: #fff" />
|
||||
<SvgIcon name="Monitor" :size="20" class="pointer-icon mr-2" title="发送快捷键" style="color: #fff" />
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item @click="openSendKeyboard(['65507', '65513', '65535'])"> Ctrl + Alt + Delete </el-dropdown-item>
|
||||
@@ -21,7 +21,7 @@
|
||||
</template>
|
||||
</el-dropdown>
|
||||
|
||||
<SvgIcon name="Refresh" @click="connect(0, 0)" :size="20" class="pointer-icon mr10" title="重新连接" />
|
||||
<SvgIcon name="Refresh" @click="connect(0, 0)" :size="20" class="pointer-icon mr-2" title="重新连接" />
|
||||
</div>
|
||||
<clipboard-dialog ref="clipboardRef" v-model:visible="state.clipboardDialog.visible" @close="closePaste" @submit="onsubmitClipboard" />
|
||||
|
||||
|
||||
@@ -24,7 +24,7 @@
|
||||
<div class="title-right-fixed">
|
||||
<el-popconfirm @confirm="connect(true)" title="确认重新连接?">
|
||||
<template #reference>
|
||||
<div class="mr10 pointer">
|
||||
<div class="mr-2 cursor-pointer">
|
||||
<el-tag v-if="state.status == TerminalStatus.Connected" type="success" effect="light" round> 已连接 </el-tag>
|
||||
<el-tag v-else type="danger" effect="light" round> 未连接，点击重连 </el-tag>
|
||||
</div>
|
||||
|
||||
@@ -28,7 +28,7 @@
|
||||
<div class="title-right-fixed">
|
||||
<el-popconfirm @confirm="reConnect(openTerminal.terminalId)" :title="$t('components.terminal.connConfirm')">
|
||||
<template #reference>
|
||||
<div class="mr15 pointer">
|
||||
<div class="mr-4 cursor-pointer">
|
||||
<el-tag v-if="openTerminal.status == TerminalStatus.Connected" type="success" effect="light" round>
|
||||
{{ $t('components.terminal.connected') }}
|
||||
</el-tag>
|
||||
@@ -39,10 +39,10 @@
|
||||
|
||||
<el-popover placement="bottom" :width="200" trigger="hover">
|
||||
<template #reference>
|
||||
<SvgIcon name="QuestionFilled" :size="20" class="pointer-icon mr10" />
|
||||
<SvgIcon name="QuestionFilled" :size="20" class="pointer-icon !mr-2" />
|
||||
</template>
|
||||
<div>ctrl | command + f ({{ $t('components.terminal.search') }})</div>
|
||||
<div class="mt5">{{ $t('components.terminal.reConnTips') }}</div>
|
||||
<div class="mt-1">{{ $t('components.terminal.reConnTips') }}</div>
|
||||
</el-popover>
|
||||
|
||||
<SvgIcon
|
||||
@@ -50,7 +50,7 @@
|
||||
v-if="props.visibleMinimize"
|
||||
@click="minimize(openTerminal.terminalId)"
|
||||
:size="20"
|
||||
class="pointer-icon mr10"
|
||||
class="pointer-icon mr-2"
|
||||
:title="$t('components.terminal.minimize')"
|
||||
/>
|
||||
|
||||
@@ -58,7 +58,7 @@
|
||||
name="FullScreen"
|
||||
@click="handlerFullScreen(openTerminal)"
|
||||
:size="20"
|
||||
class="pointer-icon mr10"
|
||||
class="pointer-icon mr-2"
|
||||
:title="$t('components.terminal.fullScreenTitle')"
|
||||
/>
|
||||
|
||||
@@ -88,7 +88,7 @@
|
||||
<el-card
|
||||
v-for="minimizeTerminal of minimizeTerminals"
|
||||
:key="minimizeTerminal.terminalId"
|
||||
:class="`terminal-minimize-item pointer ${minimizeTerminal.styleClass}`"
|
||||
:class="`terminal-minimize-item cursor-pointer ${minimizeTerminal.styleClass}`"
|
||||
size="small"
|
||||
@click="maximize(minimizeTerminal.terminalId)"
|
||||
>
|
||||
@@ -99,7 +99,7 @@
|
||||
</el-tooltip>
|
||||
|
||||
<!-- 关闭按钮 -->
|
||||
<SvgIcon name="CloseBold" @click.stop="closeMinimizeTerminal(minimizeTerminal.terminalId)" class="ml10 pointer-icon fr" :size="20" />
|
||||
<SvgIcon name="CloseBold" @click.stop="closeMinimizeTerminal(minimizeTerminal.terminalId)" class="ml-2 pointer-icon float-right" :size="20" />
|
||||
</el-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -4,16 +4,16 @@
|
||||
<template #header>
|
||||
<DrawerHeader :header="props.title" :back="cancel">
|
||||
<template #extra>
|
||||
<EnumTag :enums="LogTypeEnum" :value="log?.type" class="mr20" />
|
||||
<EnumTag :enums="LogTypeEnum" :value="log?.type" class="mr-4.5" />
|
||||
</template>
|
||||
</DrawerHeader>
|
||||
</template>
|
||||
|
||||
<el-descriptions class="mb10" :column="1" border v-if="extra">
|
||||
<el-descriptions class="mb-2" :column="1" border v-if="extra">
|
||||
<el-descriptions-item v-for="(value, key) in extra" :key="key" :span="1" :label="key">{{ value }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
<TerminalBody class="mb10" ref="terminalRef" height="calc(100vh - 220px)" />
|
||||
<TerminalBody class="mb-2" ref="terminalRef" height="calc(100vh - 220px)" />
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
</el-scrollbar>
|
||||
</el-aside>
|
||||
<el-drawer v-model="themeConfig.isCollapse" :with-header="false" direction="ltr" size="220px" v-else>
|
||||
<el-aside class="layout-aside w100 h100">
|
||||
<el-aside class="layout-aside !w-full !h-full">
|
||||
<Logo v-if="setShowLogo" />
|
||||
<el-scrollbar class="flex-auto" ref="layoutAsideScrollbarRef">
|
||||
<Vertical :menuList="state.menuList" />
|
||||
|
||||
@@ -2,25 +2,29 @@
|
||||
<div class="layout-columns-aside">
|
||||
<el-scrollbar>
|
||||
<ul>
|
||||
<li v-for="(v, k) in state.columnsAsideList" :key="k" @click="onColumnsAsideMenuClick(v, k)" :ref="(el) => {
|
||||
if (el) columnsAsideOffsetTopRefs[k] = el;
|
||||
}
|
||||
" :class="{ 'layout-columns-active': state.liIndex === k }" :title="$t(v.meta.title)">
|
||||
<div class="layout-columns-aside-li-box"
|
||||
v-if="!v.meta.link || (v.meta.link && v.meta.linkType == 1)">
|
||||
<li
|
||||
v-for="(v, k) in state.columnsAsideList"
|
||||
:key="k"
|
||||
@click="onColumnsAsideMenuClick(v, k)"
|
||||
:ref="
|
||||
(el) => {
|
||||
if (el) columnsAsideOffsetTopRefs[k] = el;
|
||||
}
|
||||
"
|
||||
:class="{ 'layout-columns-active': state.liIndex === k }"
|
||||
:title="$t(v.meta.title)"
|
||||
>
|
||||
<div class="layout-columns-aside-li-box" v-if="!v.meta.link || (v.meta.link && v.meta.linkType == 1)">
|
||||
<i :class="v.meta.icon"></i>
|
||||
<div class="layout-columns-aside-li-box-title font12">
|
||||
{{ $t(v.meta.title) && $t(v.meta.title).length >= 4 ? $t(v.meta.title).substr(0, 4) :
|
||||
$t(v.meta.title) }}
|
||||
<div class="layout-columns-aside-li-box-title !text-[12px]">
|
||||
{{ $t(v.meta.title) && $t(v.meta.title).length >= 4 ? $t(v.meta.title).substr(0, 4) : $t(v.meta.title) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-columns-aside-li-box" v-else>
|
||||
<a :href="v.meta.link" target="_blank">
|
||||
<i :class="v.meta.icon"></i>
|
||||
<div class="layout-columns-aside-li-box-title font12">
|
||||
{{ $t(v.meta.title) && $t(v.meta.title).length >= 4 ? $t(v.meta.title).substr(0, 4) :
|
||||
$t(v.meta.title)
|
||||
}}
|
||||
<div class="layout-columns-aside-li-box-title !text-[12px]">
|
||||
{{ $t(v.meta.title) && $t(v.meta.title).length >= 4 ? $t(v.meta.title).substr(0, 4) : $t(v.meta.title) }}
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
<template>
|
||||
<el-main class="layout-main">
|
||||
<el-scrollbar ref="layoutScrollbarRef" v-show="!state.currentRouteMeta.link && state.currentRouteMeta.linkType != 1">
|
||||
<el-main class="layout-main !h-full">
|
||||
<el-scrollbar ref="layoutScrollbarRef" view-class="!h-full" v-show="!state.currentRouteMeta.link && state.currentRouteMeta.linkType != 1">
|
||||
<LayoutParentView />
|
||||
</el-scrollbar>
|
||||
|
||||
<Link class="h100" :meta="state.currentRouteMeta" v-if="state.currentRouteMeta.link && state.currentRouteMeta.linkType == 2" />
|
||||
<Link class="!h-full" :meta="state.currentRouteMeta" v-if="state.currentRouteMeta.link && state.currentRouteMeta.linkType == 2" />
|
||||
|
||||
<Iframes
|
||||
class="h100"
|
||||
class="!h-full"
|
||||
:meta="state.currentRouteMeta"
|
||||
v-if="state.currentRouteMeta.link && state.currentRouteMeta.linkType == 1 && state.isShowLink"
|
||||
@getCurrentRouteMeta="onGetCurrentRouteMeta"
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
</el-icon>
|
||||
</template>
|
||||
<template #default="{ item }">
|
||||
<div><SvgIcon :name="item.meta.icon" class="mr5" />{{ $t(item.meta.title) }}</div>
|
||||
<div><SvgIcon :name="item.meta.icon" class="mr-1" />{{ $t(item.meta.title) }}</div>
|
||||
</template>
|
||||
</el-autocomplete>
|
||||
</el-dialog>
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<template v-if="themeConfig.terminalTheme == 'custom'">
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt10">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-2">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('layout.config.fontColor') }}</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex-value">
|
||||
<el-color-picker v-model="themeConfig.terminalForeground" size="small" @change="onColorPickerChange('terminalForeground')">
|
||||
@@ -37,14 +37,14 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt10">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-2">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('layout.config.fontSize') }}</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex-value">
|
||||
<el-input-number v-model="themeConfig.terminalFontSize" controls-position="right" :min="12" :max="24" size="small" style="width: 90px">
|
||||
</el-input-number>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt10">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-2">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('layout.config.fontWeight') }}</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex-value">
|
||||
<el-select v-model="themeConfig.terminalFontWeight" size="small" style="width: 90px">
|
||||
@@ -68,7 +68,7 @@
|
||||
|
||||
<!-- 全局设置 -->
|
||||
<el-divider content-position="left">{{ $t('layout.config.globalSetting') }}</el-divider>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('layout.config.pagesize') }}</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex-value">
|
||||
<el-input-number
|
||||
@@ -185,7 +185,7 @@
|
||||
</el-color-picker>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt10">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-2">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">顶栏背景渐变</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex-value">
|
||||
<el-switch v-model="themeConfig.isTopBarColorGradual"
|
||||
@@ -211,7 +211,7 @@
|
||||
<el-switch v-model="themeConfig.isCollapse" @change="onThemeConfigChange"></el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">
|
||||
{{ $t('layout.config.isUniqueOpened') }}
|
||||
</div>
|
||||
@@ -219,7 +219,7 @@
|
||||
<el-switch v-model="themeConfig.isUniqueOpened"></el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">
|
||||
{{ $t('layout.config.isFixedHeader') }}
|
||||
</div>
|
||||
@@ -227,7 +227,7 @@
|
||||
<el-switch v-model="themeConfig.isFixedHeader" @change="onIsFixedHeaderChange"></el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15" :style="{ opacity: themeConfig.layout !== 'classic' ? 0.5 : 1 }">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5" :style="{ opacity: themeConfig.layout !== 'classic' ? 0.5 : 1 }">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">
|
||||
{{ $t('layout.config.isClassicSplitMenu') }}
|
||||
</div>
|
||||
@@ -236,7 +236,7 @@
|
||||
</el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">
|
||||
{{ $t('layout.config.isLockScreen') }}
|
||||
</div>
|
||||
@@ -256,13 +256,13 @@
|
||||
|
||||
<!-- 界面显示 -->
|
||||
<el-divider content-position="left">{{ $t('layout.config.interfaceDisplay') }}</el-divider>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('layout.config.isShowLogo') }}</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex-value">
|
||||
<el-switch v-model="themeConfig.isShowLogo" @change="onIsShowLogoChange"></el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15" :style="{ opacity: themeConfig.layout === 'transverse' ? 0.5 : 1 }">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5" :style="{ opacity: themeConfig.layout === 'transverse' ? 0.5 : 1 }">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">
|
||||
{{ $t('layout.config.isBreadcrumb') }}
|
||||
</div>
|
||||
@@ -274,7 +274,7 @@
|
||||
></el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">
|
||||
{{ $t('layout.config.isBreadcrumbIcon') }}
|
||||
</div>
|
||||
@@ -282,13 +282,13 @@
|
||||
<el-switch v-model="themeConfig.isBreadcrumbIcon"></el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('layout.config.isTagsview') }}</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex-value">
|
||||
<el-switch v-model="themeConfig.isTagsview"></el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">
|
||||
{{ $t('layout.config.isTagsviewIcon') }}
|
||||
</div>
|
||||
@@ -296,7 +296,7 @@
|
||||
<el-switch v-model="themeConfig.isTagsviewIcon"></el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">
|
||||
{{ $t('layout.config.isCacheTagsView') }}
|
||||
</div>
|
||||
@@ -304,7 +304,7 @@
|
||||
<el-switch v-model="themeConfig.isCacheTagsView"></el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">
|
||||
{{ $t('layout.config.isSortableTagsView') }}
|
||||
</div>
|
||||
@@ -312,19 +312,19 @@
|
||||
<el-switch v-model="themeConfig.isSortableTagsView" @change="onSortableTagsViewChange"></el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('layout.config.isFooter') }}</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex-value">
|
||||
<el-switch v-model="themeConfig.isFooter"></el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('layout.config.isGrayscale') }}</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex-value">
|
||||
<el-switch v-model="themeConfig.isGrayscale" @change="onAddFilterChange('grayscale')"></el-switch>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('layout.config.isInvert') }}</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex-value">
|
||||
<el-switch v-model="themeConfig.isInvert" @change="onAddFilterChange('invert')"></el-switch>
|
||||
@@ -333,7 +333,7 @@
|
||||
|
||||
<!-- 其它设置 -->
|
||||
<el-divider content-position="left">{{ $t('layout.config.otherSetting') }}</el-divider>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('layout.config.tagsStyle') }}</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex-value">
|
||||
<el-select v-model="themeConfig.tagsStyle" placeholder="请选择" size="small" style="width: 90px">
|
||||
@@ -343,7 +343,7 @@
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">{{ $t('layout.config.animation') }}</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex-value">
|
||||
<el-select v-model="themeConfig.animation" size="small" style="width: 90px">
|
||||
@@ -353,7 +353,7 @@
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-breadcrumb-seting-bar-flex mt15 mb28">
|
||||
<div class="layout-breadcrumb-seting-bar-flex !mt-3.5 !mb-5.5">
|
||||
<div class="layout-breadcrumb-seting-bar-flex-label">
|
||||
{{ $t('layout.config.columnsAsideStyle') }}
|
||||
</div>
|
||||
|
||||
@@ -56,13 +56,13 @@
|
||||
</transition>
|
||||
</el-popover>
|
||||
</div>
|
||||
<div class="layout-navbars-breadcrumb-user-icon mr10" @click="onScreenfullClick">
|
||||
<div class="layout-navbars-breadcrumb-user-icon mr-2" @click="onScreenfullClick">
|
||||
<SvgIcon v-if="!state.isScreenfull" name="full-screen" :title="$t('layout.user.fullScreenOff')" />
|
||||
<SvgIcon v-else name="crop" />
|
||||
</div>
|
||||
<el-dropdown trigger="click" :show-timeout="70" :hide-timeout="50" @command="onHandleCommandClick">
|
||||
<span class="layout-navbars-breadcrumb-user-link" style="cursor: pointer">
|
||||
<img :src="userInfo.photo" class="layout-navbars-breadcrumb-user-link-photo mr5" />
|
||||
<span class="layout-navbars-breadcrumb-user-link cursor-pointer">
|
||||
<img :src="userInfo.photo" class="layout-navbars-breadcrumb-user-link-photo mr-1" />
|
||||
{{ userInfo.name || userInfo.username }}
|
||||
<i class="el-icon-arrow-down el-icon--right"></i>
|
||||
</span>
|
||||
|
||||
@@ -16,18 +16,18 @@
|
||||
}
|
||||
"
|
||||
>
|
||||
<SvgIcon name="icon layout/tag-view-active" class="layout-navbars-tagsview-ul-li-iconfont font14" v-if="isActive(v)" />
|
||||
<SvgIcon name="icon layout/tag-view-active" class="layout-navbars-tagsview-ul-li-iconfont !text-[14px]" v-if="isActive(v)" />
|
||||
<SvgIcon :name="v.icon" class="layout-navbars-tagsview-ul-li-iconfont" v-if="!isActive(v) && themeConfig.isTagsviewIcon" />
|
||||
<span>{{ $t(v.title) }}</span>
|
||||
<template v-if="isActive(v)">
|
||||
<SvgIcon
|
||||
name="RefreshRight"
|
||||
class="font14 ml5 layout-navbars-tagsview-ul-li-refresh"
|
||||
class="!text-[14px] ml-1 layout-navbars-tagsview-ul-li-refresh"
|
||||
@click.stop="refreshCurrentTagsView($route.fullPath)"
|
||||
/>
|
||||
<SvgIcon
|
||||
name="Close"
|
||||
class="font14 layout-navbars-tagsview-ul-li-icon layout-icon-active"
|
||||
class="!text-[14px] layout-navbars-tagsview-ul-li-icon layout-icon-active"
|
||||
v-if="!v.isAffix"
|
||||
@click.stop="closeCurrentTagsView(themeConfig.isShareTagsView ? v.path : v.path)"
|
||||
/>
|
||||
@@ -35,7 +35,7 @@
|
||||
|
||||
<SvgIcon
|
||||
name="Close"
|
||||
class="font14 layout-navbars-tagsview-ul-li-icon layout-icon-three"
|
||||
class="!text-[14px] layout-navbars-tagsview-ul-li-icon layout-icon-three"
|
||||
v-if="!v.isAffix"
|
||||
@click.stop="closeCurrentTagsView(themeConfig.isShareTagsView ? v.path : v.path)"
|
||||
/>
|
||||
@@ -521,7 +521,8 @@ onBeforeRouteUpdate((to) => {
|
||||
align-items: flex-end;
|
||||
|
||||
.tgs-style-three-svg {
|
||||
-webkit-mask-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNzAiIGhlaWdodD0iNzAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0ibm9uZSI+CgogPGc+CiAgPHRpdGxlPkxheWVyIDE8L3RpdGxlPgogIDxwYXRoIHRyYW5zZm9ybT0icm90YXRlKC0wLjEzMzUwNiA1MC4xMTkyIDUwKSIgaWQ9InN2Z18xIiBkPSJtMTAwLjExOTE5LDEwMGMtNTUuMjI4LDAgLTEwMCwtNDQuNzcyIC0xMDAsLTEwMGwwLDEwMGwxMDAsMHoiIG9wYWNpdHk9InVuZGVmaW5lZCIgc3Ryb2tlPSJudWxsIiBmaWxsPSIjRjhFQUU3Ii8+CiAgPHBhdGggZD0ibS0wLjYzNzY2LDcuMzEyMjhjMC4xMTkxOSwwIDAuMjE3MzcsMC4wNTc5NiAwLjQ3Njc2LDAuMTE5MTljMC4yMzIsMC4wNTQ3NyAwLjI3MzI5LDAuMDM0OTEgMC4zNTc1NywwLjExOTE5YzAuMDg0MjgsMC4wODQyOCAwLjM1NzU3LDAgMC40NzY3NiwwbDAuMTE5MTksMGwwLjIzODM4LDAiIGlkPSJzdmdfMiIgc3Ryb2tlPSJudWxsIiBmaWxsPSJub25lIi8+CiAgPHBhdGggZD0ibTI4LjkyMTM0LDY5LjA1MjQ0YzAsMC4xMTkxOSAwLDAuMjM4MzggMCwwLjM1NzU3bDAsMC4xMTkxOWwwLDAuMTE5MTkiIGlkPSJzdmdfMyIgc3Ryb2tlPSJudWxsIiBmaWxsPSJub25lIi8+CiAgPHJlY3QgaWQ9InN2Z180IiBoZWlnaHQ9IjAiIHdpZHRoPSIxLjMxMTA4IiB5PSI2LjgzNTUyIiB4PSItMC4wNDE3MSIgc3Ryb2tlPSJudWxsIiBmaWxsPSJub25lIi8+CiAgPHJlY3QgaWQ9InN2Z181IiBoZWlnaHQ9IjEuNzg3ODQiIHdpZHRoPSIwLjExOTE5IiB5PSI2OC40NTY1IiB4PSIyOC45MjEzNCIgc3Ryb2tlPSJudWxsIiBmaWxsPSJub25lIi8+CiAgPHJlY3QgaWQ9InN2Z182IiBoZWlnaHQ9IjQuODg2NzciIHdpZHRoPSIxOS4wNzAzMiIgeT0iNTEuMjkzMjEiIHg9IjM2LjY2ODY2IiBzdHJva2U9Im51bGwiIGZpbGw9Im5vbmUiLz4KIDwvZz4KPC9zdmc+'),
|
||||
-webkit-mask-image:
|
||||
url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNzAiIGhlaWdodD0iNzAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0ibm9uZSI+CgogPGc+CiAgPHRpdGxlPkxheWVyIDE8L3RpdGxlPgogIDxwYXRoIHRyYW5zZm9ybT0icm90YXRlKC0wLjEzMzUwNiA1MC4xMTkyIDUwKSIgaWQ9InN2Z18xIiBkPSJtMTAwLjExOTE5LDEwMGMtNTUuMjI4LDAgLTEwMCwtNDQuNzcyIC0xMDAsLTEwMGwwLDEwMGwxMDAsMHoiIG9wYWNpdHk9InVuZGVmaW5lZCIgc3Ryb2tlPSJudWxsIiBmaWxsPSIjRjhFQUU3Ii8+CiAgPHBhdGggZD0ibS0wLjYzNzY2LDcuMzEyMjhjMC4xMTkxOSwwIDAuMjE3MzcsMC4wNTc5NiAwLjQ3Njc2LDAuMTE5MTljMC4yMzIsMC4wNTQ3NyAwLjI3MzI5LDAuMDM0OTEgMC4zNTc1NywwLjExOTE5YzAuMDg0MjgsMC4wODQyOCAwLjM1NzU3LDAgMC40NzY3NiwwbDAuMTE5MTksMGwwLjIzODM4LDAiIGlkPSJzdmdfMiIgc3Ryb2tlPSJudWxsIiBmaWxsPSJub25lIi8+CiAgPHBhdGggZD0ibTI4LjkyMTM0LDY5LjA1MjQ0YzAsMC4xMTkxOSAwLDAuMjM4MzggMCwwLjM1NzU3bDAsMC4xMTkxOWwwLDAuMTE5MTkiIGlkPSJzdmdfMyIgc3Ryb2tlPSJudWxsIiBmaWxsPSJub25lIi8+CiAgPHJlY3QgaWQ9InN2Z180IiBoZWlnaHQ9IjAiIHdpZHRoPSIxLjMxMTA4IiB5PSI2LjgzNTUyIiB4PSItMC4wNDE3MSIgc3Ryb2tlPSJudWxsIiBmaWxsPSJub25lIi8+CiAgPHJlY3QgaWQ9InN2Z181IiBoZWlnaHQ9IjEuNzg3ODQiIHdpZHRoPSIwLjExOTE5IiB5PSI2OC40NTY1IiB4PSIyOC45MjEzNCIgc3Ryb2tlPSJudWxsIiBmaWxsPSJub25lIi8+CiAgPHJlY3QgaWQ9InN2Z182IiBoZWlnaHQ9IjQuODg2NzciIHdpZHRoPSIxOS4wNzAzMiIgeT0iNTEuMjkzMjEiIHg9IjM2LjY2ODY2IiBzdHJva2U9Im51bGwiIGZpbGw9Im5vbmUiLz4KIDwvZz4KPC9zdmc+'),
|
||||
url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNzAiIGhlaWdodD0iNzAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0ibm9uZSI+CiA8Zz4KICA8dGl0bGU+TGF5ZXIgMTwvdGl0bGU+CiAgPHBhdGggdHJhbnNmb3JtPSJyb3RhdGUoLTg5Ljc2MjQgNy4zMzAxNCA1NS4xMjUyKSIgc3Ryb2tlPSJudWxsIiBpZD0ic3ZnXzEiIGZpbGw9IiNGOEVBRTciIGQ9Im02Mi41NzQ0OSwxMTcuNTIwODZjLTU1LjIyOCwwIC0xMDAsLTQ0Ljc3MiAtMTAwLC0xMDBsMCwxMDBsMTAwLDB6IiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPgogIDxwYXRoIGQ9Im0tMC42Mzc2Niw3LjMxMjI4YzAuMTE5MTksMCAwLjIxNzM3LDAuMDU3OTYgMC40NzY3NiwwLjExOTE5YzAuMjMyLDAuMDU0NzcgMC4yNzMyOSwwLjAzNDkxIDAuMzU3NTcsMC4xMTkxOWMwLjA4NDI4LDAuMDg0MjggMC4zNTc1NywwIDAuNDc2NzYsMGwwLjExOTE5LDBsMC4yMzgzOCwwIiBpZD0ic3ZnXzIiIHN0cm9rZT0ibnVsbCIgZmlsbD0ibm9uZSIvPgogIDxwYXRoIGQ9Im0yOC45MjEzNCw2OS4wNTI0NGMwLDAuMTE5MTkgMCwwLjIzODM4IDAsMC4zNTc1N2wwLDAuMTE5MTlsMCwwLjExOTE5IiBpZD0ic3ZnXzMiIHN0cm9rZT0ibnVsbCIgZmlsbD0ibm9uZSIvPgogIDxyZWN0IGlkPSJzdmdfNCIgaGVpZ2h0PSIwIiB3aWR0aD0iMS4zMTEwOCIgeT0iNi44MzU1MiIgeD0iLTAuMDQxNzEiIHN0cm9rZT0ibnVsbCIgZmlsbD0ibm9uZSIvPgogIDxyZWN0IGlkPSJzdmdfNSIgaGVpZ2h0PSIxLjc4Nzg0IiB3aWR0aD0iMC4xMTkxOSIgeT0iNjguNDU2NSIgeD0iMjguOTIxMzQiIHN0cm9rZT0ibnVsbCIgZmlsbD0ibm9uZSIvPgogIDxyZWN0IGlkPSJzdmdfNiIgaGVpZ2h0PSI0Ljg4Njc3IiB3aWR0aD0iMTkuMDcwMzIiIHk9IjUxLjI5MzIxIiB4PSIzNi42Njg2NiIgc3Ryb2tlPSJudWxsIiBmaWxsPSJub25lIi8+CiA8L2c+Cjwvc3ZnPg=='),
|
||||
url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><rect rx='8' width='100%' height='100%' fill='%23F8EAE7'/></svg>");
|
||||
-webkit-mask-size:
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="layout-view-bg-white flex h100" v-loading="iframeLoading">
|
||||
<div class="layout-view-bg-white flex !h-full" v-loading="iframeLoading">
|
||||
<iframe :src="iframeUrl" frameborder="0" height="100%" width="100%" id="iframe" v-show="!iframeLoading"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -15,6 +15,7 @@ import { i18n } from '@/i18n/index';
|
||||
import 'splitpanes/dist/splitpanes.css';
|
||||
|
||||
import '@/theme/index.scss';
|
||||
import '@/theme/tailwind.css';
|
||||
import '@/assets/font/font.css';
|
||||
import '@/assets/icon/icon.js';
|
||||
import { getThemeConfig } from './common/utils/storage';
|
||||
|
||||
@@ -1,11 +1,5 @@
|
||||
/* 初始化样式
|
||||
------------------------------- */
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
:root {
|
||||
--color-white: #ffffff;
|
||||
@@ -191,45 +185,12 @@ body,
|
||||
}
|
||||
}
|
||||
|
||||
.flex-justify-between {
|
||||
display: flex;
|
||||
align-items: center; // 垂直方向水平居中
|
||||
justify-content: space-between; // 使第一个子元素靠近父容器的起始位置，最后一个子元素靠近终止位置，而其他子元素均匀分布在它们之间
|
||||
}
|
||||
|
||||
.flex-all-center {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.flex-align-center {
|
||||
display: flex;
|
||||
align-items: center; // 垂直方向水平居中
|
||||
}
|
||||
|
||||
/* 宽高 100%
|
||||
------------------------------- */
|
||||
.w100 {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.h100 {
|
||||
height: 100% !important;
|
||||
}
|
||||
|
||||
.vh100 {
|
||||
height: 100vh !important;
|
||||
}
|
||||
|
||||
.max100vh {
|
||||
max-height: 100vh !important;
|
||||
}
|
||||
|
||||
.min100vh {
|
||||
min-height: 100vh !important;
|
||||
}
|
||||
|
||||
/* 颜色值
|
||||
------------------------------- */
|
||||
.color-primary {
|
||||
@@ -252,54 +213,6 @@ body,
|
||||
color: var(--el-color-info);
|
||||
}
|
||||
|
||||
/* 字体大小全局样式
|
||||
------------------------------- */
|
||||
@for $i from 8 through 32 {
|
||||
.font#{$i} {
|
||||
font-size: #{$i}px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* 外边距、内边距全局样式
|
||||
------------------------------- */
|
||||
@for $i from 1 through 35 {
|
||||
.mt#{$i} {
|
||||
margin-top: #{$i}px !important;
|
||||
}
|
||||
|
||||
.mr#{$i} {
|
||||
margin-right: #{$i}px !important;
|
||||
}
|
||||
|
||||
.mb#{$i} {
|
||||
margin-bottom: #{$i}px !important;
|
||||
}
|
||||
|
||||
.ml#{$i} {
|
||||
margin-left: #{$i}px !important;
|
||||
}
|
||||
|
||||
.pt#{$i} {
|
||||
padding-top: #{$i}px !important;
|
||||
}
|
||||
|
||||
.pr#{$i} {
|
||||
padding-right: #{$i}px !important;
|
||||
}
|
||||
|
||||
.pb#{$i} {
|
||||
padding-bottom: #{$i}px !important;
|
||||
}
|
||||
|
||||
.pl#{$i} {
|
||||
padding-left: #{$i}px !important;
|
||||
}
|
||||
|
||||
.pd#{$i} {
|
||||
padding: #{$i}px !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 4px;
|
||||
@@ -376,14 +289,6 @@ body,
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.fl {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.fr {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.search-form {
|
||||
.el-form-item {
|
||||
margin-bottom: 3px;
|
||||
@@ -394,10 +299,6 @@ body,
|
||||
z-index: inherit !important;
|
||||
}
|
||||
|
||||
.pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.pointer-icon {
|
||||
cursor: pointer;
|
||||
transition: color 0.3s;
|
||||
@@ -406,42 +307,4 @@ body,
|
||||
.pointer-icon:hover {
|
||||
color: var(--el-color-primary);
|
||||
/* 鼠标移动到图标时的颜色 */
|
||||
}
|
||||
|
||||
|
||||
/** splitpanes **/
|
||||
.splitpanes.default-theme .splitpanes {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.splitpanes.default-theme .splitpanes__pane {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.default-theme.splitpanes--vertical>.splitpanes__splitter {
|
||||
border-left: 1px solid var(--bg-main-color);
|
||||
}
|
||||
|
||||
.default-theme.splitpanes--horizontal>.splitpanes__splitter {
|
||||
border-top: 1px solid var(--bg-main-color);
|
||||
}
|
||||
|
||||
// 竖线样式
|
||||
.splitpanes.default-theme .splitpanes__splitter::before,
|
||||
.splitpanes.default-theme .splitpanes__splitter::after {
|
||||
background-color: var(--el-color-info-light-5);
|
||||
}
|
||||
|
||||
.splitpanes.default-theme .splitpanes__splitter:hover::before,
|
||||
.splitpanes.default-theme .splitpanes__splitter:hover::after {
|
||||
background-color: var(--el-color-success);
|
||||
}
|
||||
|
||||
.splitpanes.default-theme .splitpanes__splitter {
|
||||
min-width: 6px;
|
||||
background: var(--el-color-info-light-8) !important;
|
||||
}
|
||||
|
||||
.splitpanes.default-theme .splitpanes__splitter:hover {
|
||||
background: var(--el-color-success-light-8) !important;
|
||||
}
|
||||
@@ -52,6 +52,9 @@
|
||||
|
||||
/* NavMenu 导航菜单
|
||||
------------------------------- */
|
||||
$radius: 6px;
|
||||
$menuHeight: 46px !important;
|
||||
|
||||
// 鼠标 hover 时颜色
|
||||
.el-menu-hover-bg-color {
|
||||
background-color: var(--bg-menuBarActiveColor) !important;
|
||||
@@ -64,13 +67,15 @@
|
||||
}
|
||||
|
||||
.el-menu-item {
|
||||
height: 56px !important;
|
||||
line-height: 56px !important;
|
||||
height: $menuHeight;
|
||||
line-height: $menuHeight;
|
||||
border-radius: $radius;
|
||||
}
|
||||
|
||||
.el-menu-item,
|
||||
.el-sub-menu__title {
|
||||
color: var(--bg-menuBarColor);
|
||||
height: $menuHeight;
|
||||
}
|
||||
|
||||
// 修复点击左侧菜单折叠再展开时，宽度不跟随问题
|
||||
@@ -100,20 +105,18 @@
|
||||
.el-sub-menu.is-active .el-sub-menu__title,
|
||||
.el-sub-menu:not(.is-opened):hover .el-sub-menu__title {
|
||||
@extend .el-menu-hover-bg-color;
|
||||
border-radius: $radius;
|
||||
}
|
||||
|
||||
.el-menu-item:hover {
|
||||
@extend .el-menu-hover-bg-color;
|
||||
border-radius: $radius;
|
||||
}
|
||||
|
||||
.el-sub-menu.is-active.is-opened .el-sub-menu__title {
|
||||
background-color: unset !important;
|
||||
}
|
||||
|
||||
// 子级菜单背景颜色
|
||||
// .el-menu--inline {
|
||||
// background: var(--next-bg-menuBar-light-1);
|
||||
// }
|
||||
// 水平菜单、横向菜单折叠 a 标签
|
||||
.el-popper.is-dark a {
|
||||
color: var(--el-color-white) !important;
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
@use './app.scss';
|
||||
@use './base.scss';
|
||||
@use './other.scss';
|
||||
@use './element.scss';
|
||||
@use './media/media.scss';
|
||||
@use './waves.scss';
|
||||
@use './dark.scss';
|
||||
@use './iconSelector.scss';
|
||||
@use './iconSelector.scss';
|
||||
@use './splitpanes.scss';
|
||||
@@ -1,31 +0,0 @@
|
||||
/* wangeditor富文本编辑器
|
||||
------------------------------- */
|
||||
.w-e-toolbar {
|
||||
border: 1px solid #ebeef5 !important;
|
||||
border-bottom: 1px solid #ebeef5 !important;
|
||||
border-top-left-radius: 3px;
|
||||
border-top-right-radius: 3px;
|
||||
z-index: 2 !important;
|
||||
}
|
||||
|
||||
.w-e-text-container {
|
||||
border: 1px solid #ebeef5 !important;
|
||||
border-top: none !important;
|
||||
border-bottom-left-radius: 3px;
|
||||
border-bottom-right-radius: 3px;
|
||||
z-index: 1 !important;
|
||||
}
|
||||
|
||||
/* web端自定义截屏
|
||||
------------------------------- */
|
||||
#screenShotContainer {
|
||||
z-index: 9998 !important;
|
||||
}
|
||||
|
||||
#toolPanel {
|
||||
height: 42px !important;
|
||||
}
|
||||
|
||||
#optionPanel {
|
||||
height: 37px !important;
|
||||
}
|
||||
36
frontend/src/theme/splitpanes.scss
Normal file
36
frontend/src/theme/splitpanes.scss
Normal file
@@ -0,0 +1,36 @@
|
||||
/** splitpanes **/
|
||||
.splitpanes.default-theme .splitpanes {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.splitpanes.default-theme .splitpanes__pane {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.default-theme.splitpanes--vertical>.splitpanes__splitter {
|
||||
border-left: 1px solid var(--bg-main-color);
|
||||
}
|
||||
|
||||
.default-theme.splitpanes--horizontal>.splitpanes__splitter {
|
||||
border-top: 1px solid var(--bg-main-color);
|
||||
}
|
||||
|
||||
// 竖线样式
|
||||
.splitpanes.default-theme .splitpanes__splitter::before,
|
||||
.splitpanes.default-theme .splitpanes__splitter::after {
|
||||
background-color: var(--el-color-info-light-5);
|
||||
}
|
||||
|
||||
.splitpanes.default-theme .splitpanes__splitter:hover::before,
|
||||
.splitpanes.default-theme .splitpanes__splitter:hover::after {
|
||||
background-color: var(--el-color-success);
|
||||
}
|
||||
|
||||
.splitpanes.default-theme .splitpanes__splitter {
|
||||
min-width: 6px;
|
||||
background: var(--el-color-info-light-8) !important;
|
||||
}
|
||||
|
||||
.splitpanes.default-theme .splitpanes__splitter:hover {
|
||||
background: var(--el-color-success-light-8) !important;
|
||||
}
|
||||
2
frontend/src/theme/tailwind.css
Normal file
2
frontend/src/theme/tailwind.css
Normal file
@@ -0,0 +1,2 @@
|
||||
|
||||
@import "tailwindcss";
|
||||
@@ -45,9 +45,9 @@
|
||||
<el-table-column prop="name" min-width="100px">
|
||||
<template #header>
|
||||
<el-button class="ml0" type="primary" circle size="small" icon="Plus" @click="addTask()"> </el-button>
|
||||
<span class="ml10">{{ $t('flow.nodeName') }}<span class="ml5" style="color: red">*</span></span>
|
||||
<span class="ml-2">{{ $t('flow.nodeName') }}<span class="ml-1" style="color: red">*</span></span>
|
||||
<el-tooltip :content="$t('flow.nodeNameTips')" placement="top">
|
||||
<SvgIcon class="ml5" name="question-filled" />
|
||||
<SvgIcon class="ml-1" name="question-filled" />
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
@@ -57,7 +57,7 @@
|
||||
|
||||
<el-table-column prop="userId" min-width="150px" show-overflow-tooltip>
|
||||
<template #header>
|
||||
<span class="ml10">{{ $t('flow.auditor') }}<span class="ml5" style="color: red">*</span></span>
|
||||
<span class="ml-2">{{ $t('flow.auditor') }}<span class="ml-1" style="color: red">*</span></span>
|
||||
</template>
|
||||
|
||||
<template #default="scope">
|
||||
@@ -67,7 +67,7 @@
|
||||
|
||||
<el-table-column :label="$t('common.operation')" width="110px">
|
||||
<template #default="scope">
|
||||
<el-link @click="deleteTask(scope.$index)" class="ml5" type="danger" icon="delete" plain></el-link>
|
||||
<el-link @click="deleteTask(scope.$index)" class="ml-1" type="danger" icon="delete" plain></el-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="procdefApi.list"
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="procinstApi.list"
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="procinstApi.tasks"
|
||||
|
||||
@@ -11,7 +11,7 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="sql" label="SQL" required>
|
||||
<div class="w100">
|
||||
<div class="!w-full">
|
||||
<monaco-editor height="300px" language="sql" v-model="bizForm.sql" />
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<div class="personal-user">
|
||||
<div class="personal-user-left">
|
||||
<el-upload
|
||||
class="h100 personal-user-left-upload"
|
||||
class="!h-full personal-user-left-upload"
|
||||
:action="getUploadFileUrl(`avatar_${userInfo.username}`)"
|
||||
:limit="1"
|
||||
:show-file-list="false"
|
||||
@@ -20,16 +20,16 @@
|
||||
</div>
|
||||
<div class="personal-user-right">
|
||||
<el-row>
|
||||
<el-col :span="24" class="personal-title mb18">
|
||||
<el-col :span="24" class="personal-title mb-4">
|
||||
{{ $t('home.welcomeMsg', { name: userInfo.name }) }}
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row>
|
||||
<el-col :xs="24" :sm="12" class="personal-item mb6">
|
||||
<el-col :xs="24" :sm="12" class="personal-item !mb-1.5">
|
||||
<div class="personal-item-label">{{ $t('common.username') }}：</div>
|
||||
<div class="personal-item-value">{{ userInfo.username }}</div>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" class="personal-item mb6">
|
||||
<el-col :xs="24" :sm="12" class="personal-item !mb-1.5">
|
||||
<div class="personal-item-label">{{ $t('common.role') }}：</div>
|
||||
<div class="personal-item-value">{{ roleInfo }}</div>
|
||||
</el-col>
|
||||
@@ -37,11 +37,11 @@
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row>
|
||||
<el-col :xs="24" :sm="12" class="personal-item mb6">
|
||||
<el-col :xs="24" :sm="12" class="personal-item !mb-1.5">
|
||||
<div class="personal-item-label">{{ $t('home.lastLoginIp') }}：</div>
|
||||
<div class="personal-item-value">{{ userInfo.lastLoginIp }}</div>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" class="personal-item mb6">
|
||||
<el-col :xs="24" :sm="12" class="personal-item !mb-1.5">
|
||||
<div class="personal-item-label">{{ $t('home.lastLoginTime') }}：</div>
|
||||
<div class="personal-item-value">{{ formatDate(userInfo.lastLoginTime) }}</div>
|
||||
</el-col>
|
||||
@@ -71,14 +71,14 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20" class="mt20 resource-info">
|
||||
<el-row :gutter="20" class="!mt-4 resource-info">
|
||||
<el-col :sm="12">
|
||||
<el-card shadow="hover">
|
||||
<template #header>
|
||||
<el-row justify="center">
|
||||
<div class="resource-num pointer-icon" @click="toPage('machine')">
|
||||
<SvgIcon
|
||||
class="mb5 mr5"
|
||||
class="mb-1 mr-1"
|
||||
:size="28"
|
||||
:name="TagResourceTypeEnum.Machine.extra.icon"
|
||||
:color="TagResourceTypeEnum.Machine.extra.iconColor"
|
||||
@@ -123,7 +123,7 @@
|
||||
<el-row justify="center">
|
||||
<div class="resource-num pointer-icon" @click="toPage('db')">
|
||||
<SvgIcon
|
||||
class="mb5 mr5"
|
||||
class="mb-1 mr-1"
|
||||
:size="28"
|
||||
:name="TagResourceTypeEnum.DbInstance.extra.icon"
|
||||
:color="TagResourceTypeEnum.DbInstance.extra.iconColor"
|
||||
@@ -157,14 +157,14 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20" class="mt20 resource-info">
|
||||
<el-row :gutter="20" class="!mt-4 resource-info">
|
||||
<el-col :sm="12">
|
||||
<el-card shadow="hover">
|
||||
<template #header>
|
||||
<el-row justify="center">
|
||||
<div class="resource-num pointer-icon" @click="toPage('redis')">
|
||||
<SvgIcon
|
||||
class="mb5 mr5"
|
||||
class="mb-1 mr-1"
|
||||
:size="28"
|
||||
:name="TagResourceTypeEnum.Redis.extra.icon"
|
||||
:color="TagResourceTypeEnum.Redis.extra.iconColor"
|
||||
@@ -203,7 +203,7 @@
|
||||
<el-row justify="center">
|
||||
<div class="resource-num pointer-icon" @click="toPage('mongo')">
|
||||
<SvgIcon
|
||||
class="mb5 mr5"
|
||||
class="mb-1 mr-1"
|
||||
:size="28"
|
||||
:name="TagResourceTypeEnum.Mongo.extra.icon"
|
||||
:color="TagResourceTypeEnum.Mongo.extra.iconColor"
|
||||
@@ -251,7 +251,7 @@
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row type="flex" class="mt5" justify="center">
|
||||
<el-row type="flex" class="mt-1" justify="center">
|
||||
<el-pagination
|
||||
small
|
||||
@current-change="searchMsg"
|
||||
|
||||
@@ -35,7 +35,7 @@
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="login-content-code">
|
||||
<img class="login-content-code-img" @click="getCaptcha" width="130px" height="40px" :src="captchaImage" style="cursor: pointer" />
|
||||
<img class="login-content-code-img cursor-pointer" @click="getCaptcha" width="130px" height="40px" :src="captchaImage" />
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
@@ -63,7 +63,7 @@
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
<div class="mt20" v-if="state.oauth2LoginConfig.enable">
|
||||
<div class="!mt-4" v-if="state.oauth2LoginConfig.enable">
|
||||
<el-text size="small">{{ $t('login.thirdPartyLogin') }}: </el-text>
|
||||
<el-tooltip :content="state.oauth2LoginConfig.name" placement="bottom-start">
|
||||
<el-button link size="small" type="primary" @click="oauth2Login">
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="channelApi.list"
|
||||
|
||||
@@ -40,7 +40,7 @@
|
||||
|
||||
<FormItemTooltip prop="tmpl" :label="$t('msg.tmpl')" :tooltip="$t('msg.msgTmplTooltip')">
|
||||
<MonacoEditor
|
||||
class="w100"
|
||||
class="!w-full"
|
||||
height="200px"
|
||||
v-model="formData.tmpl"
|
||||
:language="EnumValue.getLabelByValue(TmplTypeEnum, formData.msgType)"
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="tmplApi.list"
|
||||
|
||||
@@ -73,7 +73,7 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-if="form.ciphertextType == AuthCertCiphertextTypeEnum.PrivateKey.value" prop="ciphertext" :label="$t('ac.privateKey')">
|
||||
<div class="w100" style="position: relative">
|
||||
<div class="!w-full" style="position: relative">
|
||||
<SvgIcon
|
||||
v-if="form.id"
|
||||
v-auth="'authcert:showciphertext'"
|
||||
|
||||
@@ -7,13 +7,13 @@
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-button v-auth="'authcert:save'" @click="edit(scope.row, scope.$index)" type="primary" icon="edit" link></el-button>
|
||||
<el-button class="ml1" v-auth="'authcert:del'" type="danger" @click="deleteRow(scope.$index)" icon="delete" link></el-button>
|
||||
<el-button class="ml-0.5" v-auth="'authcert:del'" type="danger" @click="deleteRow(scope.$index)" icon="delete" link></el-button>
|
||||
|
||||
<el-button
|
||||
:title="$t('ac.testConn')"
|
||||
:loading="props.testConnBtnLoading && scope.$index == state.idx"
|
||||
:disabled="props.testConnBtnLoading"
|
||||
class="ml1"
|
||||
class="ml-0.5"
|
||||
type="success"
|
||||
@click="testConn(scope.row, scope.$index)"
|
||||
icon="Link"
|
||||
|
||||
@@ -2,17 +2,17 @@
|
||||
<div v-if="props.tags">
|
||||
<el-row v-for="(tag, idx) in props.tags?.slice(0, 1)" :key="idx">
|
||||
<TagInfo :tag-path="tag.codePath" />
|
||||
<span class="ml3">{{ tag.codePath }}</span>
|
||||
<span class="ml-0.5">{{ tag.codePath }}</span>
|
||||
|
||||
<!-- 展示剩余的标签信息 -->
|
||||
<el-popover :show-after="300" v-if="props.tags.length > 1 && idx == 0" placement="top-start" width="230" trigger="hover">
|
||||
<template #reference>
|
||||
<SvgIcon class="mt5 ml5" color="var(--el-color-primary)" name="MoreFilled" />
|
||||
<SvgIcon class="mt-1 ml-1" color="var(--el-color-primary)" name="MoreFilled" />
|
||||
</template>
|
||||
|
||||
<el-row v-for="i in props.tags.slice(1)" :key="i">
|
||||
<TagInfo :tag-path="i.codePath" />
|
||||
<span class="ml3">{{ i.codePath }}</span>
|
||||
<span class="ml-0.5">{{ i.codePath }}</span>
|
||||
</el-row>
|
||||
</el-popover>
|
||||
</el-row>
|
||||
|
||||
@@ -5,16 +5,16 @@
|
||||
<SvgIcon
|
||||
:name="EnumValue.getEnumByValue(TagResourceTypeEnum, item.type)?.extra.icon"
|
||||
:color="EnumValue.getEnumByValue(TagResourceTypeEnum, item.type)?.extra.iconColor"
|
||||
class="mr2"
|
||||
class="mr-0.5"
|
||||
/>
|
||||
<span> {{ item.name ? item.name : item.code }}</span>
|
||||
<SvgIcon v-if="!item.isEnd" class="mr5 ml5" name="arrow-right" />
|
||||
<SvgIcon v-if="!item.isEnd" class="mr-1 ml-1" name="arrow-right" />
|
||||
</span>
|
||||
|
||||
<!-- 展示剩余的标签信息 -->
|
||||
<el-popover :show-after="300" v-if="paths.length > 1 && idx == 0" placement="bottom" width="500" trigger="hover">
|
||||
<template #reference>
|
||||
<SvgIcon class="mt5 ml5" color="var(--el-color-primary)" name="MoreFilled" />
|
||||
<SvgIcon class="mt-1 ml-1" color="var(--el-color-primary)" name="MoreFilled" />
|
||||
</template>
|
||||
|
||||
<el-row v-for="i in paths.slice(1)" :key="i">
|
||||
@@ -22,10 +22,10 @@
|
||||
<SvgIcon
|
||||
:name="EnumValue.getEnumByValue(TagResourceTypeEnum, item.type)?.extra.icon"
|
||||
:color="EnumValue.getEnumByValue(TagResourceTypeEnum, item.type)?.extra.iconColor"
|
||||
class="mr2"
|
||||
class="mr-0.5"
|
||||
/>
|
||||
<span> {{ item.name ? item.name : item.code }}</span>
|
||||
<SvgIcon v-if="!item.isEnd" class="mr5 ml5" name="arrow-right" />
|
||||
<SvgIcon v-if="!item.isEnd" class="mr-1 ml-1" name="arrow-right" />
|
||||
</span>
|
||||
</el-row>
|
||||
</el-popover>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="card pd5">
|
||||
<el-input v-model="filterText" :placeholder="$t('tag.tagFilterPlaceholder')" clearable size="small" class="mb5 w100" />
|
||||
<div class="card !p-1">
|
||||
<el-input v-model="filterText" :placeholder="$t('tag.tagFilterPlaceholder')" clearable size="small" class="!mb-1 w-full" />
|
||||
<el-scrollbar class="tag-tree">
|
||||
<el-tree
|
||||
ref="treeRef"
|
||||
@@ -30,7 +30,7 @@
|
||||
|
||||
<slot v-else :node="node" :data="data" name="prefix"></slot>
|
||||
|
||||
<span class="ml3" :title="data.labelRemark">
|
||||
<span class="ml-0.5" :title="data.labelRemark">
|
||||
<slot name="label" :data="data" v-if="!data.disabled"> {{ $t(data.label) }}</slot>
|
||||
<!-- 禁用状态 -->
|
||||
<slot name="disabledLabel" :data="data" v-else>
|
||||
@@ -242,7 +242,7 @@ defineExpose({
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.tag-tree {
|
||||
height: calc(100vh - 148px);
|
||||
height: calc(100vh - 143px);
|
||||
|
||||
.el-tree {
|
||||
display: inline-block;
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="w100 tag-tree-check">
|
||||
<div class="!w-full tag-tree-check">
|
||||
<el-input v-model="filterTag" @input="onFilterValChanged" clearable :placeholder="$t('tag.keywordFilterPlaceholder')" size="small" />
|
||||
<div class="mt3" style="border: 1px solid var(--el-border-color)">
|
||||
<div class="mt-0.5" style="border: 1px solid var(--el-border-color)">
|
||||
<el-scrollbar :style="{ height: props.height }">
|
||||
<el-tree
|
||||
v-bind="$attrs"
|
||||
@@ -30,7 +30,7 @@
|
||||
:color="EnumValue.getEnumByValue(TagResourceTypeEnum, data.type)?.extra.iconColor"
|
||||
/>
|
||||
|
||||
<span class="font13 ml5">
|
||||
<span class="!text-[13px] ml-1">
|
||||
{{ data.name }}
|
||||
<span style="color: #3c8dbc">【</span>
|
||||
{{ data.code }}
|
||||
|
||||
@@ -25,7 +25,7 @@
|
||||
|
||||
<slot v-else :node="node" :data="data" name="prefix"></slot>
|
||||
|
||||
<span class="ml3" :title="data.labelRemark">
|
||||
<span class="ml-0.5" :title="data.labelRemark">
|
||||
<slot name="label" :data="data"> {{ data.label }}</slot>
|
||||
</span>
|
||||
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
>
|
||||
<template #default="{ data }">
|
||||
<span class="custom-tree-node">
|
||||
<SvgIcon :name="EnumValue.getEnumByValue(TagResourceTypeEnum, data.type)?.extra.icon" class="mr2" />
|
||||
<SvgIcon :name="EnumValue.getEnumByValue(TagResourceTypeEnum, data.type)?.extra.icon" class="mr-0.5" />
|
||||
<span style="font-size: 13px">
|
||||
{{ data.code }}
|
||||
<span style="color: #3c8dbc">【</span>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="db-list">
|
||||
<div class="db-list h-full">
|
||||
<el-drawer
|
||||
:title="title"
|
||||
v-model="dialogVisible"
|
||||
@@ -12,7 +12,7 @@
|
||||
<template #header>
|
||||
<DrawerHeader :header="title" :back="cancel">
|
||||
<template #extra>
|
||||
<div class="mr20">
|
||||
<div class="mr-4.5">
|
||||
<span>{{ $props.instance?.tags?.[0]?.codePath }}</span>
|
||||
<el-divider direction="vertical" border-style="dashed" />
|
||||
<SvgIcon :name="getDbDialect($props.instance?.type).getInfo()?.icon" :size="20" />
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
placeholder="数据库名称"
|
||||
filterable
|
||||
clearable
|
||||
class="w100"
|
||||
class="!w-full"
|
||||
>
|
||||
<el-option v-for="item in props.dbNames" :key="item" :label="`${item}`" :value="item"> </el-option>
|
||||
</el-select>
|
||||
@@ -33,7 +33,7 @@
|
||||
placeholder="数据库备份"
|
||||
filterable
|
||||
clearable
|
||||
class="w100"
|
||||
class="!w-full"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in state.histories"
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-row class="w100">
|
||||
<el-row class="!w-full">
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="status" :label="$t('common.status')">
|
||||
<el-switch
|
||||
@@ -42,7 +42,7 @@
|
||||
<CrontabInput v-model="form.cron" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="srcDbId" :label="$t('db.srcDb')" class="w100" required>
|
||||
<el-form-item prop="srcDbId" :label="$t('db.srcDb')" class="!w-full" required>
|
||||
<db-select-tree
|
||||
v-model:db-id="form.srcDbId"
|
||||
v-model:inst-name="form.srcInstName"
|
||||
@@ -61,7 +61,7 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-if="form.mode === 2">
|
||||
<el-row class="w100">
|
||||
<el-row class="!w-full">
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="targetFileDbType" :label="$t('db.dbFileType')" :required="form.mode === 2">
|
||||
<el-select v-model="form.targetFileDbType" clearable filterable>
|
||||
@@ -100,7 +100,7 @@
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-if="form.mode == 1" prop="targetDbId" :label="$t('db.targetDb')" class="w100" :required="form.mode === 1">
|
||||
<el-form-item v-if="form.mode == 1" prop="targetDbId" :label="$t('db.targetDb')" class="!w-full" :required="form.mode === 1">
|
||||
<db-select-tree
|
||||
v-model:db-id="form.targetDbId"
|
||||
v-model:inst-name="form.targetInstName"
|
||||
@@ -123,10 +123,10 @@
|
||||
<el-form-item>
|
||||
<el-input v-model="state.filterSrcTableText" placeholder="filter table" size="small" />
|
||||
</el-form-item>
|
||||
<el-form-item class="w100">
|
||||
<el-form-item class="!w-full">
|
||||
<el-tree
|
||||
ref="srcTreeRef"
|
||||
class="w100"
|
||||
class="!w-full"
|
||||
style="max-height: 200px; overflow-y: auto"
|
||||
default-expand-all
|
||||
:expand-on-click-node="false"
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="db-list">
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="dbApi.dbTransferTasks"
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="db-list">
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="dbApi.instances"
|
||||
|
||||
@@ -54,7 +54,7 @@
|
||||
</template>
|
||||
|
||||
<template #right>
|
||||
<div class="card db-op pd5">
|
||||
<div class="card db-op !p-1">
|
||||
<el-row>
|
||||
<el-col :span="24" v-if="state.db">
|
||||
<el-descriptions :column="4" size="small" border>
|
||||
@@ -145,7 +145,7 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div id="data-exec" class="mt5">
|
||||
<div id="data-exec" class="mt-1">
|
||||
<el-tabs
|
||||
v-if="state.tabs.size > 0"
|
||||
type="card"
|
||||
@@ -153,13 +153,13 @@
|
||||
@tab-change="onTabChange"
|
||||
style="width: 100%"
|
||||
v-model="state.activeName"
|
||||
class="h100"
|
||||
class="!h-full"
|
||||
>
|
||||
<el-tab-pane class="h100" closable v-for="dt in state.tabs.values()" :label="dt.label" :name="dt.key" :key="dt.key">
|
||||
<el-tab-pane class="!h-full" closable v-for="dt in state.tabs.values()" :label="dt.label" :name="dt.key" :key="dt.key">
|
||||
<template #label>
|
||||
<el-popover :show-after="1000" placement="bottom-start" trigger="hover" :width="250">
|
||||
<template #reference>
|
||||
<span @contextmenu.prevent="onTabContextmenu(dt, $event)" class="font12">{{ dt.label }}</span>
|
||||
<span @contextmenu.prevent="onTabContextmenu(dt, $event)" class="!text-[12px]">{{ dt.label }}</span>
|
||||
</template>
|
||||
<template #default>
|
||||
<el-descriptions :column="1" size="small">
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="db-list">
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="dbApi.datasyncTasks"
|
||||
|
||||
@@ -2,9 +2,9 @@
|
||||
<div class="sync-task-logs">
|
||||
<el-dialog v-model="dialogVisible" :before-close="cancel" :destroy-on-close="false" width="1120px">
|
||||
<template #header>
|
||||
<span class="mr10">{{ $t('db.log') }}</span>
|
||||
<span class="mr-2">{{ $t('db.log') }}</span>
|
||||
<el-switch v-model="realTime" @change="watchPolling" inline-prompt :active-text="$t('db.realTime')" :inactive-text="$t('db.noRealTime')" />
|
||||
<el-button @click="search" icon="Refresh" circle size="small" :loading="realTime" class="ml10"></el-button>
|
||||
<el-button @click="search" icon="Refresh" circle size="small" :loading="realTime" class="ml-2"></el-button>
|
||||
</template>
|
||||
<page-table ref="logTableRef" :page-api="dbApi.datasyncLogs" v-model:query-form="query" :tool-button="false" :columns="columns" size="small">
|
||||
</page-table>
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<div>
|
||||
<div>
|
||||
<div class="card pd5 flex-justify-between">
|
||||
<div class="card !p-1 flex items-center justify-between">
|
||||
<div>
|
||||
<el-link @click="onRunSql()" :underline="false" class="ml15" icon="VideoPlay"> </el-link>
|
||||
<el-link @click="onRunSql()" :underline="false" class="ml-3.5" icon="VideoPlay"> </el-link>
|
||||
<el-divider direction="vertical" border-style="dashed" />
|
||||
|
||||
<el-tooltip :show-after="1000" class="box-item" effect="dark" content="format sql" placement="top">
|
||||
@@ -47,24 +47,30 @@
|
||||
style="height: calc(100vh - 233px)"
|
||||
>
|
||||
<Pane :size="state.editorSize" max-size="80">
|
||||
<MonacoEditor ref="monacoEditorRef" class="mt5" v-model="state.sql" language="sql" height="100%" :id="'MonacoTextarea-' + getKey()" />
|
||||
<MonacoEditor ref="monacoEditorRef" class="mt-1" v-model="state.sql" language="sql" height="100%" :id="'MonacoTextarea-' + getKey()" />
|
||||
</Pane>
|
||||
|
||||
<Pane :size="100 - state.editorSize">
|
||||
<div class="mt5 sql-exec-res h100">
|
||||
<el-tabs class="h100 w100" v-if="state.execResTabs.length > 0" @tab-remove="onRemoveTab" @tab-change="active" v-model="state.activeTab">
|
||||
<el-tab-pane class="h100" closable v-for="dt in state.execResTabs" :label="dt.id" :name="dt.id" :key="dt.id">
|
||||
<div class="mt-1 sql-exec-res !h-full">
|
||||
<el-tabs
|
||||
class="!h-full !w-full"
|
||||
v-if="state.execResTabs.length > 0"
|
||||
@tab-remove="onRemoveTab"
|
||||
@tab-change="active"
|
||||
v-model="state.activeTab"
|
||||
>
|
||||
<el-tab-pane class="!h-full" closable v-for="dt in state.execResTabs" :label="dt.id" :name="dt.id" :key="dt.id">
|
||||
<template #label>
|
||||
<el-popover :show-after="1000" placement="top-start" :title="$t('db.execInfo')" trigger="hover" :width="300">
|
||||
<template #reference>
|
||||
<div>
|
||||
<span>
|
||||
<span v-if="dt.loading">
|
||||
<SvgIcon class="mb2 is-loading" name="Loading" color="var(--el-color-primary)" />
|
||||
<SvgIcon class="!mb-0.5 is-loading" name="Loading" color="var(--el-color-primary)" />
|
||||
</span>
|
||||
<span v-else>
|
||||
<SvgIcon class="mb2" v-if="!dt.errorMsg" name="CircleCheck" color="var(--el-color-success)" />
|
||||
<SvgIcon class="mb2" v-if="dt.errorMsg" name="CircleClose" color="var(--el-color-error)" />
|
||||
<SvgIcon class="!mb-0.5" v-if="!dt.errorMsg" name="CircleCheck" color="var(--el-color-success)" />
|
||||
<SvgIcon class="!mb-0.5" v-if="dt.errorMsg" name="CircleClose" color="var(--el-color-error)" />
|
||||
</span>
|
||||
</span>
|
||||
|
||||
@@ -88,7 +94,7 @@
|
||||
</template>
|
||||
|
||||
<el-row>
|
||||
<span v-if="dt.hasUpdatedFileds" class="mt5">
|
||||
<span v-if="dt.hasUpdatedFileds" class="mt-1">
|
||||
<span>
|
||||
<el-link type="success" :underline="false" @click="submitUpdateFields(dt)"
|
||||
><span style="font-size: 12px">{{ $t('common.submit') }}</span></el-link
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<div>
|
||||
<el-dialog title="SQL" v-model="dialogVisible" :show-close="false" width="600px" :close-on-click-modal="false">
|
||||
<monaco-editor height="300px" class="codesql" language="sql" v-model="sqlValue" />
|
||||
<el-input @keyup.enter="runSql" ref="remarkInputRef" v-model="remark" :placeholder="i18n.global.t('common.remark')" class="mt5" />
|
||||
<el-input @keyup.enter="runSql" ref="remarkInputRef" v-model="remark" :placeholder="i18n.global.t('common.remark')" class="mt-1" />
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="string-input-container w100" v-if="dataType == DataType.String || dataType == DataType.Number">
|
||||
<div class="string-input-container !w-full" v-if="dataType == DataType.String || dataType == DataType.Number">
|
||||
<el-input
|
||||
:ref="
|
||||
(el: any) => {
|
||||
@@ -10,7 +10,7 @@
|
||||
"
|
||||
:disabled="disabled"
|
||||
@blur="handleBlur"
|
||||
:class="`w100 mb4 ${showEditorIcon ? 'string-input-container-show-icon' : ''}`"
|
||||
:class="`!w-full !mb-1 ${showEditorIcon ? 'string-input-container-show-icon' : ''}`"
|
||||
size="small"
|
||||
v-model="itemValue"
|
||||
:placeholder="placeholder ?? $t('common.pleaseInput')"
|
||||
@@ -30,7 +30,7 @@
|
||||
:disabled="disabled"
|
||||
@change="handleBlur"
|
||||
@blur="handleBlur"
|
||||
class="edit-time-picker mb4"
|
||||
class="edit-time-picker !mb-1"
|
||||
popper-class="edit-time-picker-popper"
|
||||
size="small"
|
||||
v-model="itemValue"
|
||||
@@ -52,7 +52,7 @@
|
||||
:disabled="disabled"
|
||||
@change="handleBlur"
|
||||
@blur="handleBlur"
|
||||
class="edit-time-picker mb4"
|
||||
class="edit-time-picker !mb-1"
|
||||
popper-class="edit-time-picker-popper"
|
||||
size="small"
|
||||
v-model="itemValue"
|
||||
@@ -74,7 +74,7 @@
|
||||
:disabled="disabled"
|
||||
@change="handleBlur"
|
||||
@blur="handleBlur"
|
||||
class="edit-time-picker mb4"
|
||||
class="edit-time-picker !mb-1"
|
||||
popper-class="edit-time-picker-popper"
|
||||
size="small"
|
||||
v-model="itemValue"
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="db-table-data mt5" :style="{ height: tableHeight }">
|
||||
<div class="db-table-data mt-1" :style="{ height: tableHeight }">
|
||||
<el-auto-resizer>
|
||||
<template #default="{ height, width }">
|
||||
<el-table-v2
|
||||
@@ -39,12 +39,12 @@
|
||||
<span v-if="column.dataTypeSubscript === 'icon-clock'">
|
||||
<SvgIcon :size="9" name="Clock" style="cursor: unset" />
|
||||
</span>
|
||||
<span class="font8" v-else>{{ column.dataTypeSubscript }}</span>
|
||||
<span class="!text-[8px]" v-else>{{ column.dataTypeSubscript }}</span>
|
||||
</div>
|
||||
|
||||
<div v-if="showColumnTip">
|
||||
<div class="header-column-title">
|
||||
<b :title="column.remark" class="el-text" style="cursor: pointer">
|
||||
<b :title="column.remark" class="el-text cursor-pointer">
|
||||
{{ column.title }}
|
||||
</b>
|
||||
</div>
|
||||
@@ -53,7 +53,7 @@
|
||||
<span
|
||||
v-if="dbConfig.showColumnComment"
|
||||
style="color: var(--el-color-info-light-3)"
|
||||
class="font10 el-text el-text--small is-truncated"
|
||||
class="!text-[10px] el-text el-text--small is-truncated"
|
||||
>
|
||||
{{ column.columnComment }}
|
||||
</span>
|
||||
@@ -95,7 +95,7 @@
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div v-else :class="isUpdated(rowIndex, column.dataKey) ? 'update_field_active ml2 mr2' : 'ml2 mr2'">
|
||||
<div v-else :class="isUpdated(rowIndex, column.dataKey) ? 'update_field_active ml-0.5 mr-0.5' : 'ml-0.5 mr-0.5'">
|
||||
<span v-if="rowData[column.dataKey!] === null" style="color: var(--el-color-info-light-5)"> NULL </span>
|
||||
|
||||
<span v-else :title="rowData[column.dataKey!]" class="el-text el-text--small is-truncated">
|
||||
@@ -110,9 +110,9 @@
|
||||
<div class="el-loading-mask" style="display: flex; flex-direction: column; align-items: center; justify-content: center">
|
||||
<div>
|
||||
<SvgIcon class="is-loading" name="loading" color="var(--el-color-primary)" :size="28" />
|
||||
<el-text class="ml5" tag="b">{{ $t('db.execTime') }} - {{ state.execTime.toFixed(1) }}s</el-text>
|
||||
<el-text class="ml-1" tag="b">{{ $t('db.execTime') }} - {{ state.execTime.toFixed(1) }}s</el-text>
|
||||
</div>
|
||||
<div v-if="loading && abortFn" class="mt10">
|
||||
<div v-if="loading && abortFn" class="!mt-2">
|
||||
<el-button @click="cancelLoading" type="info" size="small" plain>{{ $t('common.cancel') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -129,7 +129,7 @@
|
||||
|
||||
<el-dialog @close="state.genTxtDialog.visible = false" v-model="state.genTxtDialog.visible" :title="state.genTxtDialog.title" width="1000px">
|
||||
<template #header>
|
||||
<div class="mr15" style="display: flex; justify-content: flex-end">
|
||||
<div class="mr-2" style="display: flex; justify-content: flex-end">
|
||||
<el-button id="copyValue" @click="copyGenTxt(state.genTxtDialog.txt)" icon="CopyDocument" type="success" size="small">
|
||||
{{ $t('db.oneClickCopy') }}
|
||||
</el-button>
|
||||
|
||||
@@ -4,12 +4,12 @@
|
||||
<el-form-item
|
||||
v-for="column in columns"
|
||||
:key="column.columnName"
|
||||
class="w100 mb5"
|
||||
class="mb-1 w-full"
|
||||
:prop="column.columnName"
|
||||
:required="props.tableName != '' && !column.nullable && !column.isPrimaryKey && !column.autoIncrement"
|
||||
>
|
||||
<template #label>
|
||||
<span class="pointer" :title="column?.columnComment ? `${column.columnType} | ${column.columnComment}` : column.columnType">
|
||||
<span class="cursor-pointer" :title="column?.columnComment ? `${column.columnType} | ${column.columnComment}` : column.columnType">
|
||||
{{ column.columnName }}
|
||||
</span>
|
||||
</template>
|
||||
|
||||
@@ -2,8 +2,8 @@
|
||||
<div>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<div class="mt5">
|
||||
<el-link :disabled="state.loading" @click="onRefresh()" icon="refresh" :underline="false" class="ml5"> </el-link>
|
||||
<div class="mt-1">
|
||||
<el-link :disabled="state.loading" @click="onRefresh()" icon="refresh" :underline="false" class="ml-1"> </el-link>
|
||||
<el-divider direction="vertical" border-style="dashed" />
|
||||
|
||||
<el-popover
|
||||
@@ -51,11 +51,11 @@
|
||||
<el-divider direction="vertical" border-style="dashed" />
|
||||
|
||||
<el-tooltip :show-after="500" v-if="hasUpdatedFileds" :content="$t('db.submitUpdate')" placement="top">
|
||||
<el-link @click="submitUpdateFields()" type="success" :underline="false" class="font12">{{ $t('common.submit') }}</el-link>
|
||||
<el-link @click="submitUpdateFields()" type="success" :underline="false" class="!text-[12px]">{{ $t('common.submit') }}</el-link>
|
||||
</el-tooltip>
|
||||
<el-divider v-if="hasUpdatedFileds" direction="vertical" border-style="dashed" />
|
||||
<el-tooltip :show-after="500" v-if="hasUpdatedFileds" :content="$t('db.cancelUpdate')" placement="top">
|
||||
<el-link @click="cancelUpdateFields" type="warning" :underline="false" class="font12">{{ $t('common.cancel') }}</el-link>
|
||||
<el-link @click="cancelUpdateFields" type="warning" :underline="false" class="!text-[12px]">{{ $t('common.cancel') }}</el-link>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</el-col>
|
||||
@@ -70,7 +70,7 @@
|
||||
@clear="selectData"
|
||||
size="small"
|
||||
clearable
|
||||
class="w100"
|
||||
class="!w-full"
|
||||
highlight-first-item
|
||||
value-key="columnName"
|
||||
ref="condInputRef"
|
||||
@@ -110,7 +110,7 @@
|
||||
onConditionRowClick(event);
|
||||
}
|
||||
"
|
||||
style="cursor: pointer"
|
||||
class="cursor-pointer"
|
||||
>
|
||||
<el-table-column property="columnName" :label="$t('db.columnName')" show-overflow-tooltip>
|
||||
<template #header>
|
||||
@@ -147,12 +147,12 @@
|
||||
@data-delete="onRefresh"
|
||||
></db-table-data>
|
||||
|
||||
<el-row type="flex" class="mt5" :gutter="10" justify="space-between" style="user-select: none">
|
||||
<el-row type="flex" class="mt-2" :gutter="10" justify="space-between" style="user-select: none">
|
||||
<el-col :span="12">
|
||||
<el-text
|
||||
id="copyValue"
|
||||
style="color: var(--el-color-info-light-3)"
|
||||
class="is-truncated font12 mt5"
|
||||
class="is-truncated !text-[12px] mt-1"
|
||||
@click="copyToClipboard(sql)"
|
||||
:title="sql"
|
||||
>{{ sql }}</el-text
|
||||
@@ -182,7 +182,7 @@
|
||||
</div>
|
||||
<el-link class="op-page" :underline="false" @click="++pageNum" :disabled="datas.length < pageSize" icon="Right" />
|
||||
<el-link class="op-page" :underline="false" @click="handleEndPage" :disabled="datas.length < pageSize" icon="DArrowRight" />
|
||||
<div style="width: 90px" class="op-page ml10">
|
||||
<div style="width: 90px" class="op-page ml-2">
|
||||
<el-select size="small" :default-first-option="true" v-model="pageSize" @change="handleSizeChange">
|
||||
<el-option
|
||||
style="font-size: 12px; height: 24px; line-height: 24px"
|
||||
@@ -194,7 +194,7 @@
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<el-button @click="handleCount" :loading="state.counting" class="ml10" text bg size="small">
|
||||
<el-button @click="handleCount" :loading="state.counting" class="ml-2" text bg size="small">
|
||||
{{ state.showTotal ? `${state.total} ${$t('db.rows')}` : 'count' }}
|
||||
</el-button>
|
||||
</el-row>
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<div class="db-table">
|
||||
<el-row class="mb5">
|
||||
<el-row class="mb-1">
|
||||
<el-popover v-model:visible="state.dumpInfo.visible" trigger="click" :width="470" placement="right">
|
||||
<template #reference>
|
||||
<el-button :disabled="state.dumpInfo.tables?.length == 0" class="ml5" type="success" size="small">{{ $t('db.dump') }}</el-button>
|
||||
<el-button :disabled="state.dumpInfo.tables?.length == 0" class="ml-1" type="success" size="small">{{ $t('db.dump') }}</el-button>
|
||||
</template>
|
||||
<el-form-item :label="$t('db.exportContent')">
|
||||
<el-radio-group v-model="dumpInfo.type">
|
||||
@@ -73,11 +73,11 @@
|
||||
<el-table-column :label="$t('common.more')" min-width="160">
|
||||
<template #default="scope">
|
||||
<el-link @click.prevent="showColumns(scope.row)" type="primary">{{ $t('db.column') }}</el-link>
|
||||
<el-link class="ml5" @click.prevent="showTableIndex(scope.row)" type="success">{{ $t('db.index') }}</el-link>
|
||||
<el-link class="ml5" v-if="editDbTypes.indexOf(dbType) > -1" @click.prevent="openEditTable(scope.row)" type="warning">
|
||||
<el-link class="ml-1" @click.prevent="showTableIndex(scope.row)" type="success">{{ $t('db.index') }}</el-link>
|
||||
<el-link class="ml-1" v-if="editDbTypes.indexOf(dbType) > -1" @click.prevent="openEditTable(scope.row)" type="warning">
|
||||
{{ $t('db.editTable') }}
|
||||
</el-link>
|
||||
<el-link class="ml5" @click.prevent="showCreateDdl(scope.row)" type="info">DDL</el-link>
|
||||
<el-link class="ml-1" @click.prevent="showCreateDdl(scope.row)" type="info">DDL</el-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('common.operation')" min-width="80">
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="machine-list">
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="machineApi.list"
|
||||
@@ -29,7 +29,7 @@
|
||||
<span v-if="!data.stat">-</span>
|
||||
<div v-else>
|
||||
<el-row>
|
||||
<el-text size="small" class="font11">
|
||||
<el-text size="small" class="!text-[11px]">
|
||||
{{ $t('machine.memberInfo') }}:
|
||||
<span :class="getStatsFontClass(data.stat.memAvailable, data.stat.memTotal)"
|
||||
>{{ formatByteSize(data.stat.memAvailable, 1) }}/{{ formatByteSize(data.stat.memTotal, 1) }}
|
||||
@@ -37,7 +37,7 @@
|
||||
</el-text>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-text class="font11" size="small">
|
||||
<el-text class="!text-[11px]" size="small">
|
||||
{{ $t('machine.cpuInfo') }}: <span :class="getStatsFontClass(data.stat.cpuIdle, 100)">{{ data.stat.cpuIdle.toFixed(0) }}%</span>
|
||||
</el-text>
|
||||
</el-row>
|
||||
@@ -48,18 +48,18 @@
|
||||
<span v-if="!data.stat?.fsInfos">-</span>
|
||||
<div v-else>
|
||||
<el-row v-for="(i, idx) in data.stat.fsInfos.slice(0, 2)" :key="i.mountPoint">
|
||||
<el-text class="font11" size="small" :class="getStatsFontClass(i.free, i.used + i.free)">
|
||||
<el-text class="!text-[11px]" size="small" :class="getStatsFontClass(i.free, i.used + i.free)">
|
||||
{{ i.mountPoint }} => {{ formatByteSize(i.free, 0) }}/{{ formatByteSize(i.used + i.free, 0) }}
|
||||
</el-text>
|
||||
|
||||
<!-- 展示剩余的磁盘信息 -->
|
||||
<el-popover :show-after="300" v-if="data.stat.fsInfos.length > 2 && idx == 1" placement="top-start" width="230" trigger="hover">
|
||||
<template #reference>
|
||||
<SvgIcon class="mt5 ml5" color="var(--el-color-primary)" name="MoreFilled" />
|
||||
<SvgIcon class="mt-1 ml-1" color="var(--el-color-primary)" name="MoreFilled" />
|
||||
</template>
|
||||
|
||||
<el-row v-for="i in data.stat.fsInfos.slice(2)" :key="i.mountPoint">
|
||||
<el-text class="font11" size="small" :class="getStatsFontClass(i.free, i.used + i.free)">
|
||||
<el-text class="!text-[11px]" size="small" :class="getStatsFontClass(i.free, i.used + i.free)">
|
||||
{{ i.mountPoint }} => {{ formatByteSize(i.free, 0) }}/{{ formatByteSize(i.used + i.free, 0) }}
|
||||
</el-text>
|
||||
</el-row>
|
||||
|
||||
@@ -32,14 +32,21 @@
|
||||
</template>
|
||||
|
||||
<template #right>
|
||||
<div class="machine-terminal-tabs card pd5">
|
||||
<el-tabs v-if="state.tabs.size > 0" type="card" @tab-remove="onRemoveTab" style="width: 100%" v-model="state.activeTermName" class="h100">
|
||||
<el-tab-pane class="h100" closable v-for="dt in state.tabs.values()" :label="dt.label" :name="dt.key" :key="dt.key">
|
||||
<div class="machine-terminal-tabs card !p-1">
|
||||
<el-tabs
|
||||
v-if="state.tabs.size > 0"
|
||||
type="card"
|
||||
@tab-remove="onRemoveTab"
|
||||
style="width: 100%"
|
||||
v-model="state.activeTermName"
|
||||
class="!h-full"
|
||||
>
|
||||
<el-tab-pane class="!h-full" closable v-for="dt in state.tabs.values()" :label="dt.label" :name="dt.key" :key="dt.key">
|
||||
<template #label>
|
||||
<el-popconfirm @confirm="handleReconnect(dt, true)" :title="$t('machine.reConnTips')">
|
||||
<template #reference>
|
||||
<el-icon
|
||||
class="mr5"
|
||||
class="mr-1"
|
||||
:color="EnumValue.getEnumByValue(TerminalStatusEnum, dt.status)?.extra?.iconColor"
|
||||
:title="dt.status == TerminalStatusEnum.Connected.value ? '' : $t('machine.clickReConn')"
|
||||
><Connection />
|
||||
|
||||
@@ -1,19 +1,19 @@
|
||||
<template>
|
||||
<div class="file-manage">
|
||||
<el-dialog :title="$t('machine.process')" v-model="dialogVisible" :destroy-on-close="true" :show-close="true" :before-close="handleClose" width="65%">
|
||||
<div class="card pd5">
|
||||
<div class="card !p-1">
|
||||
<el-row>
|
||||
<el-col :span="4">
|
||||
<el-input size="small" :placeholder="$t('machine.processName')" v-model="params.name" plain clearable></el-input>
|
||||
</el-col>
|
||||
<el-col :span="4" class="ml5">
|
||||
<el-select class="w100" @change="getProcess" size="small" v-model="params.sortType" :placeholder="$t('machine.selectSortType')">
|
||||
<el-col :span="4" class="ml-1">
|
||||
<el-select class="!w-full" @change="getProcess" size="small" v-model="params.sortType" :placeholder="$t('machine.selectSortType')">
|
||||
<el-option key="cpu" :label="$t('machine.cpuDesc')" value="1"> </el-option>
|
||||
<el-option key="cpu" :label="$t('machine.memDesc')" value="2"> </el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4" class="ml5">
|
||||
<el-select class="w100" @change="getProcess" size="small" v-model="params.count" :placeholder="$t('machine.selectProcessNum')">
|
||||
<el-col :span="4" class="ml-1">
|
||||
<el-select class="!w-full" @change="getProcess" size="small" v-model="params.count" :placeholder="$t('machine.selectProcessNum')">
|
||||
<el-option key="10" label="10" value="10"> </el-option>
|
||||
<el-option key="15" label="15" value="15"> </el-option>
|
||||
<el-option key="20" label="20" value="20"> </el-option>
|
||||
@@ -21,7 +21,7 @@
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-button class="ml5" @click="getProcess" type="primary" icon="refresh" size="small" plain>{{ $t('common.refresh') }}</el-button>
|
||||
<el-button class="ml-1" @click="getProcess" type="primary" icon="refresh" size="small" plain>{{ $t('common.refresh') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
@@ -22,7 +22,7 @@
|
||||
<EnumSelect :enums="ScriptResultEnum" v-model="form.type" default-first-option />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="w100">
|
||||
<el-form-item class="!w-full">
|
||||
<template #label>
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="cronJobApi.list"
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
<el-table-column prop="name" :label="$t('common.name')" min-width="100px">
|
||||
<template #header>
|
||||
<el-button class="ml0" type="primary" circle size="small" icon="Plus" @click="add()"> </el-button>
|
||||
<span class="ml10">{{ $t('common.name') }}</span>
|
||||
<span class="ml-2">{{ $t('common.name') }}</span>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.name" :disabled="scope.row.id != null" clearable> </el-input>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div>
|
||||
<el-progress v-if="uploadProgressShow" style="width: 90%; margin-left: 20px" :text-inside="true" :stroke-width="20" :percentage="progressNum" />
|
||||
|
||||
<el-row class="mb10">
|
||||
<el-row class="mb-2">
|
||||
<el-breadcrumb separator-icon="ArrowRight">
|
||||
<el-breadcrumb-item v-for="path in filePathNav" :key="path">
|
||||
<el-link @click="setFiles(path.path)" style="font-weight: bold">{{ path.name }}</el-link>
|
||||
@@ -27,14 +27,14 @@
|
||||
<div class="machine-file-table-header">
|
||||
<div>
|
||||
<el-button :disabled="nowPath == basePath" type="primary" circle size="small" icon="Back" @click="back()"> </el-button>
|
||||
<el-button class="ml5" type="primary" circle size="small" icon="Refresh" @click="refresh()"> </el-button>
|
||||
<el-button class="!ml-1" type="primary" circle size="small" icon="Refresh" @click="refresh()"> </el-button>
|
||||
|
||||
<!-- 文件&文件夹上传 -->
|
||||
<el-dropdown class="machine-file-upload-exec" trigger="click" size="small">
|
||||
<span>
|
||||
<el-button
|
||||
v-auth="'machine:file:upload'"
|
||||
class="ml5"
|
||||
class="!ml-1"
|
||||
type="primary"
|
||||
circle
|
||||
size="small"
|
||||
@@ -81,7 +81,7 @@
|
||||
:disabled="state.selectionFiles.length == 0"
|
||||
v-auth="'machine:file:rm'"
|
||||
@click="copyFile(state.selectionFiles)"
|
||||
class="ml5"
|
||||
class="!ml-1"
|
||||
type="primary"
|
||||
circle
|
||||
size="small"
|
||||
@@ -94,7 +94,7 @@
|
||||
:disabled="state.selectionFiles.length == 0"
|
||||
v-auth="'machine:file:rm'"
|
||||
@click="mvFile(state.selectionFiles)"
|
||||
class="ml5"
|
||||
class="!ml-1"
|
||||
type="primary"
|
||||
circle
|
||||
size="small"
|
||||
@@ -106,7 +106,7 @@
|
||||
<el-button
|
||||
v-auth="'machine:file:write'"
|
||||
@click="showCreateFileDialog()"
|
||||
class="ml5"
|
||||
class="!ml-1"
|
||||
type="primary"
|
||||
circle
|
||||
size="small"
|
||||
@@ -119,7 +119,7 @@
|
||||
:disabled="state.selectionFiles.length == 0"
|
||||
v-auth="'machine:file:rm'"
|
||||
@click="deleteFile(state.selectionFiles)"
|
||||
class="ml5"
|
||||
class="!ml-1"
|
||||
type="danger"
|
||||
circle
|
||||
size="small"
|
||||
@@ -128,7 +128,7 @@
|
||||
>
|
||||
</el-button>
|
||||
|
||||
<el-button-group v-if="state.copyOrMvFile.paths.length > 0" size="small" class="ml5">
|
||||
<el-button-group v-if="state.copyOrMvFile.paths.length > 0" size="small" class="!ml-1">
|
||||
<el-tooltip effect="customized" raw-content placement="top">
|
||||
<template #content>
|
||||
<div v-for="path in state.copyOrMvFile.paths" v-bind:key="path">{{ path }}</div>
|
||||
@@ -158,7 +158,7 @@
|
||||
<SvgIcon :size="15" :name="scope.row.icon" />
|
||||
</span>
|
||||
|
||||
<span class="ml5" style="display: inline-block; width: 90%">
|
||||
<span class="!ml-1" style="display: inline-block; width: 90%">
|
||||
<div v-if="scope.row.nameEdit">
|
||||
<el-input
|
||||
@keyup.enter="fileRename(scope.row)"
|
||||
@@ -204,7 +204,7 @@
|
||||
<template #header>
|
||||
<el-popover placement="top" :width="270" trigger="hover">
|
||||
<template #reference>
|
||||
<SvgIcon name="QuestionFilled" :size="18" class="pointer-icon mr10" />
|
||||
<SvgIcon name="QuestionFilled" :size="18" class="pointer-icon mr-2" />
|
||||
</template>
|
||||
<div>{{ $t('machine.renameTips') }}</div>
|
||||
</el-popover>
|
||||
@@ -228,7 +228,7 @@
|
||||
type="primary"
|
||||
icon="download"
|
||||
:underline="false"
|
||||
class="ml10"
|
||||
class="ml-2"
|
||||
:title="$t('machine.download')"
|
||||
></el-link>
|
||||
|
||||
@@ -246,7 +246,7 @@
|
||||
icon="InfoFilled"
|
||||
:underline="false"
|
||||
link
|
||||
class="ml10"
|
||||
class="ml-2"
|
||||
:loading="scope.row.loadingStat"
|
||||
></el-link>
|
||||
</span>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<el-table-column prop="name" :label="$t('common.name')" show-overflow-tooltip min-width="100px"> </el-table-column>
|
||||
<el-table-column prop="cmds" :label="$t('machine.filterCmds')" min-width="320px" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<el-tag class="ml2 mt2" v-for="cmd in scope.row.cmds" :key="cmd" type="danger">
|
||||
<el-tag class="ml-0.5 mt-0.5" v-for="cmd in scope.row.cmds" :key="cmd" type="danger">
|
||||
{{ cmd }}
|
||||
</el-tag>
|
||||
</template>
|
||||
@@ -20,7 +20,7 @@
|
||||
<el-table-column :label="$t('common.operation')" min-width="120px">
|
||||
<template #header>
|
||||
<el-text tag="b">{{ $t('common.operation') }}</el-text>
|
||||
<el-button v-auth="'cmdconf:save'" class="ml5" type="primary" circle size="small" icon="Plus" @click="openFormDialog(false)"> </el-button>
|
||||
<el-button v-auth="'cmdconf:save'" class="ml-1" type="primary" circle size="small" icon="Plus" @click="openFormDialog(false)"> </el-button>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-button v-auth="'cmdconf:save'" @click="openFormDialog(scope.row)" type="primary" link>{{ $t('common.edit') }}</el-button>
|
||||
@@ -49,7 +49,7 @@
|
||||
<el-form-item prop="cmds" :label="$t('machine.filterCmds')" required>
|
||||
<el-row>
|
||||
<el-tag
|
||||
class="ml2 mt2"
|
||||
class="ml-0.5 mt-0.5"
|
||||
v-for="tag in form.cmds"
|
||||
:key="tag"
|
||||
closable
|
||||
@@ -63,13 +63,13 @@
|
||||
v-if="state.inputCmdVisible"
|
||||
ref="cmdInputRef"
|
||||
v-model="state.cmdInputValue"
|
||||
class="mt3"
|
||||
class="mt-0.5"
|
||||
size="small"
|
||||
@keyup.enter="handleCmdInputConfirm"
|
||||
@blur="handleCmdInputConfirm"
|
||||
:placeholder="$t('machine.cmdPlaceholder')"
|
||||
/>
|
||||
<el-button v-else class="ml2 mt2" size="small" @click="showCmdInput"> + {{ $t('machine.newCmd') }} </el-button>
|
||||
<el-button v-else class="ml-0.5 mt-0.5" size="small" @click="showCmdInput"> + {{ $t('machine.newCmd') }} </el-button>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="card">
|
||||
<div class="card h-full">
|
||||
<el-tabs v-model="activeName" @tab-change="handleTabChange">
|
||||
<el-tab-pane :label="$t('machine.cmdConfig')" :name="CmdConfTab">
|
||||
<CmdConfList />
|
||||
|
||||
@@ -43,9 +43,9 @@
|
||||
</template>
|
||||
|
||||
<template #right>
|
||||
<div class="mongo-data-tab card pd5 w100">
|
||||
<div class="mongo-data-tab card !p-1 !w-full">
|
||||
<el-row v-if="nowColl">
|
||||
<el-descriptions class="w100" :column="10" size="small" border>
|
||||
<el-descriptions class="!w-full" :column="10" size="small" border>
|
||||
<!-- <el-descriptions-item label-align="right" label="tag">xxx</el-descriptions-item> -->
|
||||
|
||||
<el-descriptions-item label="ns" label-align="right">
|
||||
@@ -73,11 +73,11 @@
|
||||
</el-row>
|
||||
|
||||
<el-row type="flex">
|
||||
<el-tabs @tab-remove="removeDataTab" class="w100 ml5" v-model="state.activeName">
|
||||
<el-tabs @tab-remove="removeDataTab" class="!w-full ml-1" v-model="state.activeName">
|
||||
<el-tab-pane closable v-for="dt in state.dataTabs" :key="dt.key" :label="dt.label" :name="dt.key">
|
||||
<el-row>
|
||||
<el-col :span="2">
|
||||
<div class="mt5">
|
||||
<div class="mt-1">
|
||||
<el-link @click="findCommand(state.activeName)" icon="refresh" :underline="false" class=""> </el-link>
|
||||
<el-divider direction="vertical" border-style="dashed" />
|
||||
<el-link v-auth="perms.saveData" @click="onEditDoc(null)" type="primary" icon="plus" :underline="false"> </el-link>
|
||||
@@ -99,7 +99,7 @@
|
||||
<el-col :span="6" v-for="item in dt.datas" :key="item">
|
||||
<el-card :body-style="{ padding: '0px', position: 'relative' }">
|
||||
<el-input type="textarea" v-model="item.value" :rows="10" />
|
||||
<div style="padding: 3px; float: right" class="mr5 mongo-doc-btns">
|
||||
<div style="padding: 3px; float: right" class="mr-1 mongo-doc-btns">
|
||||
<div>
|
||||
<el-link @click="onEditDoc(item)" :underline="false" type="success" icon="MagicStick"></el-link>
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog width="800px" :title="$t('mongo.dbList')" :before-close="close" v-model="databaseDialog.visible">
|
||||
<div class="mb5">
|
||||
<div class="mb-1">
|
||||
<el-button @click="showCreateDbDialog" type="primary" icon="plus" size="small">{{ $t('common.create') }}</el-button>
|
||||
</div>
|
||||
<el-table :data="databaseDialog.data" :max-height="500">
|
||||
@@ -70,7 +70,7 @@
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog width="600px" :title="collectionsDialog.title" v-model="collectionsDialog.visible">
|
||||
<div class="mb5">
|
||||
<div class="mb-1">
|
||||
<el-button @click="showCreateCollectionDialog" type="primary" icon="plus" size="small">{{ $t('common.create') }}</el-button>
|
||||
</div>
|
||||
<el-table stripe :data="collectionsDialog.data" :max-height="500">
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="mongoApi.mongoList"
|
||||
|
||||
@@ -2,11 +2,11 @@
|
||||
<div>
|
||||
<el-dialog width="750px" title="runCommand" v-model="runCmdDialog.visible" :before-close="close" :destroy-on-close="true">
|
||||
<el-form label-width="auto">
|
||||
<el-row class="mb10">
|
||||
<el-row class="mb-2">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('mongo.template')">
|
||||
<el-select
|
||||
class="w100"
|
||||
class="!w-full"
|
||||
@change="changeCmd"
|
||||
filterable
|
||||
v-model="runCmdDialog.cmdName"
|
||||
@@ -24,11 +24,11 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-form-item class="ml10">
|
||||
<el-form-item class="ml-2">
|
||||
<el-button @click="onRunCommand" type="primary">Run</el-button>
|
||||
<el-tooltip effect="dark" placement="top">
|
||||
<template #content> {{ $t('mongo.moreCmdTips') }}-> https://www.mongodb.com/docs/manual/reference/command/ </template>
|
||||
<span class="ml10">
|
||||
<span class="ml-2">
|
||||
<el-icon><InfoFilled /></el-icon>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
|
||||
@@ -45,7 +45,7 @@
|
||||
<template #right>
|
||||
<Splitpanes class="default-theme">
|
||||
<Pane size="35" max-size="50">
|
||||
<div class="key-list-vtree card pd5">
|
||||
<div class="key-list-vtree card !p-1">
|
||||
<el-scrollbar>
|
||||
<el-row :gutter="5">
|
||||
<el-col :span="2">
|
||||
@@ -73,7 +73,7 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="5" class="mb5 mt5">
|
||||
<el-row :gutter="5" class="mb-1 mt-1">
|
||||
<el-col :span="19">
|
||||
<el-button :disabled="!scanParam.id || !scanParam.db" @click="scan(true)" type="success" icon="more" size="small" plain>
|
||||
{{ $t('redis.loadMore') }}
|
||||
@@ -87,7 +87,7 @@
|
||||
icon="plus"
|
||||
size="small"
|
||||
plain
|
||||
class="ml5"
|
||||
class="!ml-0.5"
|
||||
>
|
||||
{{ $t('redis.addKey') }}
|
||||
</el-button>
|
||||
@@ -100,13 +100,13 @@
|
||||
v-auth="'redis:data:del'"
|
||||
size="small"
|
||||
icon="delete"
|
||||
class="ml5"
|
||||
class="!ml-0.5"
|
||||
>
|
||||
flush
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="5">
|
||||
<span class="mt5" style="display: inline-block">keys:{{ state.dbsize }}</span>
|
||||
<span class="mt-1" style="display: inline-block">keys:{{ state.dbsize }}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
@@ -129,11 +129,11 @@
|
||||
<span v-if="data.type == 1">
|
||||
<SvgIcon :size="15" :name="node.expanded ? 'folder-opened' : 'folder'" />
|
||||
</span>
|
||||
<span :class="'ml5 ' + (data.type == 1 ? 'folder-label' : 'key-label')">
|
||||
<span :class="'ml-1 ' + (data.type == 1 ? 'folder-label' : 'key-label')">
|
||||
{{ node.label }}
|
||||
</span>
|
||||
|
||||
<span v-if="!node.isLeaf" class="ml5" style="font-weight: bold"> ({{ data.keyCount }}) </span>
|
||||
<span v-if="!node.isLeaf" class="ml-1" style="font-weight: bold"> ({{ data.keyCount }}) </span>
|
||||
</span>
|
||||
</template>
|
||||
</el-tree>
|
||||
@@ -144,7 +144,7 @@
|
||||
</Pane>
|
||||
|
||||
<Pane>
|
||||
<div class="key-detail card pd5">
|
||||
<div class="key-detail card !p-1">
|
||||
<el-tabs @tab-remove="removeDataTab" v-model="state.activeName">
|
||||
<el-tab-pane closable v-for="dt in state.dataTabs" :key="dt.key" :label="dt.label" :name="dt.key">
|
||||
<key-detail :redis="redisInst" :key-info="dt.keyInfo" @change-key="searchKey()" @del-key="delKey" />
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
<template>
|
||||
<div class="format-viewer-container">
|
||||
<div class="mb5 fr">
|
||||
<div class="mb-1 float-right">
|
||||
<el-select v-model="selectedView" class="format-selector" size="small" placeholder="Text">
|
||||
<template #prefix>
|
||||
<SvgIcon name="view" />
|
||||
</template>
|
||||
<el-option v-for="item of Object.keys(viewers)" :key="item" :label="item" :value="item"> </el-option>
|
||||
</el-select>
|
||||
<el-tag type="primary" :disable-transitions="true" class="ml10">Size: {{ formatByteSize(state.contentSize) }}</el-tag>
|
||||
<el-tag type="primary" :disable-transitions="true" class="ml-2">Size: {{ formatByteSize(state.contentSize) }}</el-tag>
|
||||
</div>
|
||||
|
||||
<component ref="viewerRef" :is="components[viewerComponent]" :content="state.content" :name="selectedView"> </component>
|
||||
|
||||
@@ -24,8 +24,8 @@
|
||||
<!-- 时间转换 -->
|
||||
<el-tooltip effect="dark" placement="top">
|
||||
<template #content>{{ ttlConveter(ki.timed) }}</template>
|
||||
<span class="ml10">
|
||||
<el-icon class="mr5"><InfoFilled /></el-icon>
|
||||
<span class="ml-2">
|
||||
<el-icon class="mr-1"><InfoFilled /></el-icon>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-button @click="showEditDialog(null)" icon="plus" size="small" plain type="primary" class="mb10">{{ $t('redis.addNewLine') }}</el-button>
|
||||
<el-button @click="showEditDialog(null)" icon="plus" size="small" plain type="primary" class="mb-2">{{ $t('redis.addNewLine') }}</el-button>
|
||||
<el-table size="small" border :data="hashValues" height="500" min-height="300" stripe>
|
||||
<el-table-column type="index" :label="'ID (Total: ' + total + ')'" sortable width="100"> </el-table-column>
|
||||
<el-table-column resizable sortable prop="field" label="field" show-overflow-tooltip min-width="100"> </el-table-column>
|
||||
@@ -20,7 +20,7 @@
|
||||
<el-link @click="showEditDialog(scope.row)" :underline="false" type="primary" icon="edit" plain></el-link>
|
||||
<el-popconfirm :title="$t('redis.deleteConfirm')" @confirm="hdel(scope.row.field, scope.$index)">
|
||||
<template #reference>
|
||||
<el-link v-auth="'redis:data:del'" :underline="false" type="danger" icon="delete" size="small" plain class="ml5"></el-link>
|
||||
<el-link v-auth="'redis:data:del'" :underline="false" type="danger" icon="delete" size="small" plain class="ml-1"></el-link>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
@@ -37,7 +37,7 @@
|
||||
<el-input v-model="editDialog.field" placeholder="field" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<format-viewer class="w100" ref="formatViewerRef" :content="editDialog.value"></format-viewer>
|
||||
<format-viewer class="!w-full" ref="formatViewerRef" :content="editDialog.value"></format-viewer>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-button @click="showEditDialog(null, -1)" icon="plus" size="small" plain type="primary" class="mb10">{{ $t('redis.addNewLine') }}</el-button>
|
||||
<el-button @click="showEditDialog(null, -1)" icon="plus" size="small" plain type="primary" class="mb-2">{{ $t('redis.addNewLine') }}</el-button>
|
||||
<el-table size="small" border :data="values" height="450" min-height="300" stripe>
|
||||
<el-table-column type="index" :label="'ID (Total: ' + total + ')'" sortable width="100"> </el-table-column>
|
||||
<el-table-column resizable sortable prop="value" label="value" show-overflow-tooltip min-width="200"> </el-table-column>
|
||||
@@ -9,7 +9,7 @@
|
||||
<el-link @click="showEditDialog(scope.row, scope.$index)" :underline="false" type="primary" icon="edit" plain></el-link>
|
||||
<el-popconfirm :title="$t('redis.deleteConfirm')" @confirm="lrem(scope.row, scope.$index)">
|
||||
<template #reference>
|
||||
<el-link v-auth="'redis:data:del'" :underline="false" type="danger" icon="delete" size="small" plain class="ml5"></el-link>
|
||||
<el-link v-auth="'redis:data:del'" :underline="false" type="danger" icon="delete" size="small" plain class="ml-1"></el-link>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
@@ -23,7 +23,7 @@
|
||||
<el-dialog :title="$t('redis.addNewLine')" v-model="editDialog.visible" width="600px" :destroy-on-close="true" :close-on-click-modal="false">
|
||||
<el-form>
|
||||
<el-form-item>
|
||||
<format-viewer class="w100" ref="formatViewerRef" :content="editDialog.content"></format-viewer>
|
||||
<format-viewer class="!w-full" ref="formatViewerRef" :content="editDialog.content"></format-viewer>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-button @click="showEditDialog(null)" icon="plus" size="small" plain type="primary" class="mb10">{{ $t('redis.addNewLine') }}</el-button>
|
||||
<el-button @click="showEditDialog(null)" icon="plus" size="small" plain type="primary" class="mb-2">{{ $t('redis.addNewLine') }}</el-button>
|
||||
<el-table size="small" border :data="setDatas" height="450" min-height="300" stripe>
|
||||
<el-table-column type="index" :label="'ID (Total: ' + total + ')'" sortable width="100"> </el-table-column>
|
||||
<el-table-column resizable sortable prop="value" label="value" show-overflow-tooltip min-width="200"> </el-table-column>
|
||||
@@ -19,7 +19,7 @@
|
||||
<el-link @click="showEditDialog(scope.row)" :underline="false" type="primary" icon="edit" plain></el-link>
|
||||
<el-popconfirm :title="$t('redis.deleteConfirm')" @confirm="srem(scope.row, scope.$index)">
|
||||
<template #reference>
|
||||
<el-link v-auth="'redis:data:del'" :underline="false" type="danger" icon="delete" size="small" plain class="ml5"></el-link>
|
||||
<el-link v-auth="'redis:data:del'" :underline="false" type="danger" icon="delete" size="small" plain class="ml-1"></el-link>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
@@ -33,7 +33,7 @@
|
||||
<el-dialog :title="$t('redis.addNewLine')" v-model="editDialog.visible" width="600px" :destroy-on-close="true" :close-on-click-modal="false">
|
||||
<el-form>
|
||||
<el-form-item>
|
||||
<format-viewer class="w100" ref="formatViewerRef" :content="editDialog.content"></format-viewer>
|
||||
<format-viewer class="!w-full" ref="formatViewerRef" :content="editDialog.content"></format-viewer>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
<format-viewer ref="formatViewerRef" height="250px" :content="string.value"></format-viewer>
|
||||
</div>
|
||||
</el-form>
|
||||
<div class="mt10 fr">
|
||||
<div class="!mt-2 float-right">
|
||||
<el-button @click="saveValue" type="primary" v-auth="'redis:data:save'">{{ $t('common.save') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-button @click="showEditDialog(null)" icon="plus" size="small" plain type="primary" class="mb10">{{ $t('redis.addNewLine') }}</el-button>
|
||||
<el-button @click="showEditDialog(null)" icon="plus" size="small" plain type="primary" class="mb-2">{{ $t('redis.addNewLine') }}</el-button>
|
||||
<el-table size="small" border :data="values" height="450" min-height="300" stripe>
|
||||
<el-table-column type="index" :label="'ID (Total: ' + total + ')'" sortable width="100"> </el-table-column>
|
||||
<el-table-column resizable sortable prop="score" label="score" show-overflow-tooltip min-width="100"> </el-table-column>
|
||||
@@ -20,7 +20,7 @@
|
||||
<el-link @click="showEditDialog(scope.row)" :underline="false" type="primary" icon="edit" plain></el-link>
|
||||
<el-popconfirm :title="$t('redis.deleteConfirm')" @confirm="zrem(scope.row, scope.$index)">
|
||||
<template #reference>
|
||||
<el-link v-auth="'redis:data:del'" :underline="false" type="danger" icon="delete" size="small" plain class="ml5"></el-link>
|
||||
<el-link v-auth="'redis:data:del'" :underline="false" type="danger" icon="delete" size="small" plain class="ml-1"></el-link>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
@@ -37,7 +37,7 @@
|
||||
<el-input type="number" v-model.number="editDialog.score" placeholder="score" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<format-viewer class="w100" ref="formatViewerRef" :content="editDialog.content"></format-viewer>
|
||||
<format-viewer class="!w-full" ref="formatViewerRef" :content="editDialog.content"></format-viewer>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="redisApi.redisList"
|
||||
@@ -63,7 +63,7 @@
|
||||
effect="plain"
|
||||
type="success"
|
||||
size="small"
|
||||
style="cursor: pointer"
|
||||
class="cursor-pointer"
|
||||
>{{ scope.row.ip }}
|
||||
</el-tag>
|
||||
</template>
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog title="待执行cmd" v-model="dialogVisible" :show-close="false" width="600px" @close="cancel">
|
||||
<el-input type="textarea" disabled v-model="state.cmdStr" class="mt5" :rows="5" />
|
||||
<el-input @keyup.enter="runCmd" ref="remarkInputRef" v-model="remark" placeholder="请输入执行备注" class="mt5" />
|
||||
<el-input type="textarea" disabled v-model="state.cmdStr" class="mt-1" :rows="5" />
|
||||
<el-input @keyup.enter="runCmd" ref="remarkInputRef" v-model="remark" placeholder="请输入执行备注" class="mt-1" />
|
||||
|
||||
<div v-if="props.flowProcdef">
|
||||
<el-divider content-position="left">审批节点</el-divider>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="resourceAuthCertApi.listByQuery"
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<div class="tag-tree-list card">
|
||||
<Splitpanes class="default-theme">
|
||||
<Pane size="30" min-size="25" max-size="35">
|
||||
<div class="card pd5 mr5">
|
||||
<div class="card !p-1 !mb-1 !mr-1">
|
||||
<el-input v-model="filterTag" clearable :placeholder="$t('tag.nameFilterPlaceholder')" style="width: 200px; margin-right: 10px" />
|
||||
<el-button
|
||||
v-if="useUserInfo().userInfo.username == 'admin'"
|
||||
@@ -11,7 +11,7 @@
|
||||
icon="plus"
|
||||
@click="showSaveTagDialog(null)"
|
||||
></el-button>
|
||||
<div style="float: right">
|
||||
<div class="float-right">
|
||||
<el-tooltip placement="top">
|
||||
<template #content>
|
||||
{{ $t('tag.tagTips1') }}
|
||||
@@ -53,7 +53,7 @@
|
||||
:color="EnumValue.getEnumByValue(TagResourceTypeEnum, data.type)?.extra.iconColor"
|
||||
/>
|
||||
|
||||
<span class="ml5">
|
||||
<span class="ml-1">
|
||||
{{ data.name }}
|
||||
<span style="color: #3c8dbc">【</span>
|
||||
{{ data.code }}
|
||||
@@ -66,8 +66,8 @@
|
||||
</el-scrollbar>
|
||||
</Pane>
|
||||
|
||||
<Pane min-size="40">
|
||||
<div class="ml10">
|
||||
<Pane min-size="40" size="70">
|
||||
<div class="ml-2">
|
||||
<el-tabs @tab-change="tabChange" v-model="state.activeTabName" v-if="currentTag">
|
||||
<el-tab-pane :label="$t('common.detail')" :name="TagDetail">
|
||||
<el-descriptions :column="2" border>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="tagApi.getTeams"
|
||||
|
||||
@@ -3,11 +3,11 @@
|
||||
<el-row>
|
||||
<!-- 更新信息 -->
|
||||
<el-col :span="24">
|
||||
<el-card shadow="hover" class="mt15 personal-edit" :header="$t('personal.updateInfo')">
|
||||
<el-card shadow="hover" class="!mt-3.5 personal-edit" :header="$t('personal.updateInfo')">
|
||||
<div class="personal-edit-title">{{ $t('personal.basicInfo') }}</div>
|
||||
<el-form :model="accountForm" label-width="auto" class="mt35 mb35">
|
||||
<el-form :model="accountForm" label-width="auto" class="mt-8 mb-8">
|
||||
<el-row :gutter="35">
|
||||
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="!mb-4">
|
||||
<el-form-item :label="$t('common.password')">
|
||||
<el-input
|
||||
type="password"
|
||||
@@ -28,7 +28,7 @@
|
||||
</el-form>
|
||||
|
||||
<span v-show="authStatus.enable">
|
||||
<div class="personal-edit-title mb15">{{ $t('personal.accountInfo') }}</div>
|
||||
<div class="personal-edit-title mb-2">{{ $t('personal.accountInfo') }}</div>
|
||||
<div class="personal-edit-safe-box">
|
||||
<div class="personal-edit-safe-item">
|
||||
<div class="personal-edit-safe-item-left">
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:page-api="accountApi.list"
|
||||
|
||||
@@ -67,7 +67,7 @@
|
||||
>
|
||||
<template #default="{ node, data }">
|
||||
<span class="custom-tree-node">
|
||||
<SvgIcon :name="getMenuIcon(data)" class="mb3 mr3" />
|
||||
<SvgIcon :name="getMenuIcon(data)" class="mb-0.5 mr-0.5" />
|
||||
|
||||
<span v-if="data.type == ResourceTypeEnum.Menu.value">{{ $t(node.label) }}</span>
|
||||
<span v-if="data.type == ResourceTypeEnum.Permission.value" style="color: #67c23a">{{ $t(node.label) }}</span>
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
</el-descriptions-item>
|
||||
|
||||
<el-descriptions-item :span="2" :label="$t('common.role')">
|
||||
<el-tag v-for="role in account.roles" :key="role.code" class="ml5">
|
||||
<el-tag v-for="role in account.roles" :key="role.code" class="ml-1">
|
||||
{{ role.roleName }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item :label="$t('system.sysconf.confItem')" class="w100">
|
||||
<el-form-item :label="$t('system.sysconf.confItem')" class="!w-full">
|
||||
<dynamic-form-edit v-model="params" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="h-full">
|
||||
<page-table
|
||||
ref="pageTableRef"
|
||||
:search-items="searchItems"
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user