Merge branch 'test' of http://172.19.183.27:3000/z9130/pansoft-plrl into test
Frontend CI/CD / build (web-office) (push) Failing after 7s
Details
Frontend CI/CD / build (web-office) (push) Failing after 7s
Details
This commit is contained in:
commit
ff185e8ace
|
@ -1,32 +1,61 @@
|
|||
<template>
|
||||
<div class="custom-card w-[100%] h-[100%] flex flex-col">
|
||||
<div class="card-name titlt-top" v-if="isEdit"><div>我的应用</div><EditOutlined /></div>
|
||||
<div class="card-name titlt-top" v-else >
|
||||
<Input v-model:value="cardName" >
|
||||
<template #addonAfter>
|
||||
<CheckOutlined />
|
||||
</template>
|
||||
</Input></div>
|
||||
<GridGroup :list="data.childer" class="flex-1"></GridGroup>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { toRefs ,ref} from 'vue'
|
||||
import { ref, toRefs } from 'vue';
|
||||
|
||||
import {
|
||||
CheckOutlined,
|
||||
CloseOutlined,
|
||||
EditOutlined,
|
||||
} from '@ant-design/icons-vue';
|
||||
import { Input, Space } from 'ant-design-vue';
|
||||
|
||||
import GridGroup from '../GridGroup/index.vue';
|
||||
import { CheckOutlined,EditOutlined} from '@ant-design/icons-vue';
|
||||
import { Input } from 'ant-design-vue';
|
||||
let cardName = ref('我的应用')
|
||||
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
default: {}
|
||||
default: {},
|
||||
},
|
||||
})
|
||||
let isEdit = ref(true)
|
||||
console.log('propsprops', props.data);
|
||||
let { data } = toRefs(props);
|
||||
|
||||
});
|
||||
const cardName = ref(props.data.name);
|
||||
const newCardName = ref(cardName.value);
|
||||
const isEdit = ref(true);
|
||||
const setNewName = () => {
|
||||
isEdit.value = !isEdit.value;
|
||||
cardName.value = newCardName.value;
|
||||
};
|
||||
const { data } = toRefs(props);
|
||||
</script>
|
||||
<template>
|
||||
<div class="custom-card flex h-[100%] w-[100%] flex-col">
|
||||
<div
|
||||
v-if="isEdit"
|
||||
class="card-name titlt-top flex items-center justify-between"
|
||||
>
|
||||
<div>{{ cardName }}</div>
|
||||
<EditOutlined
|
||||
class="cursor-pointer"
|
||||
style="font-size: 16px"
|
||||
@click="isEdit = !isEdit"
|
||||
/>
|
||||
</div>
|
||||
<div v-else class="card-name titlt-top">
|
||||
<Input
|
||||
v-model:value="newCardName"
|
||||
:autofocus="true"
|
||||
:bordered="false"
|
||||
size="small"
|
||||
>
|
||||
<template #addonAfter>
|
||||
<Space warp>
|
||||
<CheckOutlined @click="setNewName" />
|
||||
<CloseOutlined @click="isEdit = !isEdit" />
|
||||
</Space>
|
||||
</template>
|
||||
</Input>
|
||||
</div>
|
||||
<GridGroup :list="data.childer" class="flex-1" />
|
||||
</div>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
.card-name {
|
||||
font-weight: 500;
|
||||
|
|
|
@ -18,6 +18,7 @@ import {
|
|||
UndoOutlined,
|
||||
} from '@ant-design/icons-vue';
|
||||
import {
|
||||
Button,
|
||||
Checkbox,
|
||||
CheckboxGroup,
|
||||
Collapse,
|
||||
|
@ -44,11 +45,11 @@ const layout = ref([]);
|
|||
onMounted(() => {
|
||||
const layoutStr = JSON.parse(localStorage.getItem('layout'));
|
||||
if (layoutStr && layoutStr.length > 0) {
|
||||
for (const element of layoutStr) {
|
||||
if (element && element.component) {
|
||||
// for (const element of layoutStr) {
|
||||
// if (element && element.component) {
|
||||
// layoutStr[i].component = loadComponent(layoutStr[i].component);
|
||||
}
|
||||
}
|
||||
// }
|
||||
// }
|
||||
layout.value = layoutStr;
|
||||
}
|
||||
console.log('oooo', layout.value);
|
||||
|
@ -244,6 +245,7 @@ const dragend = (e) => {
|
|||
} catch {}
|
||||
}
|
||||
nextTick(() => {
|
||||
// eslint-disable-next-line no-use-before-define
|
||||
tilesIsMove.value = true;
|
||||
});
|
||||
};
|
||||
|
@ -290,9 +292,16 @@ const cancelOrSure = (type) => {
|
|||
if (type == 'cance') {
|
||||
editTiles.value = false;
|
||||
tilesStore.setTilesIsMove(false);
|
||||
layout.value = layout.value.filter((item) => {
|
||||
return !item.isNew;
|
||||
});
|
||||
const layoutStr = JSON.parse(localStorage.getItem('layout'));
|
||||
|
||||
if (layoutStr && layoutStr.length > 0) {
|
||||
for (const element of layoutStr) {
|
||||
if (element && element.component) {
|
||||
element.loadComp = loadComponent(element.component);
|
||||
}
|
||||
}
|
||||
layout.value = layoutStr;
|
||||
}
|
||||
} else if (type == 'sure') {
|
||||
editTiles.value = false;
|
||||
tilesStore.setTilesIsMove(false);
|
||||
|
@ -311,6 +320,43 @@ const goPage = (item) => {
|
|||
if (tilesIsMove.value) return;
|
||||
router.push(item?.path);
|
||||
};
|
||||
// 新增分组
|
||||
const addGroup = () => {
|
||||
const arr = JSON.parse(JSON.stringify(layout.value));
|
||||
const maxY = arr.reduce((max, item) => {
|
||||
return Math.max(max, item.y);
|
||||
}, -Infinity);
|
||||
const obj = {
|
||||
name: '新建分组',
|
||||
w: 4,
|
||||
h: 6,
|
||||
component: './components/Output5/index.vue',
|
||||
dom: '.titlt-top',
|
||||
isResize: true,
|
||||
X: 0,
|
||||
y: 0,
|
||||
i: Math.random() * 100,
|
||||
loadComp: loadComponent('./components/Output5/index.vue'),
|
||||
childer: [
|
||||
{
|
||||
name1: 'AUTO_1612159241967.png',
|
||||
name2: 'AUTO_1612159241967_C车辆调度.png',
|
||||
size: '2x2',
|
||||
name: '车辆调度',
|
||||
w: 1,
|
||||
h: 2,
|
||||
i: 0,
|
||||
x: 1,
|
||||
y: 1,
|
||||
component: '../../components/Output1/index.vue',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
layout.value.push(obj);
|
||||
|
||||
console.log(layout.value, '00000');
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -318,6 +364,7 @@ const goPage = (item) => {
|
|||
<!-- 自定义布局的部分 -->
|
||||
{{ screenW }} - {{ rowHeight }}
|
||||
<div class="grid-box index-grid select-none">
|
||||
<Button type="primary" @click="addGroup">新增分组</Button>
|
||||
<grid-layout
|
||||
v-if="rowHeight != 0"
|
||||
ref="gridLayout"
|
||||
|
|
Loading…
Reference in New Issue