mirror of
https://github.com/veops/cmdb.git
synced 2025-08-11 19:20:30 +08:00
支持上传自定义图标
This commit is contained in:
wang-liang0615
@@ -124,12 +124,21 @@
|
||||
:key="'edit_' + col.field + idx"
|
||||
v-for="(choice, idx) in col.filters"
|
||||
>
|
||||
<span :style="choice[1] ? choice[1].style || {} : {}">
|
||||
<ops-icon
|
||||
:style="{ color: choice[1].icon.color }"
|
||||
v-if="choice[1] && choice[1].icon && choice[1].icon.name"
|
||||
:type="choice[1].icon.name"
|
||||
/>
|
||||
<span
|
||||
:style="{ ...(choice[1] ? choice[1].style : {}), display: 'inline-flex', alignItems: 'center' }"
|
||||
>
|
||||
<template v-if="choice[1] && choice[1].icon && choice[1].icon.name">
|
||||
<img
|
||||
v-if="choice[1].icon.id && choice[1].icon.url"
|
||||
:src="`/api/common-setting/v1/file/${choice[1].icon.url}`"
|
||||
:style="{ maxHeight: '13px', maxWidth: '13px', marginRight: '5px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
v-else
|
||||
:style="{ color: choice[1].icon.color, marginRight: '5px' }"
|
||||
:type="choice[1].icon.name"
|
||||
/>
|
||||
</template>
|
||||
{{ choice[0] }}
|
||||
</span>
|
||||
</a-select-option>
|
||||
@@ -152,10 +161,18 @@
|
||||
padding: '1px 5px',
|
||||
margin: '2px',
|
||||
...getChoiceValueStyle(col, value),
|
||||
display: 'inline-flex',
|
||||
alignItems: 'center',
|
||||
}"
|
||||
>
|
||||
<img
|
||||
v-if="getChoiceValueIcon(col, value).id && getChoiceValueIcon(col, value).url"
|
||||
:src="`/api/common-setting/v1/file/${getChoiceValueIcon(col, value).url}`"
|
||||
:style="{ maxHeight: '13px', maxWidth: '13px', marginRight: '5px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
:style="{ color: getChoiceValueIcon(col, value).color }"
|
||||
v-else
|
||||
:style="{ color: getChoiceValueIcon(col, value).color, marginRight: '5px' }"
|
||||
:type="getChoiceValueIcon(col, value).name"
|
||||
/>{{ value }}
|
||||
</span>
|
||||
@@ -167,10 +184,18 @@
|
||||
padding: '1px 5px',
|
||||
margin: '2px 0',
|
||||
...getChoiceValueStyle(col, row[col.field]),
|
||||
display: 'inline-flex',
|
||||
alignItems: 'center',
|
||||
}"
|
||||
>
|
||||
<img
|
||||
v-if="getChoiceValueIcon(col, row[col.field]).id && getChoiceValueIcon(col, row[col.field]).url"
|
||||
:src="`/api/common-setting/v1/file/${getChoiceValueIcon(col, row[col.field]).url}`"
|
||||
:style="{ maxHeight: '13px', maxWidth: '13px', marginRight: '5px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
:style="{ color: getChoiceValueIcon(col, row[col.field]).color }"
|
||||
v-else
|
||||
:style="{ color: getChoiceValueIcon(col, row[col.field]).color, marginRight: '5px' }"
|
||||
:type="getChoiceValueIcon(col, row[col.field]).name"
|
||||
/>
|
||||
{{ row[col.field] }}</span
|
||||
|
||||
@@ -29,11 +29,14 @@
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.icon {
|
||||
.icon,
|
||||
img {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
left: 6px;
|
||||
}
|
||||
.icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
@@ -15,7 +15,11 @@ class BaseNode extends TreeNode {
|
||||
.attr('id', opts.id)
|
||||
let icon
|
||||
if (opts.options.icon) {
|
||||
icon = $(`<svg class="icon" style="color:${opts.options.icon.split('$$')[1]}" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><use data-v-5bd421da="" xlink:href="#${opts.options.icon.split('$$')[0]}"></use></svg>`)
|
||||
if (opts.options.icon.split('$$')[2]) {
|
||||
icon = $(`<img style="max-width:16px;max-height:16px;" src="/api/common-setting/v1/file/${opts.options.icon.split('$$')[3]}" />`)
|
||||
} else {
|
||||
icon = $(`<svg class="icon" style="color:${opts.options.icon.split('$$')[1]}" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><use data-v-5bd421da="" xlink:href="#${opts.options.icon.split('$$')[0]}"></use></svg>`)
|
||||
}
|
||||
} else {
|
||||
icon = $(`<span class="icon icon-default">${opts.options.name[0].toUpperCase()}</span>`)
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<a-form :form="form">
|
||||
<a-divider style="font-size:14px;margin:14px 0;font-weight:700;">{{ group.name || '其他' }}</a-divider>
|
||||
<a-divider style="font-size: 14px; margin: 14px 0; font-weight: 700">{{ group.name || '其他' }}</a-divider>
|
||||
<a-row :gutter="24" align="top" type="flex">
|
||||
<a-col
|
||||
:span="12"
|
||||
@@ -37,12 +37,19 @@
|
||||
:key="'New_' + attr.name + choice_idx"
|
||||
v-for="(choice, choice_idx) in attr.choice_value"
|
||||
>
|
||||
<span :style="choice[1] ? choice[1].style || {} : {}">
|
||||
<ops-icon
|
||||
:style="{ color: choice[1].icon.color }"
|
||||
v-if="choice[1] && choice[1].icon && choice[1].icon.name"
|
||||
:type="choice[1].icon.name"
|
||||
/>
|
||||
<span :style="{ ...(choice[1] ? choice[1].style : {}), display: 'inline-flex', alignItems: 'center' }">
|
||||
<template v-if="choice[1] && choice[1].icon && choice[1].icon.name">
|
||||
<img
|
||||
v-if="choice[1].icon.id && choice[1].icon.url"
|
||||
:src="`/api/common-setting/v1/file/${choice[1].icon.url}`"
|
||||
:style="{ maxHeight: '13px', maxWidth: '13px', marginRight: '5px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
v-else
|
||||
:style="{ color: choice[1].icon.color, marginRight: '5px' }"
|
||||
:type="choice[1].icon.name"
|
||||
/>
|
||||
</template>
|
||||
{{ choice[0] }}
|
||||
</span>
|
||||
</a-select-option>
|
||||
|
||||
@@ -113,14 +113,20 @@
|
||||
style="width: 17px; height: 17px; display: none; position: absolute; left: 15px; top: 5px"
|
||||
/>
|
||||
<span class="ci-types-left-detail-icon">
|
||||
<ops-icon
|
||||
:style="{
|
||||
color: ci.icon.split('$$')[1],
|
||||
fontSize: '14px',
|
||||
}"
|
||||
v-if="ci.icon"
|
||||
:type="ci.icon.split('$$')[0]"
|
||||
/>
|
||||
<template v-if="ci.icon">
|
||||
<img
|
||||
v-if="ci.icon.split('$$')[2]"
|
||||
:src="`/api/common-setting/v1/file/${ci.icon.split('$$')[3]}`"
|
||||
/>
|
||||
<ops-icon
|
||||
v-else
|
||||
:style="{
|
||||
color: ci.icon.split('$$')[1],
|
||||
fontSize: '14px',
|
||||
}"
|
||||
:type="ci.icon.split('$$')[0]"
|
||||
/>
|
||||
</template>
|
||||
<span :style="{ color: '#2f54eb' }" v-else>{{ ci.name[0].toUpperCase() }}</span>
|
||||
</span>
|
||||
</div>
|
||||
@@ -204,7 +210,7 @@
|
||||
:label="item.alias || item.name"
|
||||
>
|
||||
<span> {{ item.alias || item.name }}</span>
|
||||
<span :title="item.name" style="font-size: 10px; color: #afafaf"> {{ item.name }}</span>
|
||||
<span :title="item.name" style="font-size:10px;color:#afafaf;"> {{ item.name }}</span>
|
||||
</el-option>
|
||||
<a-divider :style="{ margin: '5px 0' }" />
|
||||
<div :style="{ textAlign: 'right' }">
|
||||
@@ -235,7 +241,7 @@
|
||||
:label="item.alias || item.name"
|
||||
>
|
||||
<span> {{ item.alias || item.name }}</span>
|
||||
<span :title="item.name" style="font-size: 10px; color: #afafaf"> {{ item.name }}</span>
|
||||
<span :title="item.name" style="font-size:10px;color:#afafaf;"> {{ item.name }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<a-divider type="vertical" />
|
||||
@@ -533,21 +539,20 @@ export default {
|
||||
e.preventDefault()
|
||||
this.form.validateFields(async (err, values) => {
|
||||
if (!err) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log('Received values of form: ', values)
|
||||
const icon = this.$refs.iconArea.getIcon()
|
||||
this.loading = true
|
||||
if (values.default_order_attr && this.default_order_asc === '2') {
|
||||
values.default_order_attr = `-${values.default_order_attr}`
|
||||
}
|
||||
const _icon = this.$refs.iconArea.getIcon()
|
||||
const icon =
|
||||
_icon && _icon.name ? `${_icon.name}$$${_icon.color || ''}$$${_icon.id || ''}$$${_icon.url || ''}` : ''
|
||||
if (values.id) {
|
||||
await this.updateCIType(values.id, {
|
||||
...values,
|
||||
icon: icon && icon.name ? `${icon.name}$$${icon.color || ''}` : '',
|
||||
icon,
|
||||
})
|
||||
} else {
|
||||
await this.createCIType({ ...values, icon: icon && icon.name ? `${icon.name}$$${icon.color || ''}` : '' })
|
||||
// todo 把改ci 类型绑定在当前group下
|
||||
await this.createCIType({ ...values, icon })
|
||||
}
|
||||
}
|
||||
})
|
||||
@@ -731,6 +736,8 @@ export default {
|
||||
? {
|
||||
name: record.icon.split('$$')[0] || '',
|
||||
color: record.icon.split('$$')[1] || '',
|
||||
id: record.icon.split('$$')[2] ? Number(record.icon.split('$$')[2]) : null,
|
||||
url: record.icon.split('$$')[3] || '',
|
||||
}
|
||||
: {}
|
||||
)
|
||||
@@ -828,7 +835,7 @@ export default {
|
||||
margin-left: auto;
|
||||
}
|
||||
.ci-types-left-detail-icon {
|
||||
display: inline-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 20px;
|
||||
@@ -837,6 +844,10 @@ export default {
|
||||
box-shadow: 0px 1px 2px rgba(47, 84, 235, 0.2);
|
||||
margin-right: 6px;
|
||||
background-color: #fff;
|
||||
img {
|
||||
max-height: 20px;
|
||||
max-width: 20px;
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
background-color: #e1efff;
|
||||
|
||||
@@ -102,8 +102,17 @@
|
||||
"
|
||||
>
|
||||
<span :style="{ cursor: disabled ? 'default' : 'move' }">
|
||||
<ops-icon v-if="icon.name" :type="icon.name" :style="{ color: icon.color || '#595959' }" />
|
||||
{{ item[0] }}
|
||||
<img
|
||||
v-if="icon.id && icon.url"
|
||||
:src="`/api/common-setting/v1/file/${icon.url}`"
|
||||
:style="{ maxHeight: '12px', maxWidth: '12px', marginRight: '5px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
v-else-if="icon.name"
|
||||
:type="icon.name"
|
||||
:style="{ marginRight: '5px', color: icon.color || '#595959' }"
|
||||
/>
|
||||
<span>{{ item[0] }}</span>
|
||||
</span>
|
||||
<a
|
||||
class="pre-value-tag-dropdown"
|
||||
@@ -240,6 +249,10 @@ export default {
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
position: relative;
|
||||
> span {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
&:hover .pre-value-tag-dropdown-icon {
|
||||
display: inline !important;
|
||||
}
|
||||
|
||||
@@ -10,7 +10,12 @@
|
||||
<div class="discovery-bottom"></div>
|
||||
<div class="discovery-top">
|
||||
<div class="discovery-header">
|
||||
<ops-icon :type="icon.name || 'caise-chajian'" :style="{ fontSize: '30px', color: icon.color }"></ops-icon>
|
||||
<img
|
||||
v-if="icon.id && icon.url"
|
||||
:src="`/api/common-setting/v1/file/${icon.url}`"
|
||||
:style="{ maxHeight: '30px', maxWidth: '30px' }"
|
||||
/>
|
||||
<ops-icon v-else :type="icon.name || 'caise-chajian'" :style="{ fontSize: '30px', color: icon.color }" />
|
||||
<span :title="rule.name">{{ rule.name }}</span>
|
||||
</div>
|
||||
<template v-if="!isSelected">
|
||||
|
||||
@@ -13,14 +13,17 @@
|
||||
@click="clickSidebar(type.id)"
|
||||
>
|
||||
<span class="cmdb-adc-side-icon">
|
||||
<ops-icon
|
||||
:style="{
|
||||
color: type.icon.split('$$')[1],
|
||||
fontSize: '14px',
|
||||
}"
|
||||
v-if="type.icon"
|
||||
:type="type.icon.split('$$')[0]"
|
||||
/>
|
||||
<template v-if="type.icon">
|
||||
<img v-if="type.icon.split('$$')[2]" :src="`/api/common-setting/v1/file/${type.icon.split('$$')[3]}`" />
|
||||
<ops-icon
|
||||
v-else
|
||||
:style="{
|
||||
color: type.icon.split('$$')[1],
|
||||
fontSize: '14px',
|
||||
}"
|
||||
:type="type.icon.split('$$')[0]"
|
||||
/>
|
||||
</template>
|
||||
<span :style="{ color: '#2f54eb' }" v-else>{{ type.name[0].toUpperCase() }}</span>
|
||||
</span>
|
||||
<span :title="type.alias || type.name" class="cmdb-adc-side-name">{{ type.alias || type.name }}</span>
|
||||
@@ -57,7 +60,7 @@
|
||||
@checkbox-change="onSelectChange"
|
||||
@checkbox-all="onSelectChange"
|
||||
@checkbox-range-end="onSelectChange"
|
||||
:checkbox-config="{reserve: true, highlight: true, range: true}"
|
||||
:checkbox-config="{ reserve: true, highlight: true, range: true }"
|
||||
:sort-config="{ remote: false, trigger: 'cell' }"
|
||||
>
|
||||
<vxe-column align="center" type="checkbox" width="60"></vxe-column>
|
||||
@@ -316,7 +319,7 @@ export default {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.cmdb-adc-side-icon {
|
||||
display: inline-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 20px;
|
||||
@@ -325,6 +328,10 @@ export default {
|
||||
box-shadow: 0px 1px 2px rgba(47, 84, 235, 0.2);
|
||||
margin-right: 6px;
|
||||
background-color: #fff;
|
||||
img {
|
||||
max-height: 20px;
|
||||
max-width: 20px;
|
||||
}
|
||||
}
|
||||
.cmdb-adc-side-name {
|
||||
display: inline-block;
|
||||
|
||||
@@ -47,15 +47,21 @@
|
||||
}"
|
||||
:style="{ width: '30px', height: '30px', marginRight: '10px' }"
|
||||
>
|
||||
<ops-icon
|
||||
v-if="ciType.icon"
|
||||
:style="{
|
||||
overflow: 'hidden',
|
||||
color: ciType.icon.split('$$')[1] || '',
|
||||
fontSize: '26px',
|
||||
}"
|
||||
:type="ciType.icon.split('$$')[0]"
|
||||
/>
|
||||
<template v-if="ciType.icon">
|
||||
<img
|
||||
v-if="ciType.icon.split('$$')[2]"
|
||||
:src="`/api/common-setting/v1/file/${ciType.icon.split('$$')[3]}`"
|
||||
:style="{ maxHeight: '30px', maxWidth: '30px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
v-else
|
||||
:style="{
|
||||
color: ciType.icon.split('$$')[1],
|
||||
fontSize: '14px',
|
||||
}"
|
||||
:type="ciType.icon.split('$$')[0]"
|
||||
/>
|
||||
</template>
|
||||
<span v-else :style="{ fontSize: '20px' }">{{ ciType.name[0].toUpperCase() }}</span>
|
||||
</div>
|
||||
<span class="cmdb-preference-group-content-title">{{ ciType.alias || ciType.name }}</span>
|
||||
@@ -96,11 +102,21 @@
|
||||
'cmdb-preference-avatar-noicon-is_subscribed': !item.icon && item.is_subscribed,
|
||||
}"
|
||||
>
|
||||
<ops-icon
|
||||
v-if="item.icon"
|
||||
:style="{ overflow: 'hidden', color: item.icon.split('$$')[1] || '', fontSize: '32px' }"
|
||||
:type="item.icon.split('$$')[0]"
|
||||
/>
|
||||
<template v-if="item.icon">
|
||||
<img
|
||||
v-if="item.icon.split('$$')[2]"
|
||||
:src="`/api/common-setting/v1/file/${item.icon.split('$$')[3]}`"
|
||||
:style="{ maxHeight: '30px', maxWidth: '30px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
v-else
|
||||
:style="{
|
||||
color: item.icon.split('$$')[1],
|
||||
fontSize: '14px',
|
||||
}"
|
||||
:type="item.icon.split('$$')[0]"
|
||||
/>
|
||||
</template>
|
||||
<span v-else>{{ item.name[0].toUpperCase() }}</span>
|
||||
</div>
|
||||
<span class="cmdb-preference-title" :title="item.alias || item.name">
|
||||
@@ -536,7 +552,7 @@ export default {
|
||||
}
|
||||
|
||||
.cmdb-preference-avatar {
|
||||
display: inline-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 40px;
|
||||
|
||||
@@ -152,12 +152,21 @@
|
||||
:key="'edit_' + col.field + idx"
|
||||
v-for="(choice, idx) in col.filters"
|
||||
>
|
||||
<span :style="choice[1] ? choice[1].style || {} : {}">
|
||||
<ops-icon
|
||||
:style="{ color: choice[1].icon.color }"
|
||||
v-if="choice[1] && choice[1].icon && choice[1].icon.name"
|
||||
:type="choice[1].icon.name"
|
||||
/>
|
||||
<span
|
||||
:style="{ ...(choice[1] ? choice[1].style : {}), display: 'inline-flex', alignItems: 'center' }"
|
||||
>
|
||||
<template v-if="choice[1] && choice[1].icon && choice[1].icon.name">
|
||||
<img
|
||||
v-if="choice[1].icon.id && choice[1].icon.url"
|
||||
:src="`/api/common-setting/v1/file/${choice[1].icon.url}`"
|
||||
:style="{ maxHeight: '13px', maxWidth: '13px', marginRight: '5px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
v-else
|
||||
:style="{ color: choice[1].icon.color, marginRight: '5px' }"
|
||||
:type="choice[1].icon.name"
|
||||
/>
|
||||
</template>
|
||||
{{ choice[0] }}
|
||||
</span>
|
||||
</a-select-option>
|
||||
@@ -165,7 +174,7 @@
|
||||
</template>
|
||||
<template
|
||||
v-if="col.value_type === '6' || col.is_link || col.is_password || col.is_choice"
|
||||
#default="{ row }"
|
||||
#default="{row}"
|
||||
>
|
||||
<span v-if="col.value_type === '6' && row[col.field]">{{ row[col.field] }}</span>
|
||||
<a v-else-if="col.is_link" :href="`${row[col.field]}`" target="_blank">{{ row[col.field] }}</a>
|
||||
@@ -183,11 +192,20 @@
|
||||
padding: '1px 5px',
|
||||
margin: '2px',
|
||||
...getChoiceValueStyle(col, value),
|
||||
display: 'inline-flex',
|
||||
alignItems: 'center',
|
||||
}"
|
||||
><ops-icon
|
||||
:style="{ color: getChoiceValueIcon(col, value).color }"
|
||||
:type="getChoiceValueIcon(col, value).name"
|
||||
/>{{ value }}</span
|
||||
>
|
||||
<img
|
||||
v-if="getChoiceValueIcon(col, value).id && getChoiceValueIcon(col, value).url"
|
||||
:src="`/api/common-setting/v1/file/${getChoiceValueIcon(col, value).url}`"
|
||||
:style="{ maxHeight: '13px', maxWidth: '13px', marginRight: '5px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
v-else
|
||||
:style="{ color: getChoiceValueIcon(col, value).color, marginRight: '5px' }"
|
||||
:type="getChoiceValueIcon(col, value).name"
|
||||
/>{{ value }}</span
|
||||
>
|
||||
</template>
|
||||
<span
|
||||
@@ -197,10 +215,18 @@
|
||||
padding: '1px 5px',
|
||||
margin: '2px 0',
|
||||
...getChoiceValueStyle(col, row[col.field]),
|
||||
display: 'inline-flex',
|
||||
alignItems: 'center',
|
||||
}"
|
||||
>
|
||||
<img
|
||||
v-if="getChoiceValueIcon(col, row[col.field]).id && getChoiceValueIcon(col, row[col.field]).url"
|
||||
:src="`/api/common-setting/v1/file/${getChoiceValueIcon(col, row[col.field]).url}`"
|
||||
:style="{ maxHeight: '13px', maxWidth: '13px', marginRight: '5px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
:style="{ color: getChoiceValueIcon(col, row[col.field]).color }"
|
||||
v-else
|
||||
:style="{ color: getChoiceValueIcon(col, row[col.field]).color, marginRight: '5px' }"
|
||||
:type="getChoiceValueIcon(col, row[col.field]).name"
|
||||
/>{{ row[col.field] }}</span
|
||||
>
|
||||
@@ -433,11 +459,11 @@ export default {
|
||||
},
|
||||
inject: ['reload'],
|
||||
watch: {
|
||||
'$route.path': function (newPath, oldPath) {
|
||||
'$route.path': function(newPath, oldPath) {
|
||||
this.viewId = this.$route.params.viewId
|
||||
this.reload()
|
||||
},
|
||||
pageNo: function (newPage, oldPage) {
|
||||
pageNo: function(newPage, oldPage) {
|
||||
this.loadData({ pageNo: newPage }, undefined, this.sortByTable)
|
||||
},
|
||||
},
|
||||
|
||||
@@ -15,14 +15,29 @@
|
||||
>
|
||||
<span
|
||||
:style="{
|
||||
display: 'inline-block',
|
||||
display: 'flex',
|
||||
overflow: 'hidden',
|
||||
width: '100%',
|
||||
textOverflow: 'ellipsis',
|
||||
whiteSpace: 'nowrap',
|
||||
alignItems: 'center',
|
||||
}"
|
||||
>
|
||||
<ops-icon :style="{ color: icon.split('$$')[1] }" v-if="icon" :type="icon.split('$$')[0]" />
|
||||
<template v-if="icon">
|
||||
<img
|
||||
v-if="icon.split('$$')[2]"
|
||||
:src="`/api/common-setting/v1/file/${icon.split('$$')[3]}`"
|
||||
:style="{ maxHeight: '14px', maxWidth: '14px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
v-else
|
||||
:style="{
|
||||
color: icon.split('$$')[1],
|
||||
fontSize: '14px',
|
||||
}"
|
||||
:type="icon.split('$$')[0]"
|
||||
/>
|
||||
</template>
|
||||
<span
|
||||
:style="{
|
||||
display: 'inline-block',
|
||||
@@ -38,7 +53,7 @@
|
||||
v-else
|
||||
>{{ ciTypeName ? ciTypeName[0].toUpperCase() : 'i' }}</span
|
||||
>
|
||||
{{ this.title }}
|
||||
<span :style="{ marginLeft: '5px' }">{{ this.title }}</span>
|
||||
</span>
|
||||
<a-icon :style="{ fontSize: '10px' }" v-if="childLength && !isLeaf" :type="switchIcon"></a-icon>
|
||||
</div>
|
||||
|
||||
@@ -63,14 +63,21 @@
|
||||
}"
|
||||
>
|
||||
<span class="tree-views-left-header-icon">
|
||||
<ops-icon
|
||||
:style="{
|
||||
color: ciType.icon.split('$$')[1],
|
||||
fontSize: '14px',
|
||||
}"
|
||||
v-if="ciType.icon"
|
||||
:type="ciType.icon.split('$$')[0]"
|
||||
/>
|
||||
<template v-if="ciType.icon">
|
||||
<img
|
||||
v-if="ciType.icon.split('$$')[2]"
|
||||
:src="`/api/common-setting/v1/file/${ciType.icon.split('$$')[3]}`"
|
||||
:style="{ maxHeight: '14px', maxWidth: '14px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
v-else
|
||||
:style="{
|
||||
color: ciType.icon.split('$$')[1],
|
||||
fontSize: '14px',
|
||||
}"
|
||||
:type="ciType.icon.split('$$')[0]"
|
||||
/>
|
||||
</template>
|
||||
<span :style="{ color: '#2f54eb' }" v-else>{{ ciType.name[0].toUpperCase() }}</span>
|
||||
</span>
|
||||
<span class="tree-views-left-header-name">{{ ciType.alias || ciType.name }}</span>
|
||||
@@ -203,12 +210,21 @@
|
||||
:key="'edit_' + col.field + idx"
|
||||
v-for="(choice, idx) in col.filters"
|
||||
>
|
||||
<span :style="choice[1] ? choice[1].style || {} : {}">
|
||||
<ops-icon
|
||||
:style="{ color: choice[1].icon.color }"
|
||||
v-if="choice[1] && choice[1].icon && choice[1].icon.name"
|
||||
:type="choice[1].icon.name"
|
||||
/>
|
||||
<span
|
||||
:style="{ ...(choice[1] ? choice[1].style : {}), display: 'inline-flex', alignItems: 'center' }"
|
||||
>
|
||||
<template v-if="choice[1] && choice[1].icon && choice[1].icon.name">
|
||||
<img
|
||||
v-if="choice[1].icon.id && choice[1].icon.url"
|
||||
:src="`/api/common-setting/v1/file/${choice[1].icon.url}`"
|
||||
:style="{ maxHeight: '13px', maxWidth: '13px', marginRight: '5px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
v-else
|
||||
:style="{ color: choice[1].icon.color, marginRight: '5px' }"
|
||||
:type="choice[1].icon.name"
|
||||
/>
|
||||
</template>
|
||||
{{ choice[0] }}
|
||||
</span>
|
||||
</a-select-option>
|
||||
@@ -234,11 +250,20 @@
|
||||
padding: '1px 5px',
|
||||
margin: '2px',
|
||||
...getChoiceValueStyle(col, value),
|
||||
display: 'inline-flex',
|
||||
alignItems: 'center',
|
||||
}"
|
||||
><ops-icon
|
||||
:style="{ color: getChoiceValueIcon(col, value).color }"
|
||||
:type="getChoiceValueIcon(col, value).name"
|
||||
/>{{ value }}</span
|
||||
>
|
||||
<img
|
||||
v-if="getChoiceValueIcon(col, value).id && getChoiceValueIcon(col, value).url"
|
||||
:src="`/api/common-setting/v1/file/${getChoiceValueIcon(col, value).url}`"
|
||||
:style="{ maxHeight: '13px', maxWidth: '13px', marginRight: '5px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
v-else
|
||||
:style="{ color: getChoiceValueIcon(col, value).color, marginRight: '5px' }"
|
||||
:type="getChoiceValueIcon(col, value).name"
|
||||
/>{{ value }}</span
|
||||
>
|
||||
</template>
|
||||
<span
|
||||
@@ -248,10 +273,18 @@
|
||||
padding: '1px 5px',
|
||||
margin: '2px 0',
|
||||
...getChoiceValueStyle(col, row[col.field]),
|
||||
display: 'inline-flex',
|
||||
alignItems: 'center',
|
||||
}"
|
||||
>
|
||||
<img
|
||||
v-if="getChoiceValueIcon(col, row[col.field]).id && getChoiceValueIcon(col, row[col.field]).url"
|
||||
:src="`/api/common-setting/v1/file/${getChoiceValueIcon(col, row[col.field]).url}`"
|
||||
:style="{ maxHeight: '13px', maxWidth: '13px', marginRight: '5px' }"
|
||||
/>
|
||||
<ops-icon
|
||||
:style="{ color: getChoiceValueIcon(col, row[col.field]).color }"
|
||||
v-else
|
||||
:style="{ color: getChoiceValueIcon(col, row[col.field]).color, marginRight: '5px' }"
|
||||
:type="getChoiceValueIcon(col, row[col.field]).name"
|
||||
/>{{ row[col.field] }}</span
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user