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,36 +1,65 @@
|
||||||
<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">
|
<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 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({
|
const props = defineProps({
|
||||||
data: {
|
data: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: {}
|
default: {},
|
||||||
},
|
},
|
||||||
})
|
});
|
||||||
let isEdit = ref(true)
|
const cardName = ref(props.data.name);
|
||||||
console.log('propsprops', props.data);
|
const newCardName = ref(cardName.value);
|
||||||
let { data } = toRefs(props);
|
const isEdit = ref(true);
|
||||||
|
const setNewName = () => {
|
||||||
|
isEdit.value = !isEdit.value;
|
||||||
|
cardName.value = newCardName.value;
|
||||||
|
};
|
||||||
|
const { data } = toRefs(props);
|
||||||
</script>
|
</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>
|
<style lang="scss" scoped>
|
||||||
.card-name {
|
.card-name {
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
padding: 5px 0;
|
padding: 5px 0;
|
||||||
border-bottom: 1px solid #ddd;
|
border-bottom: 1px solid #ddd;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -18,6 +18,7 @@ import {
|
||||||
UndoOutlined,
|
UndoOutlined,
|
||||||
} from '@ant-design/icons-vue';
|
} from '@ant-design/icons-vue';
|
||||||
import {
|
import {
|
||||||
|
Button,
|
||||||
Checkbox,
|
Checkbox,
|
||||||
CheckboxGroup,
|
CheckboxGroup,
|
||||||
Collapse,
|
Collapse,
|
||||||
|
@ -44,11 +45,11 @@ const layout = ref([]);
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
const layoutStr = JSON.parse(localStorage.getItem('layout'));
|
const layoutStr = JSON.parse(localStorage.getItem('layout'));
|
||||||
if (layoutStr && layoutStr.length > 0) {
|
if (layoutStr && layoutStr.length > 0) {
|
||||||
for (const element of layoutStr) {
|
// for (const element of layoutStr) {
|
||||||
if (element && element.component) {
|
// if (element && element.component) {
|
||||||
// layoutStr[i].component = loadComponent(layoutStr[i].component);
|
// layoutStr[i].component = loadComponent(layoutStr[i].component);
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
layout.value = layoutStr;
|
layout.value = layoutStr;
|
||||||
}
|
}
|
||||||
console.log('oooo', layout.value);
|
console.log('oooo', layout.value);
|
||||||
|
@ -244,6 +245,7 @@ const dragend = (e) => {
|
||||||
} catch {}
|
} catch {}
|
||||||
}
|
}
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
|
// eslint-disable-next-line no-use-before-define
|
||||||
tilesIsMove.value = true;
|
tilesIsMove.value = true;
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
@ -290,9 +292,16 @@ const cancelOrSure = (type) => {
|
||||||
if (type == 'cance') {
|
if (type == 'cance') {
|
||||||
editTiles.value = false;
|
editTiles.value = false;
|
||||||
tilesStore.setTilesIsMove(false);
|
tilesStore.setTilesIsMove(false);
|
||||||
layout.value = layout.value.filter((item) => {
|
const layoutStr = JSON.parse(localStorage.getItem('layout'));
|
||||||
return !item.isNew;
|
|
||||||
});
|
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') {
|
} else if (type == 'sure') {
|
||||||
editTiles.value = false;
|
editTiles.value = false;
|
||||||
tilesStore.setTilesIsMove(false);
|
tilesStore.setTilesIsMove(false);
|
||||||
|
@ -311,6 +320,43 @@ const goPage = (item) => {
|
||||||
if (tilesIsMove.value) return;
|
if (tilesIsMove.value) return;
|
||||||
router.push(item?.path);
|
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>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
@ -318,6 +364,7 @@ const goPage = (item) => {
|
||||||
<!-- 自定义布局的部分 -->
|
<!-- 自定义布局的部分 -->
|
||||||
{{ screenW }} - {{ rowHeight }}
|
{{ screenW }} - {{ rowHeight }}
|
||||||
<div class="grid-box index-grid select-none">
|
<div class="grid-box index-grid select-none">
|
||||||
|
<Button type="primary" @click="addGroup">新增分组</Button>
|
||||||
<grid-layout
|
<grid-layout
|
||||||
v-if="rowHeight != 0"
|
v-if="rowHeight != 0"
|
||||||
ref="gridLayout"
|
ref="gridLayout"
|
||||||
|
|
Loading…
Reference in New Issue