Browse Source

发版

lwx_v10
超级管理员 2 years ago
parent
commit
6a41d3e08c
  1. 7
      src/types/components.d.ts
  2. 213
      src/views/sysworkflow/codepage/page0318.vue

7
src/types/components.d.ts

@ -35,6 +35,7 @@ declare module '@vue/runtime-core' {
ElCard: typeof import('element-plus/es')['ElCard'] ElCard: typeof import('element-plus/es')['ElCard']
ElCarousel: typeof import('element-plus/es')['ElCarousel'] ElCarousel: typeof import('element-plus/es')['ElCarousel']
ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem'] ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem']
ElCascader: typeof import('element-plus/es')['ElCascader']
ElCheckbox: typeof import('element-plus/es')['ElCheckbox'] ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
ElCheckboxGroup: typeof import('element-plus/es')['ElCheckboxGroup'] ElCheckboxGroup: typeof import('element-plus/es')['ElCheckboxGroup']
ElCol: typeof import('element-plus/es')['ElCol'] ElCol: typeof import('element-plus/es')['ElCol']
@ -59,6 +60,7 @@ declare module '@vue/runtime-core' {
ElImageViewer: typeof import('element-plus/es')['ElImageViewer'] ElImageViewer: typeof import('element-plus/es')['ElImageViewer']
ElInput: typeof import('element-plus/es')['ElInput'] ElInput: typeof import('element-plus/es')['ElInput']
ElInputNumber: typeof import('element-plus/es')['ElInputNumber'] ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
ElLink: typeof import('element-plus/es')['ElLink']
ElMain: typeof import('element-plus/es')['ElMain'] ElMain: typeof import('element-plus/es')['ElMain']
ElMenu: typeof import('element-plus/es')['ElMenu'] ElMenu: typeof import('element-plus/es')['ElMenu']
ElMenuItem: typeof import('element-plus/es')['ElMenuItem'] ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
@ -66,6 +68,7 @@ declare module '@vue/runtime-core' {
ElPagination: typeof import('element-plus/es')['ElPagination'] ElPagination: typeof import('element-plus/es')['ElPagination']
ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm'] ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm']
ElPopover: typeof import('element-plus/es')['ElPopover'] ElPopover: typeof import('element-plus/es')['ElPopover']
ElProgress: typeof import('element-plus/es')['ElProgress']
ElRadio: typeof import('element-plus/es')['ElRadio'] ElRadio: typeof import('element-plus/es')['ElRadio']
ElRadioButton: typeof import('element-plus/es')['ElRadioButton'] ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup'] ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
@ -120,7 +123,6 @@ declare module '@vue/runtime-core' {
IEpCaretBottom: typeof import('~icons/ep/caret-bottom')['default'] IEpCaretBottom: typeof import('~icons/ep/caret-bottom')['default']
IEpCaretTop: typeof import('~icons/ep/caret-top')['default'] IEpCaretTop: typeof import('~icons/ep/caret-top')['default']
IEpClose: typeof import('~icons/ep/close')['default'] IEpClose: typeof import('~icons/ep/close')['default']
<<<<<<< HEAD
IEpCollection: typeof import('~icons/ep/collection')['default'] IEpCollection: typeof import('~icons/ep/collection')['default']
IEpDelete: typeof import('~icons/ep/delete')['default'] IEpDelete: typeof import('~icons/ep/delete')['default']
IEpDownload: typeof import('~icons/ep/download')['default'] IEpDownload: typeof import('~icons/ep/download')['default']
@ -139,9 +141,6 @@ declare module '@vue/runtime-core' {
IEpUploadFilled: typeof import('~icons/ep/upload-filled')['default'] IEpUploadFilled: typeof import('~icons/ep/upload-filled')['default']
IEpUser: typeof import('~icons/ep/user')['default'] IEpUser: typeof import('~icons/ep/user')['default']
IEpView: typeof import('~icons/ep/view')['default'] IEpView: typeof import('~icons/ep/view')['default']
=======
IEpSetting: typeof import('~icons/ep/setting')['default']
>>>>>>> v8_master
LangSelect: typeof import('./../components/LangSelect/index.vue')['default'] LangSelect: typeof import('./../components/LangSelect/index.vue')['default']
LayoutPage: typeof import('./../components/DesignForm/layoutPage/index.vue')['default'] LayoutPage: typeof import('./../components/DesignForm/layoutPage/index.vue')['default']
List: typeof import('./../components/DesignForm/public/form/components/list.vue')['default'] List: typeof import('./../components/DesignForm/public/form/components/list.vue')['default']

213
src/views/sysworkflow/codepage/page0318.vue

@ -1,215 +1,14 @@
<!-- <!--
@ 作者: 袁纪菲 @ 作者: 秦东
@ 时间: 2024.3.18 @ 时间: 2024-05-15 15:07:04
@ 备注: 应用管理父组件 @ 备注:
--> -->
<script lang = "ts" setup> <script lang='ts' setup>
import cardedit from './cardedit.vue';
import cardadd from './cardadd.vue';
import {ref,onMounted,onUnmounted,watch} from 'vue';
import {Delete,Edit,View,MoreFilled} from '@element-plus/icons-vue'
//
const props = defineProps({
visible:Boolean
});
const drawerRefadd = ref(false);
const drawerRefedit = ref(false)
//
interface cardDatass {
id: number;
name: string;
imageUrl: '',
}
const cardData = ref<cardDatass[]>([]);
const emits = defineEmits(["update:visible", "data"]);
//
const opencardadd = () => {
drawerRefadd.value = true;
cardadd.value.onSubmit = handleAddCard;
};
//
const handleAddCard = (newCard: cardDatass) => {
cardData.value.push(newCard);
};
//
const opencardedit = (index: number) => {
drawerRefedit.value = true;
// cardedit
cardedit.value.cardData = cardData.value[index];
cardedit.value.onSubmit = handleEditCard;
};
//
const handleEditCard = (newCard: cardDatass) => {
cardData.value.splice(0,1,newCard);
};
//
const deleteCard = (index: number) => {
cardData.value.splice(index, 1);
emits('data', cardData.value);
};
// 'data'
watch(() => props.visible, () => {
},
{ immediate: true }
);
//
const handleNewCard = (newCard: cardDatass) => {
cardData.value.push(newCard);
};
onMounted(() => {
for(let i = 0;i<9;i++){
cardData.value.push({
id: i,
name: '卡片' + i,
imageUrl: ''
});
}
});
</script> </script>
<template> <template>
<cardadd v-model:visible="drawerRefadd" :keyval="props.visible" @data="handleNewCard"/> <div></div>
<cardedit v-model:visible="drawerRefedit" :keyval="props.visible" @data="handleNewCard"/>
<el-row :gutter="10">
<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
<div class="grid-content ep-bg-purple" >
<el-card class="cardlarge">
<template #header>
<div class="cardhead-large">
<el-row class="block-col-2">
<el-col style="text-align: right;">
<el-dropdown>
<span class="el-dropdown-link">
<el-icon><MoreFilled /></el-icon>
</span>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item @click="opencardadd" >添加</el-dropdown-item>
<el-dropdown-item >编辑</el-dropdown-item>
<el-dropdown-item >删除</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</el-col>
<el-col style="text-align: left;">
<span>标题一</span>
</el-col>
</el-row>
</div>
</template>
<div class="grid-content ep-bg-purple" >
<el-row :gutter="10" >
<el-col v-for="(card, index) in cardData" :key="card.id" :xs="8" :sm="12" :md="8" :lg="8" :xl="8">
<el-card class="cardpattern">
<img
v-if="card.imageUrl"
src="card.imageUrl"
title="示例图片"
class="picture"
/>
<div class="cardhead">
<span>{{ card.name }}</span>
</div>
<div class="bottom">
<el-button size="small" circle class="button" :icon="View"></el-button>
<el-button size="small" circle class="button" :icon="Edit" @click="() => opencardedit(index)"></el-button>
<el-button size="small" circle class="button" :icon="Delete" @click="() => deleteCard(index)"></el-button>
</div>
</el-card>
</el-col>
</el-row>
</div>
</el-card>
</div>
</el-col>
</el-row>
<!-- 分页 -->
<div class="example-pagination-block">
<div class="example-demonstration"></div>
<el-pagination layout="prev, pager, next" :total="50" />
</div>
</template> </template>
<style scoped> <style lang='scss' scoped>
/* 小卡片 */
.cardpattern{
padding-bottom: 0px;
margin-bottom: 10px;
min-width: 100px;
}
/* 小卡片标题 */
.cardhead{
padding: 10px;
font-size: 15px;
}
/* 大卡片 */
.cardlarge{
max-width: 480px;
}
/* 大卡片标题 */
.cardhead-large{
font-size: 20px;
}
/* 按钮整体 */
.bottom {
margin-top: 20px;
line-height: 10px;
display: flex;
justify-content: space-evenly;
align-items: center;
}
/* 单个按钮 */
.button {
padding: 0px;
min-height: auto;
margin-bottom: 1px;
}
/* 图片 */
.picture {
height: 100%;
min-height: 50px;
max-height: 100px;
display: block;
width: 100%;
min-width: 50px;
}
.el-col {
border-radius: 4px;
}
.grid-content {
border-radius: 4px;
min-height: 36px;
}
.app_box{
margin: 15px 0 0 0px;
}
.block-col-2 .demonstration {
display: block;
color: var(--el-text-color-secondary);
font-size: 14px;
margin-bottom: 20px;
}
.block-col-2 .el-dropdown-link {
display: flex;
align-items: center;
}
/* 分页 */
.example-pagination-block + .example-pagination-block {
margin-top: 10px;
}
.example-pagination-block .example-demonstration {
margin-bottom: 16px;
}
</style> </style>

Loading…
Cancel
Save