drp-ui/src/views/input-dialog/index.vue

<script>
export default {
  name: "DrInputDialog",
  props: ["value", "title", "type", "dataMapping", "source"],
  components: {
    InputDialog: () => import("./components/index.vue"),
  },
  data() {
    return {};
  },
  computed: {},
  watch: {},
  methods: {
    handleAsyncOpenDialog() {
      this.$emit("before-open");
      this.$nextTick(() => {
        const { setVisible } = this.$refs.InputDialogFef;
        setVisible(true);
      });
    },
    handleUpdateSource(prop) {
      const { source, dataMapping } = this.$props;
      for (let key in dataMapping) {
        source[key] = prop[dataMapping[key]];
      }
      this.$emit("update:source", source);
    },
  },
  created() {
    console.log("prop", this.$props);
  },
  mounted() {},
  destroyed() {},
};
</script>
<template>
  <el-input
    v-model="value"
    style="width: 100%; cursor: pointer"
    @click.native.stop="handleAsyncOpenDialog"
  >
    <template #suffix>
      <el-icon class="el-icon-thumb"></el-icon>
      <input-dialog
        ref="InputDialogFef"
        :title="title"
        :type="type"
        @confirm="handleUpdateSource"
      ></input-dialog>
    </template>
  </el-input>
</template>
<style scoped></style>