customer_common/src/components/frame/c-dialog.vue

<template>
  <div id="e-dialog">
    <el-dialog :title="dialog.title" :visible.sync="dialog.show" :width="width" :before-close="toClose"
               :close-on-click-modal="false" :append-to-body="true">
      <slot>
        <slot name="info"></slot>
      </slot>
    </el-dialog>
  </div>
</template>

<script>
import { mapState, createNamespacedHelpers } from 'vuex';
export default {
  name: 'e-dialog',
  props: {
    dialog: { type: Object, default: () => { } },
    width: { type: String, default: '50%' },
  },
  components: {},
  data: function () {
    return {};
  },
  created() { },
  methods: {
    toClose() {
      this.$emit('toClose');
    },
  },
  computed: {
    ...mapState(['user']),
  },
  metaInfo() {
    return { title: this.$route.meta.title };
  },
  watch: {
    test: {
      deep: true,
      immediate: true,
      handler(val) { },
    },
  },
};
</script>

<style lang="less" scoped>
/deep/.el-dialog__body {
  padding: 10px;
  min-height: 30px;
  max-height: 400px;
  overflow-y: auto;
}
</style>