mirror of
https://github.com/dataease/dataease.git
synced 2026-05-15 13:32:18 +08:00
refactor: 发布样式调整
This commit is contained in:
@@ -1,3 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M3.33333 5.33398V13.334H10V5.33398H3.33333ZM11.3333 4.66732V14.0747C11.3333 14.402 11.0548 14.6673 10.7111 14.6673H2.62222C2.27858 14.6673 2 14.402 2 14.0747V4.59324C2 4.26596 2.27858 4.00065 2.62222 4.00065H10.6667C11.0349 4.00065 11.3333 4.29913 11.3333 4.66732ZM13.8047 1.52925C13.9254 1.64989 14 1.81656 14 2.00065V10.334C14 10.5181 13.8508 10.6673 13.6667 10.6673H13C12.8159 10.6673 12.6667 10.5181 12.6667 10.334V2.66732H6.33333C6.14924 2.66732 6 2.51808 6 2.33398V1.66732C6 1.48322 6.14924 1.33398 6.33333 1.33398H13.3333C13.5174 1.33398 13.6841 1.4086 13.8047 1.52925Z" fill="#646A73"/>
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M3.33333 5.33398V13.334H10V5.33398H3.33333ZM11.3333 4.66732V14.0747C11.3333 14.402 11.0548 14.6673 10.7111 14.6673H2.62222C2.27858 14.6673 2 14.402 2 14.0747V4.59324C2 4.26596 2.27858 4.00065 2.62222 4.00065H10.6667C11.0349 4.00065 11.3333 4.29913 11.3333 4.66732ZM13.8047 1.52925C13.9254 1.64989 14 1.81656 14 2.00065V10.334C14 10.5181 13.8508 10.6673 13.6667 10.6673H13C12.8159 10.6673 12.6667 10.5181 12.6667 10.334V2.66732H6.33333C6.14924 2.66732 6 2.51808 6 2.33398V1.66732C6 1.48322 6.14924 1.33398 6.33333 1.33398H13.3333C13.5174 1.33398 13.6841 1.4086 13.8047 1.52925Z" />
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 707 B After Width: | Height: | Size: 682 B |
@@ -0,0 +1,4 @@
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0 3C0 1.34315 1.59845 0 3.57025 0H14.4298C16.4015 0 18 1.34315 18 3V15C18 16.6569 16.4015 18 14.4298 18H3.57025C1.59845 18 0 16.6569 0 15V3Z" fill="#BBBFC4"/>
|
||||
<path d="M4.25 13V8.77273C4.25 8.48403 4.48985 8.25 4.78571 8.25H7V4.52632C7 4.23564 7.25584 4 7.57143 4H10.4286C10.7442 4 11 4.23564 11 4.52632V7H13.2143C13.5102 7 13.75 7.22386 13.75 7.5V13H14C14.1381 13 14.25 13.1119 14.25 13.25V13.75C14.25 13.8881 14.1381 14 14 14H4C3.86193 14 3.75 13.8881 3.75 13.75V13.25C3.75 13.1119 3.86193 13 4 13H4.25ZM12.75 13V8H11V13H12.75ZM10 13V5H8V13H10ZM7 13V9.25H5.25V13H7Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 697 B |
@@ -0,0 +1,7 @@
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0 3C0 1.34315 1.46525 0 3.27273 0H14.7273C16.5347 0 18 1.34315 18 3V15C18 16.6569 16.5347 18 14.7273 18H3.27273C1.46525 18 0 16.6569 0 15V3Z" fill="#BBBFC4"/>
|
||||
<path opacity="0.6" fill-rule="evenodd" clip-rule="evenodd" d="M3.75 13.5V8.77273C3.75 8.48403 3.98985 8.25 4.28571 8.25H6.5V4.02632C6.5 3.73564 6.75584 3.5 7.07143 3.5H9.92857C10.2442 3.5 10.5 3.73564 10.5 4.02632V5.15039H9.5V4.5H7.5V13.5V14.5H3.5C3.36193 14.5 3.25 14.3881 3.25 14.25V13.75C3.25 13.6119 3.36193 13.5 3.5 13.5H3.75ZM6.5 13.5V9.25H4.75V13.5H6.5Z" fill="white"/>
|
||||
<rect x="8.5" y="6" width="5.5" height="8.5" fill="#00D6B9"/>
|
||||
<path d="M11.3043 12.9348C11.7606 12.9348 12.1304 12.5649 12.1304 12.1087C12.1304 11.6525 11.7606 11.2826 11.3043 11.2826C10.8481 11.2826 10.4783 11.6525 10.4783 12.1087C10.4783 12.5649 10.8481 12.9348 11.3043 12.9348Z" fill="white"/>
|
||||
<path d="M8.41304 5.5C8.18492 5.5 8 5.68492 8 5.91304V14.587C8 14.8151 8.18492 15 8.41304 15H14.1957C14.4238 15 14.6087 14.8151 14.6087 14.587V5.91304C14.6087 5.68492 14.4238 5.5 14.1957 5.5H8.41304ZM9.23913 6.73913H10.0652V7.15217C10.0652 7.38029 10.2501 7.56522 10.4783 7.56522H12.1304C12.3586 7.56522 12.5435 7.38029 12.5435 7.15217V6.73913H13.3696V13.7609H9.23913V6.73913Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
@@ -1,3 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8.66634 4.00065C8.66634 4.25739 8.70262 4.50565 8.77034 4.7406L5.88342 6.4465C5.401 5.96502 4.7351 5.66732 3.99967 5.66732C2.52692 5.66732 1.33301 6.86123 1.33301 8.33398C1.33301 9.80674 2.52692 11.0007 3.99967 11.0007C4.81776 11.0007 5.5498 10.6323 6.03896 10.0523L9.71633 11.8175C9.68353 11.9846 9.66634 12.1573 9.66634 12.334C9.66634 13.8067 10.8602 15.0007 12.333 15.0007C13.8058 15.0007 14.9997 13.8067 14.9997 12.334C14.9997 10.8612 13.8058 9.66732 12.333 9.66732C11.5149 9.66732 10.7829 10.0357 10.2937 10.6156L6.61635 8.8505C6.64915 8.6834 6.66634 8.5107 6.66634 8.33398C6.66634 8.07725 6.63006 7.82898 6.56234 7.59404L9.44926 5.88814C9.93168 6.36961 10.5976 6.66732 11.333 6.66732C12.8058 6.66732 13.9997 5.47341 13.9997 4.00065C13.9997 2.52789 12.8058 1.33398 11.333 1.33398C9.86025 1.33398 8.66634 2.52789 8.66634 4.00065ZM12.6663 4.00065C12.6663 4.73703 12.0694 5.33398 11.333 5.33398C10.5966 5.33398 9.99967 4.73703 9.99967 4.00065C9.99967 3.26427 10.5966 2.66732 11.333 2.66732C12.0694 2.66732 12.6663 3.26427 12.6663 4.00065ZM12.333 13.6673C11.5966 13.6673 10.9997 13.0704 10.9997 12.334C10.9997 11.5976 11.5966 11.0007 12.333 11.0007C13.0694 11.0007 13.6663 11.5976 13.6663 12.334C13.6663 13.0704 13.0694 13.6673 12.333 13.6673ZM5.33301 8.33398C5.33301 9.07036 4.73605 9.66732 3.99967 9.66732C3.26329 9.66732 2.66634 9.07036 2.66634 8.33398C2.66634 7.5976 3.26329 7.00065 3.99967 7.00065C4.73605 7.00065 5.33301 7.5976 5.33301 8.33398Z" fill="#646A73"/>
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8.66634 4.00065C8.66634 4.25739 8.70262 4.50565 8.77034 4.7406L5.88342 6.4465C5.401 5.96502 4.7351 5.66732 3.99967 5.66732C2.52692 5.66732 1.33301 6.86123 1.33301 8.33398C1.33301 9.80674 2.52692 11.0007 3.99967 11.0007C4.81776 11.0007 5.5498 10.6323 6.03896 10.0523L9.71633 11.8175C9.68353 11.9846 9.66634 12.1573 9.66634 12.334C9.66634 13.8067 10.8602 15.0007 12.333 15.0007C13.8058 15.0007 14.9997 13.8067 14.9997 12.334C14.9997 10.8612 13.8058 9.66732 12.333 9.66732C11.5149 9.66732 10.7829 10.0357 10.2937 10.6156L6.61635 8.8505C6.64915 8.6834 6.66634 8.5107 6.66634 8.33398C6.66634 8.07725 6.63006 7.82898 6.56234 7.59404L9.44926 5.88814C9.93168 6.36961 10.5976 6.66732 11.333 6.66732C12.8058 6.66732 13.9997 5.47341 13.9997 4.00065C13.9997 2.52789 12.8058 1.33398 11.333 1.33398C9.86025 1.33398 8.66634 2.52789 8.66634 4.00065ZM12.6663 4.00065C12.6663 4.73703 12.0694 5.33398 11.333 5.33398C10.5966 5.33398 9.99967 4.73703 9.99967 4.00065C9.99967 3.26427 10.5966 2.66732 11.333 2.66732C12.0694 2.66732 12.6663 3.26427 12.6663 4.00065ZM12.333 13.6673C11.5966 13.6673 10.9997 13.0704 10.9997 12.334C10.9997 11.5976 11.5966 11.0007 12.333 11.0007C13.0694 11.0007 13.6663 11.5976 13.6663 12.334C13.6663 13.0704 13.0694 13.6673 12.333 13.6673ZM5.33301 8.33398C5.33301 9.07036 4.73605 9.66732 3.99967 9.66732C3.26329 9.66732 2.66634 9.07036 2.66634 8.33398C2.66634 7.5976 3.26329 7.00065 3.99967 7.00065C4.73605 7.00065 5.33301 7.5976 5.33301 8.33398Z" />
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
@@ -7,7 +7,9 @@ import { ref, PropType, computed } from 'vue'
|
||||
import ShareHandler from '@/views/share/share/ShareHandler.vue'
|
||||
import { useShareStoreWithOut } from '@/store/modules/share'
|
||||
import { isDesktop } from '@/utils/ModelUtil'
|
||||
import { useI18n } from '@/hooks/web/useI18n'
|
||||
const shareStore = useShareStoreWithOut()
|
||||
const { t } = useI18n()
|
||||
|
||||
export interface Menu {
|
||||
svgName?: string
|
||||
@@ -64,11 +66,15 @@ const callBack = param => {
|
||||
return
|
||||
}
|
||||
if (props.node.leaf && props.node?.weight >= 7) {
|
||||
menus.value[0]['divided'] = true
|
||||
menus.value.splice(0, 0, param)
|
||||
}
|
||||
}
|
||||
const emit = defineEmits(['handleCommand'])
|
||||
|
||||
const menuDisabledCheck = ele => {
|
||||
// do return
|
||||
return ele.disabled || (props.node.extraFlag1 === 0 && ['share', 'copy'].includes(ele.command))
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -88,13 +94,30 @@ const emit = defineEmits(['handleCommand'])
|
||||
:command="ele.command"
|
||||
v-for="ele in menus"
|
||||
:key="ele.label"
|
||||
:disabled="ele.disabled || (ele.command === 'cancelPublish' && node.extraFlag1 === 0)"
|
||||
:class="{ 'de-hidden-drop-item': ele.hidden }"
|
||||
:disabled="menuDisabledCheck(ele)"
|
||||
:class="{
|
||||
'de-hidden-drop-item':
|
||||
ele.hidden || (ele.command === 'cancelPublish' && node.extraFlag1 === 0)
|
||||
}"
|
||||
>
|
||||
<el-icon class="handle-icon" color="#646a73" size="16" v-if="ele.svgName">
|
||||
<Icon><component class="svg-icon" :is="ele.svgName"></component></Icon>
|
||||
<Icon
|
||||
><component
|
||||
class="svg-icon"
|
||||
:class="{ 'custom-disable': menuDisabledCheck(ele) }"
|
||||
:is="ele.svgName"
|
||||
></component
|
||||
></Icon>
|
||||
</el-icon>
|
||||
{{ ele.label }}
|
||||
<el-tooltip
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
:content="t('visualization.publish_tips2', [ele.label])"
|
||||
:disabled="!menuDisabledCheck(ele)"
|
||||
placement="top-start"
|
||||
>
|
||||
{{ ele.label }}
|
||||
</el-tooltip>
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
@@ -110,6 +133,9 @@ const emit = defineEmits(['handleCommand'])
|
||||
</template>
|
||||
|
||||
<style lang="less">
|
||||
.custom-disable {
|
||||
color: var(--ed-text-color-disabled) !important;
|
||||
}
|
||||
.de-hidden-drop-item {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -2874,6 +2874,8 @@ export default {
|
||||
column_name: 'Field name'
|
||||
},
|
||||
visualization: {
|
||||
publish_tips1: 'Visible after publication',
|
||||
publish_tips2: 'Available after publication {0}',
|
||||
cancel_publish_tips: 'Successfully unpublished',
|
||||
resource_not_published: 'Resource not published',
|
||||
re_publish: 'Republish',
|
||||
|
||||
@@ -2795,6 +2795,8 @@ export default {
|
||||
column_name: '欄位名稱'
|
||||
},
|
||||
visualization: {
|
||||
publish_tips1: '發佈後可查看',
|
||||
publish_tips2: '發佈後可{0}',
|
||||
cancel_publish_tips: '取消發佈成功',
|
||||
resource_not_published: '資源未發佈',
|
||||
re_publish: '重新發佈',
|
||||
|
||||
@@ -2801,6 +2801,8 @@ export default {
|
||||
column_name: '字段名称'
|
||||
},
|
||||
visualization: {
|
||||
publish_tips1: '发布后可查看',
|
||||
publish_tips2: '发布后可{0}',
|
||||
cancel_publish_tips: '取消发布成功',
|
||||
resource_not_published: '资源未发布',
|
||||
re_publish: '重新发布',
|
||||
|
||||
@@ -6,6 +6,7 @@ export interface BusiTreeNode {
|
||||
weight: number
|
||||
ext?: number
|
||||
extraFlag: number
|
||||
extraFlag1: number
|
||||
children?: BusiTreeNode[]
|
||||
}
|
||||
|
||||
|
||||
@@ -4,11 +4,12 @@ import icon_add_outlined from '@/assets/svg/icon_add_outlined.svg'
|
||||
import dvCopyDark from '@/assets/svg/dv-copy-dark.svg'
|
||||
import dvDelete from '@/assets/svg/dv-delete.svg'
|
||||
import dvMove from '@/assets/svg/dv-move.svg'
|
||||
import dvCancelPublish from '@/assets/svg/dv-cancel-publish.svg'
|
||||
import dvCancelPublish from '@/assets/svg/icon_undo_outlined.svg'
|
||||
import { treeDraggbleChart } from '@/utils/treeDraggbleChart'
|
||||
import { debounce } from 'lodash-es'
|
||||
import dvRename from '@/assets/svg/dv-rename.svg'
|
||||
import dvDashboardSpine from '@/assets/svg/dv-dashboard-spine.svg'
|
||||
import dvDashboardSpineDisabled from '@/assets/svg/dv-dashboard-spine-disabled.svg'
|
||||
import dvScreenSpine from '@/assets/svg/dv-screen-spine.svg'
|
||||
import dvNewFolder from '@/assets/svg/dv-new-folder.svg'
|
||||
import icon_fileAdd_outlined from '@/assets/svg/icon_file-add_outlined.svg'
|
||||
@@ -73,7 +74,8 @@ const props = defineProps({
|
||||
})
|
||||
const defaultProps = {
|
||||
children: 'children',
|
||||
label: 'name'
|
||||
label: 'name',
|
||||
disabled: 'leaf'
|
||||
}
|
||||
const mounted = ref(false)
|
||||
const rootManage = ref(false)
|
||||
@@ -727,23 +729,38 @@ defineExpose({
|
||||
draggable
|
||||
>
|
||||
<template #default="{ node, data }">
|
||||
<span class="custom-tree-node">
|
||||
<span class="custom-tree-node" :class="{ 'node-disabled-custom': data.extraFlag1 === 0 }">
|
||||
<el-icon style="font-size: 18px" v-if="!data.leaf">
|
||||
<Icon name="dv-folder"><dvFolder class="svg-icon" /></Icon>
|
||||
</el-icon>
|
||||
<el-icon style="font-size: 18px" v-else-if="curCanvasType === 'dashboard'">
|
||||
<Icon
|
||||
<Icon v-if="data.extraFlag1"
|
||||
><component
|
||||
:is="data.extraFlag ? dvDashboardSpineMobile : dvDashboardSpine"
|
||||
></component
|
||||
></Icon>
|
||||
<Icon v-if="!data.extraFlag1"
|
||||
><component
|
||||
:is="data.extraFlag ? dvDashboardSpineDisabled : dvDashboardSpineDisabled"
|
||||
></component
|
||||
></Icon>
|
||||
</el-icon>
|
||||
<el-icon class="icon-screen-new color-dataV" style="font-size: 18px" v-else>
|
||||
<Icon name="icon_operation-analysis_outlined"
|
||||
><icon_operationAnalysis_outlined class="svg-icon"
|
||||
/></Icon>
|
||||
</el-icon>
|
||||
<span :title="node.label" class="label-tooltip">{{ node.label }}</span>
|
||||
<span :title="node.label" class="label-tooltip">
|
||||
<el-tooltip
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
:content="t('visualization.publish_tips1')"
|
||||
:disabled="data.extraFlag1"
|
||||
placement="top-start"
|
||||
>
|
||||
{{ node.label }}
|
||||
</el-tooltip>
|
||||
</span>
|
||||
<div class="icon-more" v-if="data.weight >= 7 && showPosition === 'preview'">
|
||||
<el-icon
|
||||
v-on:click.stop
|
||||
@@ -946,4 +963,9 @@ defineExpose({
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.node-disabled-custom {
|
||||
color: rgba(187, 191, 196, 1);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user