系统功能板块setup改造完成

web/src/view/systemTools/autoCode/component/fieldDialog.vue

@@ -30,7 +30,6 @@
           style="width:100%"
           placeholder="请选择field数据类型"
           clearable
-          @change="getDbfdOptions"
         >
           <el-option
             v-for="item in typeOptions"
@@ -79,103 +78,109 @@
   </div>
 </template>
 
-<script>
+<script setup>
+
 import { toLowerCase, toSQLLine } from '@/utils/stringFun'
 import { getSysDictionaryList } from '@/api/sysDictionary'
 import warningBar from '@/components/warningBar/warningBar.vue'
+import { ref, defineProps, defineExpose } from 'vue-demi'
+
+const props = defineProps({
+  dialogMiddle: {
+    type: Object,
+    default: function() {
+      return {}
+    }
+  }
+})
+
+const middleDate = ref({})
+const dictOptions = ref([])
+const typeSearchOptions = ref([
+  {
+    label: '=',
+    value: '='
+  },
+  {
+    label: '<>',
+    value: '<>'
+  },
+  {
+    label: '>',
+    value: '>'
+  },
+  {
+    label: '<',
+    value: '<'
+  },
+  {
+    label: 'LIKE',
+    value: 'LIKE'
+  }
+])
+const typeOptions = ref([
+  {
+    label: '字符串',
+    value: 'string'
+  },
+  {
+    label: '整型',
+    value: 'int'
+  },
+  {
+    label: '布尔值',
+    value: 'bool'
+  },
+  {
+    label: '浮点型',
+    value: 'float64'
+  },
+  {
+    label: '时间',
+    value: 'time.Time'
+  }
+])
+const rules = ref({
+  fieldName: [
+    { required: true, message: '请输入field英文名', trigger: 'blur' }
+  ],
+  fieldDesc: [
+    { required: true, message: '请输入field中文名', trigger: 'blur' }
+  ],
+  fieldJson: [
+    { required: true, message: '请输入field格式化json', trigger: 'blur' }
+  ],
+  columnName: [
+    { required: true, message: '请输入数据库字段', trigger: 'blur' }
+  ],
+  fieldType: [
+    { required: true, message: '请选择field数据类型', trigger: 'blur' }
+  ]
+})
+
+const init = async() => {
+  middleDate.value = props.dialogMiddle
+  const dictRes = await getSysDictionaryList({
+    page: 1,
+    pageSize: 999999
+  })
+
+  dictOptions.value = dictRes.data.list
+}
+init()
+
+const autoFill = () => {
+  middleDate.value.fieldJson = toLowerCase(middleDate.value.fieldName)
+  middleDate.value.columnName = toSQLLine(middleDate.value.fieldJson)
+}
+
+const fieldDialogFrom = ref(null)
+defineExpose({ fieldDialogFrom })
+</script>
+
+<script>
 
 export default {
-  name: 'FieldDialog',
-  components: { warningBar },
-  props: {
-    dialogMiddle: {
-      type: Object,
-      default: function() {
-        return {}
-      }
-    }
-  },
-  data() {
-    return {
-      middleDate: {},
-      dictOptions: [],
-      typeSearchOptions: [
-        {
-          label: '=',
-          value: '='
-        },
-        {
-          label: '<>',
-          value: '<>'
-        },
-        {
-          label: '>',
-          value: '>'
-        },
-        {
-          label: '<',
-          value: '<'
-        },
-        {
-          label: 'LIKE',
-          value: 'LIKE'
-        }
-      ],
-      typeOptions: [
-        {
-          label: '字符串',
-          value: 'string'
-        },
-        {
-          label: '整型',
-          value: 'int'
-        },
-        {
-          label: '布尔值',
-          value: 'bool'
-        },
-        {
-          label: '浮点型',
-          value: 'float64'
-        },
-        {
-          label: '时间',
-          value: 'time.Time'
-        }
-      ],
-      rules: {
-        fieldName: [
-          { required: true, message: '请输入field英文名', trigger: 'blur' }
-        ],
-        fieldDesc: [
-          { required: true, message: '请输入field中文名', trigger: 'blur' }
-        ],
-        fieldJson: [
-          { required: true, message: '请输入field格式化json', trigger: 'blur' }
-        ],
-        columnName: [
-          { required: true, message: '请输入数据库字段', trigger: 'blur' }
-        ],
-        fieldType: [
-          { required: true, message: '请选择field数据类型', trigger: 'blur' }
-        ]
-      }
-    }
-  },
-  async created() {
-    this.middleDate = this.dialogMiddle
-    const dictRes = await getSysDictionaryList({
-      page: 1,
-      pageSize: 999999
-    })
-
-    this.dictOptions = dictRes.data.list
-  },
-  methods: {
-    autoFill() {
-      this.middleDate.fieldJson = toLowerCase(this.middleDate.fieldName)
-      this.middleDate.columnName = toSQLLine(this.middleDate.fieldJson)
-    },
-  }
+  name: 'FieldDialog'
 }
 </script>

web/src/view/systemTools/autoCode/component/previewCodeDialg.vue

@@ -8,70 +8,78 @@
   </div>
 </template>
 
-<script>
+<script setup>
 import marked from 'marked'
 import hljs from 'highlight.js'
-// import 'highlight.js/styles/atelier-cave-light.css';
 import 'highlight.js/styles/atelier-plateau-light.css'
-export default {
-  props: {
-    previewCode: {
-      type: Object,
-      default() {
-        return {}
-      }
-    }
-  },
-  data() {
-    return {
-      activeName: ''
-    }
-  },
-  mounted() {
-    marked.setOptions({
-      renderer: new marked.Renderer(),
-      highlight: function(code) {
-        return hljs.highlightAuto(code).value
-      },
-      pedantic: false,
-      gfm: true,
-      tables: true,
-      breaks: false,
-      sanitize: false,
-      smartLists: true,
-      smartypants: false,
-      xhtml: false
-    })
-    for (const key in this.previewCode) {
-      if (this.activeName === '') {
-        this.activeName = key
-      }
-      document.getElementById(key).innerHTML = marked(this.previewCode[key])
-    }
-  },
-  methods: {
-    selectText() {
-      const element = document.getElementById(this.activeName)
-      if (document.body.createTextRange) {
-        const range = document.body.createTextRange()
-        range.moveToElementText(element)
-        range.select()
-      } else if (window.getSelection) {
-        const selection = window.getSelection()
-        const range = document.createRange()
-        range.selectNodeContents(element)
-        selection.removeAllRanges()
-        selection.addRange(range)
-      } else {
-        alert('none')
-      }
-    },
-    copy() {
-      this.selectText()
-      document.execCommand('copy')
-      this.$message.success('复制成功')
+import { onMounted, ref } from 'vue-demi'
+import { ElMessage } from 'element-plus'
+import { defineProps, defineExpose } from 'vue'
+
+const props = defineProps({
+  previewCode: {
+    type: Object,
+    default() {
+      return {}
     }
   }
+})
+
+onMounted(() => {
+  marked.setOptions({
+    renderer: new marked.Renderer(),
+    highlight: function(code) {
+      return hljs.highlightAuto(code).value
+    },
+    pedantic: false,
+    gfm: true,
+    tables: true,
+    breaks: false,
+    sanitize: false,
+    smartLists: true,
+    smartypants: false,
+    xhtml: false
+  })
+  for (const key in props.previewCode) {
+    if (this.activeName === '') {
+      this.activeName = key
+    }
+    document.getElementById(key).innerHTML = marked(props.previewCode[key])
+  }
+})
+
+const activeName = ref('')
+
+const selectText = () => {
+  const element = document.getElementById(activeName.value)
+  if (document.body.createTextRange) {
+    const range = document.body.createTextRange()
+    range.moveToElementText(element)
+    range.select()
+  } else if (window.getSelection) {
+    const selection = window.getSelection()
+    const range = document.createRange()
+    range.selectNodeContents(element)
+    selection.removeAllRanges()
+    selection.addRange(range)
+  } else {
+    alert('none')
+  }
+}
+const copy = () => {
+  selectText()
+  document.execCommand('copy')
+  ElMessage.success('复制成功')
+}
+
+defineExpose({ copy })
+
+</script>
+
+<script>
+
+export default {
+
 }
 </script>