icon font && opsTable (#450)

This commit is contained in:
dagongren 2024-03-28 20:59:32 +08:00 committed by GitHub
parent 430d2ff6d0
commit 8fc19d8b7c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
8 changed files with 1974 additions and 66 deletions

File diff suppressed because it is too large Load Diff

View File

@ -1,8 +1,8 @@
@font-face {
font-family: "iconfont"; /* Project id 3857903 */
src: url('iconfont.woff2?t=1702544951995') format('woff2'),
url('iconfont.woff?t=1702544951995') format('woff'),
url('iconfont.ttf?t=1702544951995') format('truetype');
src: url('iconfont.woff2?t=1711618200417') format('woff2'),
url('iconfont.woff?t=1711618200417') format('woff'),
url('iconfont.ttf?t=1711618200417') format('truetype');
}
.iconfont {
@ -13,6 +13,222 @@
-moz-osx-font-smoothing: grayscale;
}
.Google_Cloud_Platform:before {
content: "\e90b";
}
.Ctyun:before {
content: "\e90c";
}
.Alibaba_Cloud:before {
content: "\e90d";
}
.Azure:before {
content: "\e90e";
}
.ZStack:before {
content: "\e904";
}
.Tencent_Cloud:before {
content: "\e905";
}
.Nutanix:before {
content: "\e906";
}
.OpenStack:before {
content: "\e907";
}
.Huawei_Cloud:before {
content: "\e908";
}
.Bytecloud:before {
content: "\e909";
}
.UCloud:before {
content: "\e90a";
}
.AWS:before {
content: "\e901";
}
.ECloud:before {
content: "\e902";
}
.JDCloud:before {
content: "\e903";
}
.veops-more:before {
content: "\e900";
}
.duose-date:before {
content: "\e8ff";
}
.duose-shishu:before {
content: "\e8fd";
}
.duose-wenben:before {
content: "\e8fe";
}
.duose-json:before {
content: "\e8f7";
}
.duose-fudianshu:before {
content: "\e8f8";
}
.duose-time:before {
content: "\e8f9";
}
.duose-password:before {
content: "\e8fa";
}
.duose-link:before {
content: "\e8fb";
}
.duose-datetime:before {
content: "\e8fc";
}
.veops-setting2:before {
content: "\e8f6";
}
.veops-search:before {
content: "\e8f5";
}
.veops-delete:before {
content: "\e8f4";
}
.veops-refresh:before {
content: "\e8f3";
}
.veops-filter:before {
content: "\e8f2";
}
.veops-reduce:before {
content: "\e8ed";
}
.veops-increase:before {
content: "\e8ee";
}
.veops-configuration_table:before {
content: "\e8ef";
}
.veops-copy:before {
content: "\e8f0";
}
.veops-save:before {
content: "\e8f1";
}
.veops-setting:before {
content: "\e8ec";
}
.veops-default_avatar:before {
content: "\e8ea";
}
.veops-notice:before {
content: "\e8eb";
}
.itsm-quickStart:before {
content: "\e8e9";
}
.itsm-associatedWith:before {
content: "\e8e8";
}
.itsm-folder:before {
content: "\e8e7";
}
.report:before {
content: "\e8e5";
}
.folder:before {
content: "\e8e6";
}
.itsm-refresh:before {
content: "\e8e4";
}
.itsm-add_table:before {
content: "\e8e2";
}
.itsm-delete_page:before {
content: "\e8e3";
}
.oneterm-secret_key:before {
content: "\e8e0";
}
.oneterm-password:before {
content: "\e8e1";
}
.itsm-sla_timeout_not_handled:before {
content: "\e8dd";
}
.itsm-sla_not_timeout:before {
content: "\e8de";
}
.itsm-SLA:before {
content: "\e8df";
}
.itsm-sla_timeout_handled:before {
content: "\e8dc";
}
.itsm-sla_all:before {
content: "\e8da";
}
.itsm-generate_by_node_id:before {
content: "\e8db";
}
.cmdb-MySQL:before {
content: "\e8d9";
}
.OAUTH2:before {
content: "\e8d8";
}
@ -33,7 +249,7 @@
content: "\e8d4";
}
.a-itsm-knowledge2:before {
.itsm-knowledge2:before {
content: "\e8d2";
}

File diff suppressed because one or more lines are too long

View File

@ -5,6 +5,384 @@
"css_prefix_text": "",
"description": "",
"glyphs": [
{
"icon_id": "39729980",
"name": "Google Cloud Platform",
"font_class": "Google_Cloud_Platform",
"unicode": "e90b",
"unicode_decimal": 59659
},
{
"icon_id": "39729978",
"name": "Ctyun",
"font_class": "Ctyun",
"unicode": "e90c",
"unicode_decimal": 59660
},
{
"icon_id": "39729977",
"name": "Alibaba Cloud",
"font_class": "Alibaba_Cloud",
"unicode": "e90d",
"unicode_decimal": 59661
},
{
"icon_id": "39729976",
"name": "Azure",
"font_class": "Azure",
"unicode": "e90e",
"unicode_decimal": 59662
},
{
"icon_id": "39729985",
"name": "ZStack",
"font_class": "ZStack",
"unicode": "e904",
"unicode_decimal": 59652
},
{
"icon_id": "39729986",
"name": "Tencent Cloud",
"font_class": "Tencent_Cloud",
"unicode": "e905",
"unicode_decimal": 59653
},
{
"icon_id": "39729981",
"name": "Nutanix",
"font_class": "Nutanix",
"unicode": "e906",
"unicode_decimal": 59654
},
{
"icon_id": "39729983",
"name": "OpenStack",
"font_class": "OpenStack",
"unicode": "e907",
"unicode_decimal": 59655
},
{
"icon_id": "39729982",
"name": "Huawei Cloud",
"font_class": "Huawei_Cloud",
"unicode": "e908",
"unicode_decimal": 59656
},
{
"icon_id": "39729979",
"name": "Bytecloud",
"font_class": "Bytecloud",
"unicode": "e909",
"unicode_decimal": 59657
},
{
"icon_id": "39729984",
"name": "UCloud",
"font_class": "UCloud",
"unicode": "e90a",
"unicode_decimal": 59658
},
{
"icon_id": "39729988",
"name": "AWS",
"font_class": "AWS",
"unicode": "e901",
"unicode_decimal": 59649
},
{
"icon_id": "39729989",
"name": "ECloud",
"font_class": "ECloud",
"unicode": "e902",
"unicode_decimal": 59650
},
{
"icon_id": "39729987",
"name": "JDCloud",
"font_class": "JDCloud",
"unicode": "e903",
"unicode_decimal": 59651
},
{
"icon_id": "39713390",
"name": "veops-more",
"font_class": "veops-more",
"unicode": "e900",
"unicode_decimal": 59648
},
{
"icon_id": "39712276",
"name": "duose-date",
"font_class": "duose-date",
"unicode": "e8ff",
"unicode_decimal": 59647
},
{
"icon_id": "39712289",
"name": "duose-shishu",
"font_class": "duose-shishu",
"unicode": "e8fd",
"unicode_decimal": 59645
},
{
"icon_id": "39712286",
"name": "duose-wenben",
"font_class": "duose-wenben",
"unicode": "e8fe",
"unicode_decimal": 59646
},
{
"icon_id": "39712314",
"name": "duose-json",
"font_class": "duose-json",
"unicode": "e8f7",
"unicode_decimal": 59639
},
{
"icon_id": "39712315",
"name": "duose-fudianshu",
"font_class": "duose-fudianshu",
"unicode": "e8f8",
"unicode_decimal": 59640
},
{
"icon_id": "39712312",
"name": "duose-time",
"font_class": "duose-time",
"unicode": "e8f9",
"unicode_decimal": 59641
},
{
"icon_id": "39712313",
"name": "duose-password",
"font_class": "duose-password",
"unicode": "e8fa",
"unicode_decimal": 59642
},
{
"icon_id": "39712311",
"name": "duose-link",
"font_class": "duose-link",
"unicode": "e8fb",
"unicode_decimal": 59643
},
{
"icon_id": "39712310",
"name": "duose-datetime",
"font_class": "duose-datetime",
"unicode": "e8fc",
"unicode_decimal": 59644
},
{
"icon_id": "39705895",
"name": "veops-setting2",
"font_class": "veops-setting2",
"unicode": "e8f6",
"unicode_decimal": 59638
},
{
"icon_id": "39692404",
"name": "veops-search",
"font_class": "veops-search",
"unicode": "e8f5",
"unicode_decimal": 59637
},
{
"icon_id": "39680289",
"name": "veops-delete",
"font_class": "veops-delete",
"unicode": "e8f4",
"unicode_decimal": 59636
},
{
"icon_id": "39677378",
"name": "veops-refresh",
"font_class": "veops-refresh",
"unicode": "e8f3",
"unicode_decimal": 59635
},
{
"icon_id": "39677152",
"name": "veops-filter",
"font_class": "veops-filter",
"unicode": "e8f2",
"unicode_decimal": 59634
},
{
"icon_id": "39677216",
"name": "veops-reduce",
"font_class": "veops-reduce",
"unicode": "e8ed",
"unicode_decimal": 59629
},
{
"icon_id": "39677215",
"name": "veops-increase",
"font_class": "veops-increase",
"unicode": "e8ee",
"unicode_decimal": 59630
},
{
"icon_id": "39677211",
"name": "veops-configuration_table",
"font_class": "veops-configuration_table",
"unicode": "e8ef",
"unicode_decimal": 59631
},
{
"icon_id": "39677210",
"name": "veops-copy",
"font_class": "veops-copy",
"unicode": "e8f0",
"unicode_decimal": 59632
},
{
"icon_id": "39677207",
"name": "veops-save",
"font_class": "veops-save",
"unicode": "e8f1",
"unicode_decimal": 59633
},
{
"icon_id": "39664281",
"name": "veops-setting",
"font_class": "veops-setting",
"unicode": "e8ec",
"unicode_decimal": 59628
},
{
"icon_id": "39664295",
"name": "veops-default_avatar",
"font_class": "veops-default_avatar",
"unicode": "e8ea",
"unicode_decimal": 59626
},
{
"icon_id": "39664288",
"name": "veops-notice",
"font_class": "veops-notice",
"unicode": "e8eb",
"unicode_decimal": 59627
},
{
"icon_id": "39603135",
"name": "quickly_initiate",
"font_class": "itsm-quickStart",
"unicode": "e8e9",
"unicode_decimal": 59625
},
{
"icon_id": "39588554",
"name": "itsm-associated",
"font_class": "itsm-associatedWith",
"unicode": "e8e8",
"unicode_decimal": 59624
},
{
"icon_id": "39517726",
"name": "itsm-folder",
"font_class": "itsm-folder",
"unicode": "e8e7",
"unicode_decimal": 59623
},
{
"icon_id": "39517542",
"name": "report",
"font_class": "report",
"unicode": "e8e5",
"unicode_decimal": 59621
},
{
"icon_id": "39517539",
"name": "folder",
"font_class": "folder",
"unicode": "e8e6",
"unicode_decimal": 59622
},
{
"icon_id": "39123642",
"name": "itsm-refresh (1)",
"font_class": "itsm-refresh",
"unicode": "e8e4",
"unicode_decimal": 59620
},
{
"icon_id": "39123405",
"name": "itsm-add_table (1)",
"font_class": "itsm-add_table",
"unicode": "e8e2",
"unicode_decimal": 59618
},
{
"icon_id": "39123409",
"name": "itsm-delete_page",
"font_class": "itsm-delete_page",
"unicode": "e8e3",
"unicode_decimal": 59619
},
{
"icon_id": "39117681",
"name": "oneterm-secret_key",
"font_class": "oneterm-secret_key",
"unicode": "e8e0",
"unicode_decimal": 59616
},
{
"icon_id": "39117679",
"name": "oneterm-password",
"font_class": "oneterm-password",
"unicode": "e8e1",
"unicode_decimal": 59617
},
{
"icon_id": "39079529",
"name": "itsm-unprocessed",
"font_class": "itsm-sla_timeout_not_handled",
"unicode": "e8dd",
"unicode_decimal": 59613
},
{
"icon_id": "39079522",
"name": "itsm-not_timeout",
"font_class": "itsm-sla_not_timeout",
"unicode": "e8de",
"unicode_decimal": 59614
},
{
"icon_id": "39079520",
"name": "itsm-SLA",
"font_class": "itsm-SLA",
"unicode": "e8df",
"unicode_decimal": 59615
},
{
"icon_id": "39079538",
"name": "itsm-processed",
"font_class": "itsm-sla_timeout_handled",
"unicode": "e8dc",
"unicode_decimal": 59612
},
{
"icon_id": "39079519",
"name": "itsm-all_SLA",
"font_class": "itsm-sla_all",
"unicode": "e8da",
"unicode_decimal": 59610
},
{
"icon_id": "38970103",
"name": "itsm-generate_by_node_id",
"font_class": "itsm-generate_by_node_id",
"unicode": "e8db",
"unicode_decimal": 59611
},
{
"icon_id": "38806676",
"name": "cmdb-MySQL",
"font_class": "cmdb-MySQL",
"unicode": "e8d9",
"unicode_decimal": 59609
},
{
"icon_id": "38566548",
"name": "OAuth2.0",
@ -43,7 +421,7 @@
{
"icon_id": "38533133",
"name": "itsm-knowledge (2)",
"font_class": "a-itsm-knowledge2",
"font_class": "itsm-knowledge2",
"unicode": "e8d2",
"unicode_decimal": 59602
},
@ -1841,7 +2219,7 @@
},
{
"icon_id": "35341667",
"name": "caise-chajian ",
"name": "caise-chajian",
"font_class": "caise-chajian",
"unicode": "e7d2",
"unicode_decimal": 59346

Binary file not shown.

View File

@ -1,49 +1,121 @@
<template>
<span>
<ops-icon :type="getPropertyIcon(attr)" />
</span>
<vxe-table v-bind="$attrs" v-on="new$listeners" ref="xTable">
<slot></slot>
<template #empty>
<slot name="empty">
<div :style="{ paddingTop: '10px' }">
<img :style="{ width: '140px', height: '90px' }" :src="require('@/assets/data_empty.png')" />
<div>{{ $t('noData') }}</div>
</div>
</slot>
</template>
<template #loading>
<slot name="loading"></slot>
</template>
</vxe-table>
</template>
<script>
import _ from 'lodash'
// 该组件使用方法与vxe-table一致但调用它的方法时需先调用getVxetableRef()获取到vxe-table实体
export default {
name: 'ValueTypeIcon',
props: {
attr: {
type: Object,
default: () => {},
name: 'OpsTable',
data() {
return {
// isShifting: false,
// lastIndex: -1,
lastSelected: [],
currentSelected: [],
}
},
computed: {
new$listeners() {
if (!Object.keys(this.$listeners).length) {
return this.$listeners
}
return Object.assign(this.$listeners, {
// 在这里覆盖原有的change事件
// 'checkbox-change': this.selectChangeEvent,
'checkbox-range-change': this.checkboxRangeChange,
'checkbox-range-start': this.checkboxRangeStart,
'checkbox-range-end': this.checkboxRangeEnd,
})
},
},
mounted() {
// window.onkeydown = (e) => {
// if (e.key === 'Shift') {
// this.isShifting = true
// }
// }
// window.onkeyup = (e) => {
// if (e.key === 'Shift') {
// this.isShifting = false
// this.lastIndex = -1
// }
// }
},
beforeDestroy() {
// window.onkeydown = ''
// window.onkeyup = ''
},
methods: {
getPropertyIcon(attr) {
switch (attr.value_type) {
case '0':
return 'duose-shishu'
case '1':
return 'duose-fudianshu'
case '2':
if (attr.is_password) {
return 'duose-password'
}
if (attr.is_link) {
return 'duose-link'
}
return 'duose-wenben'
case '3':
return 'duose-datetime'
case '4':
return 'duose-date'
case '5':
return 'duose-time'
case '6':
return 'duose-json'
case '7':
return 'duose-password'
case '8':
return 'duose-link'
getVxetableRef() {
return this.$refs.xTable
},
// selectChangeEvent(e) {
// const xTable = this.$refs.xTable
// const { lastIndex } = this
// const currentIndex = e.rowIndex
// const { tableData } = xTable.getTableData()
// if (lastIndex > -1 && this.isShifting) {
// let start = lastIndex
// let end = currentIndex
// if (lastIndex > currentIndex) {
// start = currentIndex
// end = lastIndex
// }
// const rangeData = tableData.slice(start, end + 1)
// xTable.setCheckboxRow(rangeData, true)
// }
// this.lastIndex = currentIndex
// this.$emit('checkbox-change', { ...e, records: xTable.getCheckboxRecords() })
// },
checkboxRangeStart(e) {
const xTable = this.$refs.xTable
const lastSelected = xTable.getCheckboxRecords()
const selectedReserve = xTable.getCheckboxReserveRecords()
this.lastSelected = [...lastSelected, ...selectedReserve]
this.$emit('checkbox-range-start', e)
},
checkboxRangeChange(e) {
const xTable = this.$refs.xTable
xTable.setCheckboxRow(this.lastSelected, true)
this.currentSelected = e.records
// this.lastSelected = [...new Set([...this.lastSelected, ...e.records])]
this.$emit('checkbox-range-change', {
...e,
records: [...xTable.getCheckboxRecords(), ...xTable.getCheckboxReserveRecords()],
})
},
checkboxRangeEnd(e) {
const xTable = this.$refs.xTable
const isAllSelected = this.currentSelected.every((item) => {
const _idx = this.lastSelected.findIndex((ele) => _.isEqual(ele, item))
return _idx > -1
})
if (isAllSelected) {
xTable.setCheckboxRow(this.currentSelected, false)
}
this.currentSelected = []
this.lastSelected = []
this.$emit('checkbox-range-end', {
...e,
records: [...xTable.getCheckboxRecords(), ...xTable.getCheckboxReserveRecords()],
})
},
},
}
</script>
<style></style>
<style lang="less"></style>