Browse Source

再次美化

xiaochan 5 months ago
parent
commit
0fd39e8265
1 changed files with 10 additions and 3 deletions
  1. 10 3
      src/components/cy/CyDialog/index.vue

+ 10 - 3
src/components/cy/CyDialog/index.vue

@@ -4,6 +4,7 @@ import {ElButton} from "element-plus";
 import XEUtils from "xe-utils";
 import sleep from "@/utils/sleep";
 import {nextTick, renderSlot} from "vue";
+import {CircleCloseFilled} from '@element-plus/icons-vue'
 
 function next(item: DialogState, data: any) {
   if (item.closeValue === "confirm") {
@@ -85,14 +86,21 @@ const style = (item: DialogState) => {
   <el-dialog
       v-for="(item, index) in dialogStore"
       :key="`cy-dialog_${item.dialogKey}`"
-      :style="style"
+      :style="style(item)"
       class="cy_dialog-v2"
       :class="getClass(item)"
       v-model="item.visible"
       draggable
       v-bind="item.dialogProps"
+      :show-close="false"
       @closed="closed(item, index)"
   >
+    <template #header="{ close, titleId, titleClass }">
+      <div style=" display: flex;  flex-direction: row;  justify-content: space-between;  gap: 16px;">
+        <h4 :id="titleId" :class="titleClass" style="margin: 0">{{ item.dialogProps.title }}</h4>
+        <el-button circle @click="close" icon="Close"/>
+      </div>
+    </template>
     <ConfigProvider :item="item">
       <component
           :is="item.component"
@@ -130,7 +138,7 @@ const style = (item: DialogState) => {
 
 <style lang="scss">
 .cy_dialog-v2 {
-  border-radius: 20px;
+  border-radius: var(--el-dialog-border-radius);
 
   .el-dialog__title {
     font-weight: 600;
@@ -147,7 +155,6 @@ const style = (item: DialogState) => {
 .cy_dialog-v2.el-dialog.is-fullscreen {
   display: flex;
   flex-direction: column;
-  border-radius: 0;
 
   .el-dialog__body {
     flex: 1;