Showing
6 changed files
with
23 additions
and
10 deletions
| ... | ... | @@ -99,7 +99,7 @@ |
| 99 | 99 | |
| 100 | 100 | <template> |
| 101 | 101 | <div class="flex flex-col w-full h-full min-w-3 min-h-3"> |
| 102 | - <div :id="getControlsWidgetId()" class="widget-charts min-w-1 min-h-1 flex-auto"></div> | |
| 102 | + <div :id="getControlsWidgetId()" class="widget-charts w-full h-full flex-auto"></div> | |
| 103 | 103 | <div> |
| 104 | 104 | <div class="text-center" :style="{ fontSize: fontSize({ radio: getRadio, basic: 16 }) }">{{ |
| 105 | 105 | props.value.name | ... | ... |
| ... | ... | @@ -32,7 +32,9 @@ |
| 32 | 32 | </script> |
| 33 | 33 | |
| 34 | 34 | <template> |
| 35 | - <section class="w-full h-full flex flex-col justify-center items-center"> | |
| 35 | + <section | |
| 36 | + class="w-full h-full flex flex-col justify-center items-center justify-between widget-picture" | |
| 37 | + > | |
| 36 | 38 | <Image :width="getWidth" :src="props?.value?.value || ''" :fallback="fallback" /> |
| 37 | 39 | <div |
| 38 | 40 | class="w-full text-center text-gray-400 truncate" |
| ... | ... | @@ -51,4 +53,11 @@ |
| 51 | 53 | </section> |
| 52 | 54 | </template> |
| 53 | 55 | |
| 54 | -<style scoped></style> | |
| 56 | +<style scoped lang="less"> | |
| 57 | + .widget-picture:deep(.ant-image) { | |
| 58 | + flex: auto; | |
| 59 | + display: flex; | |
| 60 | + justify-content: center; | |
| 61 | + align-items: center; | |
| 62 | + } | |
| 63 | +</style> | ... | ... |
| ... | ... | @@ -65,8 +65,8 @@ |
| 65 | 65 | prefix="iconfont" |
| 66 | 66 | :style="{ |
| 67 | 67 | color: props.value.iconColor, |
| 68 | - width: fontSize({ radio: getRadio, basic: 40 }), | |
| 69 | - height: fontSize({ radio: getRadio, basic: 40 }), | |
| 68 | + width: fontSize({ radio: getRadio, basic: 50 }), | |
| 69 | + height: fontSize({ radio: getRadio, basic: 50 }), | |
| 70 | 70 | }" |
| 71 | 71 | /> |
| 72 | 72 | </div> | ... | ... |
| ... | ... | @@ -23,8 +23,8 @@ |
| 23 | 23 | <div class="widget-content" :style="{ height: slot.header ? 'calc(100% - 22px)' : '100%' }"> |
| 24 | 24 | <div |
| 25 | 25 | v-for="item in props.dataSource" |
| 26 | - :key="item.uuid" | |
| 27 | - :style="{ width: `${item.width}%`, height: `${item.height}%` }" | |
| 26 | + :key="item.id" | |
| 27 | + :style="{ width: `${item.width || 100}%`, height: `${item.height || 100}%` }" | |
| 28 | 28 | class="widget-item" |
| 29 | 29 | > |
| 30 | 30 | <div class="widget-box"> | ... | ... |
| ... | ... | @@ -30,7 +30,7 @@ |
| 30 | 30 | |
| 31 | 31 | const componentRecord = ref<DataBoardLayoutInfo>({} as unknown as DataBoardLayoutInfo); |
| 32 | 32 | |
| 33 | - const [register, { closeModal }] = useModalInner( | |
| 33 | + const [register, { closeModal, changeOkLoading }] = useModalInner( | |
| 34 | 34 | (record: DataBoardLayoutInfo & { isEdit: boolean }) => { |
| 35 | 35 | componentRecord.value = record; |
| 36 | 36 | frontId.value = record.record.frontId; |
| ... | ... | @@ -43,7 +43,6 @@ |
| 43 | 43 | }>(); |
| 44 | 44 | |
| 45 | 45 | const handleSubmit = () => { |
| 46 | - console.log({ isEdit: unref(isEdit) }); | |
| 47 | 46 | const { getAllDataSourceFieldValue } = unref(basicConfigurationEl)!; |
| 48 | 47 | const value = getAllDataSourceFieldValue(); |
| 49 | 48 | unref(isEdit) ? handleUpdateComponent(value) : handleAddComponent(value); |
| ... | ... | @@ -52,6 +51,7 @@ |
| 52 | 51 | |
| 53 | 52 | const handleAddComponent = async (value: Recordable) => { |
| 54 | 53 | try { |
| 54 | + changeOkLoading(true); | |
| 55 | 55 | await addDataComponent({ |
| 56 | 56 | boardId: unref(boardId), |
| 57 | 57 | record: { dataBoardId: unref(boardId), frontId: unref(frontId), ...value }, |
| ... | ... | @@ -61,11 +61,14 @@ |
| 61 | 61 | emit('submit'); |
| 62 | 62 | } catch (error) { |
| 63 | 63 | // createMessage.error('创建失败'); |
| 64 | + } finally { | |
| 65 | + changeOkLoading(false); | |
| 64 | 66 | } |
| 65 | 67 | }; |
| 66 | 68 | |
| 67 | 69 | const handleUpdateComponent = async (value: Recordable) => { |
| 68 | 70 | try { |
| 71 | + changeOkLoading(true); | |
| 69 | 72 | await updateDataComponent({ |
| 70 | 73 | boardId: unref(boardId), |
| 71 | 74 | record: { |
| ... | ... | @@ -80,6 +83,8 @@ |
| 80 | 83 | emit('submit'); |
| 81 | 84 | } catch (error) { |
| 82 | 85 | // createMessage.error('修改失败'); |
| 86 | + } finally { | |
| 87 | + changeOkLoading(false); | |
| 83 | 88 | } |
| 84 | 89 | }; |
| 85 | 90 | </script> | ... | ... |