!25 部分优化以及新增功能 Merge pull request !25 from ahaos/tspr

疯狂的狮子Li

2023-07-11 c13c622eac5551c6f099f148feb5256711ca34de

 src/components/BuildCode/index.vue

对比新文件
@@ -0,0 +1,64 @@
<!-- 浠ｇ爜鏋勫缓 -->
<script setup lang="ts">

const props = defineProps({
  showBtn: {
    type: Boolean,
    default: false
  },
  formJson: {
    type: Object,
    default: undefined
  }
})
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const buildRef = ref();
const emits = defineEmits(['reJson', 'saveDesign']);



//鑾峰彇琛ㄥ崟json
const getJson = () => {
  const formJson = JSON.stringify(buildRef.value.getFormJson())
  const fieldJson = JSON.stringify(buildRef.value.getFieldWidgets())
  let data = {
    formJson, fieldJson
  }
  emits("saveDesign", data)
}

onMounted(() => {
  if (props.formJson) {
    buildRef.value.setFormJson(props.formJson)
  }
})
</script>

<template>
  <div>
    <v-form-designer
      class="build"
      ref="buildRef"
      :designer-config="{ importJsonButton: true, exportJsonButton: true, exportCodeButton: true, generateSFCButton: true, formTemplates: true }"
    >
      <template #customToolButtons v-if="showBtn">
        <el-button link type="primary" icon="Select" @click="getJson">淇濆瓨</el-button>
      </template>
    </v-form-designer>
  </div>
</template>

<style lang="scss">
.build {
  margin: 0 !important;
  overflow-y: auto !important;

  & header.main-header {
    display: none;
  }

  & .right-toolbar-con {
    text-align: right !important;
  }
}
</style>