修改目录结构

zs

2025-04-29 716eeb4b87efbdc5b149410bbea4c1f35ac116ac

 HIAWms/web/src/components/BaseDialog/BaseDialog.tsx

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,106 @@
import {
  defineComponent,
  SetupContext,
  computed,
  useSlots,
  Fragment,
} from 'vue'
import { _t } from '@/libs/Language/Language'
import Icon from '../Icon/Icon'
import './BaseDialog.scss'

export default defineComponent({
  emits: ['close', 'confirm', 'open'],
  props: [],
  setup(props, { emit, attrs, slots }: SetupContext) {
    const footer = !!useSlots().footer
    const className = computed(() => {
      if (attrs.class) {
        return `without-cs-dialog ${attrs.class}`
      }
      return 'without-cs-dialog'
    })

    // å…³é—­å¼¹çª—都会调这个方法，有些时候点击confirm的时候不能同时触发close的，加个参数，用于区分是点击按钮关闭的事件还是close事件
    const onClose = (isClose = true) => emit('close', isClose)

    const onConfirm = () => emit('confirm')

    const onOpen = () => emit('open')

    const currentHeight = computed(() => {
      return attrs.height || 'auto'
    })
    return () => {
      return (
        <el-dialog
          class={className.value}
          width="525px"
          v-bind="attrs"
          show-close={false}
          onClose={() => onClose(false)}
          onOpen={onOpen}
          v-slots={{
            header: () => (
              <div class="cs-dialog-content">
                <p>{_t(attrs.title)}</p>
                {!attrs.hideClose ? (
                  <Icon
                    style="cursor: pointer"
                    width={16}
                    height={16}
                    icon="X"
                    onClick={onClose}
                  />
                ) : null}
              </div>
            ),
            footer: () =>
              attrs.isHideFooter ? null : (
                <div class="cs-dialog-footer">
                  {footer ? (
                    // <slot name="footer"></slot>
                    slots?.footer?.()
                  ) : (
                    <Fragment>
                      {slots?.customBtn?.()}
                      {/* <slot name="custom-btn"></slot> */}
                      <el-button
                        onClick={onClose}
                        type="info"
                        plain
                        class="dialog-btn cs-base-btn"
                      >
                        {_t('取消')}
                      </el-button>
                      {!attrs.hideSubmit ? (
                        <el-button
                          v-if=""
                          disabled={attrs.submitDisabled}
                          onClick={onConfirm}
                          type="primary"
                          class="cs-base-btn"
                        >
                          {_t('确认')}
                        </el-button>
                      ) : null}
                    </Fragment>
                  )}
                </div>
              ),
          }}
        >
          <div
            style={`
              height: ${currentHeight};
              overflow: ${attrs.height ? 'auto' : 'initial'};
              padding-right: 20px;
              `}
          >
            {slots?.default?.()}
          </div>
        </el-dialog>
      )
    }
  },
})