This commit is contained in:
hujiale
parent
2149877576
commit
25fa733943
|
|
@ -315,9 +315,15 @@ const selectTodoClick = (item: string) => {
|
|||
全部
|
||||
</Button>
|
||||
</li>
|
||||
<li v-for="item in plainOptions" :key="item" @click="selectedClick(item)">
|
||||
<li
|
||||
v-for="(item, index) in plainOptions"
|
||||
:key="item"
|
||||
@click="selectedClick(item)"
|
||||
>
|
||||
<Button :type="selectClass == item ? 'primary' : 'default'">
|
||||
{{ item }}
|
||||
<span v-if="index == 3" class="text-[#f10215]">(10)</span>
|
||||
<span v-if="index == 6" class="text-[#f10215]">(9)</span>
|
||||
</Button>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@ import { storeToRefs } from 'pinia';
|
|||
|
||||
import { useCanvasStore, UseTilesStore } from '#/store';
|
||||
|
||||
import { tilesList } from './tiles';
|
||||
import { groupList, tilesList } from './tiles';
|
||||
import { debounce, isElementInFolder, isGroup, updateRowHeight } from './utils';
|
||||
|
||||
const tilesStore = UseTilesStore();
|
||||
|
|
@ -569,8 +569,7 @@ const formState = reactive({
|
|||
Displayed as <code>[x, y, w, h]</code>:
|
||||
<div class="columns">
|
||||
<div v-for="item in layout">
|
||||
<b>{{ item.i }}</b
|
||||
>: [{{ item.x }}, {{ item.y }}, {{ item.w }}, {{ item.h }}]
|
||||
<b>{{ item.i }}</b>: [{{ item.x }}, {{ item.y }}, {{ item.w }}, {{ item.h }}]
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -671,209 +670,50 @@ const formState = reactive({
|
|||
<template #content>
|
||||
<div class="shop-seach mb-2 flex items-center">
|
||||
<Select v-model:value="shopFlotter">
|
||||
<SelectOption value="1">全部应用磁贴</SelectOption>
|
||||
<SelectOption value="2">Option2</SelectOption>
|
||||
<SelectOption value="-1">全部应用磁贴</SelectOption>
|
||||
<SelectOption
|
||||
v-for="(item, index) in groupList"
|
||||
:key="index"
|
||||
:value="index"
|
||||
>
|
||||
{{ item.label }}
|
||||
</SelectOption>
|
||||
</Select>
|
||||
<InputSearch placeholder="" />
|
||||
</div>
|
||||
<div class="shop-box">
|
||||
<!-- <CheckboxGroup v-model:value="selectTilseArr" style="width: 100%"> -->
|
||||
<Collapse v-model:active-key="activeKeyArr" style="width: 100%">
|
||||
<CollapsePanel key="1" header="个人工作台（22）">
|
||||
<!-- 可拖入的组件部分 -->
|
||||
<CollapsePanel
|
||||
v-for="(value, num) in groupList"
|
||||
:key="num"
|
||||
:header="value.label"
|
||||
>
|
||||
<div class="components-box">
|
||||
<div
|
||||
v-for="item in componentsInfo.slice(0, 22)"
|
||||
:key="item.name"
|
||||
:class="{
|
||||
'active pointer-events-none !cursor-no-drop': haveItem(
|
||||
item.name,
|
||||
),
|
||||
}"
|
||||
:draggable="haveItem(item.name)"
|
||||
class="ctrl-box bg-background relative"
|
||||
@drag="drag"
|
||||
@dragend="dragend($event)"
|
||||
@dragstart="dragstart($event, item)"
|
||||
>
|
||||
<div class="ctrl-name">
|
||||
{{ `${item.name}(${item.size})` }}
|
||||
<template v-for="item in tilesList" :key="item.name">
|
||||
<div
|
||||
v-if="item.group == value.value"
|
||||
:class="{
|
||||
'active pointer-events-none !cursor-no-drop':
|
||||
haveItem(item.name),
|
||||
}"
|
||||
:draggable="haveItem(item.name)"
|
||||
class="ctrl-box bg-background relative"
|
||||
@drag="drag"
|
||||
@dragend="dragend($event)"
|
||||
@dragstart="dragstart($event, item)"
|
||||
>
|
||||
<div class="ctrl-name">
|
||||
{{ `${item.name}(${item.size})` }}
|
||||
</div>
|
||||
<img :src="`/xbyt/${item.name2}`" alt="" />
|
||||
<Checkbox
|
||||
:checked="haveItem(item.name)"
|
||||
:value="item.name"
|
||||
class="absolute bottom-0 right-1"
|
||||
/>
|
||||
</div>
|
||||
<img :src="`/xbyt/${item.name2}`" alt="" />
|
||||
<Checkbox
|
||||
:checked="haveItem(item.name)"
|
||||
:value="item.name"
|
||||
class="absolute bottom-0 right-1"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</CollapsePanel>
|
||||
<CollapsePanel key="2" header="综合行政（12）">
|
||||
<div class="components-box">
|
||||
<div
|
||||
v-for="item in componentsInfo.slice(22, 34)"
|
||||
:key="item.name"
|
||||
:class="{
|
||||
'active pointer-events-none !cursor-no-drop': haveItem(
|
||||
item.name,
|
||||
),
|
||||
}"
|
||||
class="ctrl-box bg-background"
|
||||
draggable="true"
|
||||
@drag="drag"
|
||||
@dragend="dragend"
|
||||
@dragstart="dragstart($event, item)"
|
||||
>
|
||||
<div class="ctrl-name">
|
||||
{{ `${item.name}(${item.size})` }}
|
||||
</div>
|
||||
<img :src="`/xbyt/${item.name2}`" alt="" />
|
||||
<Checkbox
|
||||
:checked="haveItem(item.name)"
|
||||
:value="item.name"
|
||||
class="absolute bottom-0 right-1"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</CollapsePanel>
|
||||
<CollapsePanel key="3" header="经营管理（22）">
|
||||
<div class="components-box">
|
||||
<div
|
||||
v-for="item in componentsInfo.slice(34, 56)"
|
||||
:key="item.name"
|
||||
:class="{
|
||||
'active pointer-events-none !cursor-no-drop': haveItem(
|
||||
item.name,
|
||||
),
|
||||
}"
|
||||
class="ctrl-box bg-background"
|
||||
draggable="true"
|
||||
@drag="drag"
|
||||
@dragend="dragend"
|
||||
@dragstart="dragstart($event, item)"
|
||||
>
|
||||
<div class="ctrl-name">
|
||||
{{ `${item.name}(${item.size})` }}
|
||||
</div>
|
||||
<img :src="`/xbyt/${item.name2}`" alt="" />
|
||||
<Checkbox
|
||||
:checked="haveItem(item.name)"
|
||||
:value="item.name"
|
||||
class="absolute bottom-0 right-1"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</CollapsePanel>
|
||||
<CollapsePanel key="4" header="安全生产（19）">
|
||||
<div class="components-box">
|
||||
<div
|
||||
v-for="item in componentsInfo.slice(56, 75)"
|
||||
:key="item.name"
|
||||
:class="{
|
||||
'active pointer-events-none !cursor-no-drop': haveItem(
|
||||
item.name,
|
||||
),
|
||||
}"
|
||||
class="ctrl-box bg-background"
|
||||
draggable="true"
|
||||
@drag="drag"
|
||||
@dragend="dragend"
|
||||
@dragstart="dragstart($event, item)"
|
||||
>
|
||||
<div class="ctrl-name">
|
||||
{{ `${item.name}(${item.size})` }}
|
||||
</div>
|
||||
<img :src="`/xbyt/${item.name2}`" alt="" />
|
||||
<Checkbox
|
||||
:checked="haveItem(item.name)"
|
||||
:value="item.name"
|
||||
class="absolute bottom-0 right-1"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</CollapsePanel>
|
||||
<CollapsePanel key="5" header="勘探开发（26）">
|
||||
<div class="components-box">
|
||||
<div
|
||||
v-for="item in componentsInfo.slice(75, 101)"
|
||||
:key="item.name"
|
||||
:class="{
|
||||
'active pointer-events-none !cursor-no-drop': haveItem(
|
||||
item.name,
|
||||
),
|
||||
}"
|
||||
class="ctrl-box bg-background"
|
||||
draggable="true"
|
||||
@drag="drag"
|
||||
@dragend="dragend"
|
||||
@dragstart="dragstart($event, item)"
|
||||
>
|
||||
<div class="ctrl-name">
|
||||
{{ `${item.name}(${item.size})` }}
|
||||
</div>
|
||||
<img :src="`/xbyt/${item.name2}`" alt="" />
|
||||
<Checkbox
|
||||
::checked="haveItem(item.name)"
|
||||
:value="item.name"
|
||||
class="absolute bottom-0 right-1"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</CollapsePanel>
|
||||
<CollapsePanel key="6" header="数据管理（1）">
|
||||
<div class="components-box">
|
||||
<div
|
||||
v-for="item in componentsInfo.slice(101, 102)"
|
||||
:key="item.name"
|
||||
:class="{
|
||||
'active pointer-events-none !cursor-no-drop': haveItem(
|
||||
item.name,
|
||||
),
|
||||
}"
|
||||
class="ctrl-box bg-background"
|
||||
draggable="true"
|
||||
@drag="drag"
|
||||
@dragend="dragend"
|
||||
@dragstart="dragstart($event, item)"
|
||||
>
|
||||
<div class="ctrl-name">
|
||||
{{ `${item.name}(${item.size})` }}
|
||||
</div>
|
||||
<img :src="`/xbyt/${item.name2}`" alt="" />
|
||||
<Checkbox
|
||||
:checked="haveItem(item.name)"
|
||||
:value="item.name"
|
||||
class="absolute bottom-0 right-1"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</CollapsePanel>
|
||||
<CollapsePanel key="7" header="总部系统（25）">
|
||||
<div class="components-box">
|
||||
<div
|
||||
v-for="item in componentsInfo.slice(102, 127)"
|
||||
:key="item.name"
|
||||
:class="{
|
||||
'active pointer-events-none !cursor-no-drop': haveItem(
|
||||
item.name,
|
||||
),
|
||||
}"
|
||||
class="ctrl-box bg-background"
|
||||
draggable="true"
|
||||
@drag="drag"
|
||||
@dragend="dragend"
|
||||
@dragstart="dragstart($event, item)"
|
||||
>
|
||||
<div class="ctrl-name">
|
||||
{{ `${item.name}(${item.size})` }}
|
||||
</div>
|
||||
<img :src="`/xbyt/${item.name2}`" alt="" />
|
||||
<Checkbox
|
||||
:checked="haveItem(item.name)"
|
||||
:value="item.name"
|
||||
class="absolute bottom-0 right-1"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</CollapsePanel>
|
||||
</Collapse>
|
||||
|
|
|
|||
Loading…
Reference in New Issue