gfwleak/cyber-narrator-cn-ui
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CN-1592 feat: 部分css重构内容

Browse Source
This commit is contained in:
chenjinsong
2024-03-26 17:06:32 +08:00
parent 19d50f45c6
commit 2e83fd893e
25 changed files with 600 additions and 1746 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/common/TimeRange/DateTimeRange.vue
View File

@@ -1,6 +1,6 @@
<template>
<div v-ele-click-outside="changeDropdown" style="position: relative;" class="date-range-box">
<div @click="showDropdown" class="date-range-text" :class="myClass" :style="style">
<div @click="showDropdown" tabindex="1" class="date-range-text" :class="myClass" :style="style">
<div class="calendar-popover-text"><i class="cn-icon cn-icon-Data"></i></div>
<div class="calendar-popover-text" style="display: flex" v-if="isCustom" :title="`${dateFormatByAppearance(getMillisecond(startTime))} -${dateFormatByAppearance(getMillisecond(endTime))}`">
<div class="calendar-popover-text" :style="showPosition === 'left' ? 'width: 90px;text-overflow: ellipsis;overflow: hidden;' : ''" >{{ dateFormatByAppearance(getMillisecond(startTime)) }}</div>
@@ -56,7 +56,7 @@
<el-col
:span="8"
class="date-range-panel-content date-range-panel-content-right"
style="border-left: 1px solid rgba(0,0,0,0.09);">
>
<div class="date-range-title">{{$t('dateTime.relativeTimeRanges')}}</div>
<ul class="date-range-item">
<li v-for="item in dateRangeArr"

38
src/components/common/TimeRange/TimeRefresh.vue
View File

@@ -1,23 +1,23 @@
<template>
<div class="cn-refresh-box" v-ele-click-outside="dropdownShowFalse">
<span>
<el-button-group size="small">
<el-button size="small" @click="$emit('change')"><i class="cn-icon cn-icon-refresh1"></i></el-button>
<el-button class="cn-button" size="small" @click="showRefreshList">
<span class="cn-button-label" v-if="interLabel">{{interLabel}}</span>
<i class="cn-icon cn-icon-dropdown" :class="dropdownShow?'active' : ''"></i>
</el-button>
</el-button-group>
</span>
<transition name="el-zoom-in-top">
<div v-if="dropdownShow" class="refresh-list">
<div v-for="(item, index) in refreshArr" :key="index" @click="setRefresh(item)" class="refresh-list-item" :class="item.value==interval ? 'active' : ''">
{{ item.label }}
<i v-if="item.value===interval" class="cn-icon cn-icon-check"></i>
</div>
</div>
</transition>
</div>
<div class="cn-refresh-box" v-ele-click-outside="dropdownShowFalse">
<span>
<el-button-group size="small">
<el-button size="small" @click="$emit('change')"><i class="cn-icon cn-icon-refresh1"></i></el-button>
<el-button class="el-button--icon" size="small" @click="showRefreshList">
<span class="button-label" v-if="interLabel">{{interLabel}}</span>
<i class="cn-icon cn-icon-dropdown" :class="dropdownShow?'active' : ''"></i>
</el-button>
</el-button-group>
</span>
<transition name="el-zoom-in-top">
<div v-if="dropdownShow" class="refresh-list">
<div v-for="(item, index) in refreshArr" :key="index" @click="setRefresh(item)" class="refresh-list-item" :class="item.value==interval ? 'active' : ''">
{{ item.label }}
<i v-if="item.value===interval" class="cn-icon cn-icon-check"></i>
</div>
</div>
</transition>
</div>
</template>
<script>

12
src/components/layout/Header.vue
View File

@@ -9,16 +9,16 @@
<!--个人操作-->
<div class="personal">
<el-dropdown>
<div class="header-menu--item"><i class="cn-icon cn-icon-language"></i></div>
<div class="header-menu__item"><i class="cn-icon cn-icon-language"></i></div>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item>
<div id="header-to-english" :style="language === EN?'color:#0091ff':''" @click="changeLocal(EN)">
<div id="header-to-english" class="personal-dropdown-item" :class="language === EN ? 'is-active' : ''" @click="changeLocal(EN)">
English
</div>
</el-dropdown-item>
<el-dropdown-item>
<div id="header-to-chinese" :style="language === ZH?'color:#0091ff':''" @click="changeLocal(ZH)">
<div id="header-to-chinese" class="personal-dropdown-item" :class="language === ZH ? 'is-active' : ''" @click="changeLocal(ZH)">
中文
</div>
</el-dropdown-item>
@@ -26,7 +26,7 @@
</template>
</el-dropdown>
<el-dropdown>
<div class='login-user header-menu--item'>{{ nickName }}&nbsp;<i class="cn-icon cn-icon-arrow-down"></i></div>
<div class='login-user header-menu__item'>{{ nickName }}&nbsp;<i class="cn-icon cn-icon-arrow-down"></i></div>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item>
@@ -601,9 +601,9 @@ export default {
itemName = this.dnsRcodeMapData.get(item)
}
if (itemName === currentValue) {
selectedDom.style.cssText = 'color:#0091ff;font-weight: bold;'
selectedDom.classList.add('is-active')
} else {
selectedDom.style.cssText = ''
selectedDom.classList.remove('is-active')
}
}
})