@ebiz/designer-components 0.0.58 → 0.0.59

package/src/components/ebiz-form/components/video-multi-language.vue

@@ -1,51 +1,51 @@
-<template>
-  <div style="display: flex">
-    <div style="flex: 1;">
-      <form-video v-model="value.default" v-bind:item="item" @input="handleChange" />
-    </div>
-    <div v-if="item.multiLanguage" style="margin-left: 0px;">
-      <t-button @click="showMultiLanguageSetting" size="small" theme="primary" variant="text">{{
-        $t("form.multiLanguageSetting") }}</t-button>
-    </div>
-
-    <t-dialog v-model:visible="multiSettingVisible" :header="item.label" width="800px" :confirm-btn="null"
-      cancel-btn="关闭">
-      <div>
-        <div v-for="(language, index) in languages" style="margin-bottom: 10px; width: 100%;">
-          <t-form-item :key="index" :label="language.name" label-width="150px">
-            <div style="width: 100%">
-              <form-video v-model="value[language.key]" v-bind:item="item" @input="handleChange" />
-            </div>
-          </t-form-item>
-        </div>
-      </div>
-    </t-dialog>
-  </div>
-</template>
-
-<script setup>
-import { ref } from "vue"
-const value = defineModel()
-defineProps(['item'])
-
-const emit = defineEmits(['input', 'blue', 'change', 'clear', 'click'])
-const multiSettingVisible = ref(false);
-// import {getLanguageList} from "../../../../api/language"
-import FormVideo from "./video.vue";
-const languages = []
-
-// 显示多语言设置
-const showMultiLanguageSetting = () => {
-  multiSettingVisible.value = true
-}
-
-const handleChange = (value, option) => {
-  emit('input', { value });
-}
-
-const onEvent = (event, val) => {
-  emit(event, val)
-}
-</script>
-
-<style lang="less" scoped></style>
+<template>
+  <div style="display: flex">
+    <div style="flex: 1;">
+      <form-video v-model="value.default" v-bind:item="item" @input="handleChange" />
+    </div>
+    <div v-if="item.multiLanguage" style="margin-left: 0px;">
+      <t-button @click="showMultiLanguageSetting" size="small" theme="primary" variant="text">{{
+        $t("form.multiLanguageSetting") }}</t-button>
+    </div>
+
+    <t-dialog v-model:visible="multiSettingVisible" :header="item.label" width="800px" :confirm-btn="null"
+      cancel-btn="关闭">
+      <div>
+        <div v-for="(language, index) in languages" style="margin-bottom: 10px; width: 100%;">
+          <t-form-item :key="index" :label="language.name" label-width="150px">
+            <div style="width: 100%">
+              <form-video v-model="value[language.key]" v-bind:item="item" @input="handleChange" />
+            </div>
+          </t-form-item>
+        </div>
+      </div>
+    </t-dialog>
+  </div>
+</template>
+
+<script setup>
+import { ref } from "vue"
+const value = defineModel()
+defineProps(['item'])
+
+const emit = defineEmits(['input', 'blue', 'change', 'clear', 'click'])
+const multiSettingVisible = ref(false);
+// import {getLanguageList} from "../../../../api/language"
+import FormVideo from "./video.vue";
+const languages = []
+
+// 显示多语言设置
+const showMultiLanguageSetting = () => {
+  multiSettingVisible.value = true
+}
+
+const handleChange = (value, option) => {
+  emit('input', { value });
+}
+
+const onEvent = (event, val) => {
+  emit(event, val)
+}
+</script>
+
+<style lang="less" scoped></style>

package/src/components/ebiz-form/components/video.vue

@@ -1,97 +1,97 @@
-<template>
-  <div>
-    <div>
-      <t-upload v-if="!value || value.length == 0" ref="uploadRef" v-model="videoValue" :request-method="requestMethod"
-        theme="file" :abridgeName="item.abridgeName" :accept="item.accept || 'video/*'"
-        :allowUploadDuplicateFile="item.allowUploadDuplicateFile" :disabled="item.disabled"
-        :dragContent="item.dragContent" :draggable="item.draggable" :fileListDisplay="item.fileListDisplay"
-        :files="item.files" :format="item.format" :max="item.max" :mockProgressDuration="item.mockProgressDuration"
-        :placeholder="item.placeholder" :showImageFileName="item.showImageFileName" :showThumbnail="item.showThumbnail"
-        :showUploadProgress="item.showUploadProgress" :sizeLimit="item.sizeLimit" :status="item.status"
-        :tips="item.tips" :uploadPastedFiles="item.uploadPastedFiles" @change="valueChange">
-      </t-upload>
-      <div v-if="value && value.length > 0" style="display: flex; position: relative;">
-        <video :src="value" controls width="400"></video>
-        <div style="position: absolute; top: 5px; left: 335px;">
-          <t-button theme="danger" @click="remove" style="margin-left: 10px;">
-            <template #icon>
-              <t-icon name="delete"></t-icon>
-            </template>
-            <!--            移除视频-->
-          </t-button>
-        </div>
-
-      </div>
-    </div>
-
-
-  </div>
-</template>
-<script setup lang="ts">
-import { reactive, ref, watch } from "vue"
-// import {upload} from "../../../../utils/upload"
-import { RequestMethodResponse } from "tdesign-vue-next";
-
-const value = defineModel<any>()
-const props = defineProps(['item'])
-let videoValue = reactive([])
-
-if (value.value !== undefined && value.value !== null && value.value !== "" && value.value.length > 0) {
-  videoValue = [{
-    url: value.value
-  }]
-}
-
-watch(value, (newVal, oldValue) => {
-  if (newVal !== "" && newVal.length > 0) {
-    videoValue = [{
-      url: value.value
-    }]
-  } else {
-    videoValue = [];
-  }
-})
-const valueChange = (files: Array<any>) => {
-  if (files.length == 0) {
-    value.value = ""
-  } else {
-    value.value = files[0].url
-  }
-}
-
-const uploadRef = ref(null)
-
-const emit = defineEmits(['input'])
-
-const onInputEvent = () => {
-  emit('input', value.value)
-}
-const remove = () => {
-  value.value = []
-  videoValue = []
-}
-
-const requestMethod = (file: any) => {
-  return new Promise<RequestMethodResponse>((resolve, reject) => {
-    // upload({
-    //   path: props.item.path || 'upload',
-    //   file: file,
-    //   onPercent: (e: any) => {
-    //     console.log(e.file, e.percent)
-    //   },
-    //   onSuccess: (res: any) => {
-    //     resolve({
-    //       status: "success",
-    //       response: {
-    //         url: res.url
-    //       }
-    //     });
-    //     onInputEvent()
-    //   },
-    //   onFail: () => {
-
-    //   }
-    // })
-  })
-}
-</script>
+<template>
+  <div>
+    <div>
+      <t-upload v-if="!value || value.length == 0" ref="uploadRef" v-model="videoValue" :request-method="requestMethod"
+        theme="file" :abridgeName="item.abridgeName" :accept="item.accept || 'video/*'"
+        :allowUploadDuplicateFile="item.allowUploadDuplicateFile" :disabled="item.disabled"
+        :dragContent="item.dragContent" :draggable="item.draggable" :fileListDisplay="item.fileListDisplay"
+        :files="item.files" :format="item.format" :max="item.max" :mockProgressDuration="item.mockProgressDuration"
+        :placeholder="item.placeholder" :showImageFileName="item.showImageFileName" :showThumbnail="item.showThumbnail"
+        :showUploadProgress="item.showUploadProgress" :sizeLimit="item.sizeLimit" :status="item.status"
+        :tips="item.tips" :uploadPastedFiles="item.uploadPastedFiles" @change="valueChange">
+      </t-upload>
+      <div v-if="value && value.length > 0" style="display: flex; position: relative;">
+        <video :src="value" controls width="400"></video>
+        <div style="position: absolute; top: 5px; left: 335px;">
+          <t-button theme="danger" @click="remove" style="margin-left: 10px;">
+            <template #icon>
+              <t-icon name="delete"></t-icon>
+            </template>
+            <!--            移除视频-->
+          </t-button>
+        </div>
+
+      </div>
+    </div>
+
+
+  </div>
+</template>
+<script setup lang="ts">
+import { reactive, ref, watch } from "vue"
+// import {upload} from "../../../../utils/upload"
+import { RequestMethodResponse } from "tdesign-vue-next";
+
+const value = defineModel<any>()
+const props = defineProps(['item'])
+let videoValue = reactive([])
+
+if (value.value !== undefined && value.value !== null && value.value !== "" && value.value.length > 0) {
+  videoValue = [{
+    url: value.value
+  }]
+}
+
+watch(value, (newVal, oldValue) => {
+  if (newVal !== "" && newVal.length > 0) {
+    videoValue = [{
+      url: value.value
+    }]
+  } else {
+    videoValue = [];
+  }
+})
+const valueChange = (files: Array<any>) => {
+  if (files.length == 0) {
+    value.value = ""
+  } else {
+    value.value = files[0].url
+  }
+}
+
+const uploadRef = ref(null)
+
+const emit = defineEmits(['input'])
+
+const onInputEvent = () => {
+  emit('input', value.value)
+}
+const remove = () => {
+  value.value = []
+  videoValue = []
+}
+
+const requestMethod = (file: any) => {
+  return new Promise<RequestMethodResponse>((resolve, reject) => {
+    // upload({
+    //   path: props.item.path || 'upload',
+    //   file: file,
+    //   onPercent: (e: any) => {
+    //     console.log(e.file, e.percent)
+    //   },
+    //   onSuccess: (res: any) => {
+    //     resolve({
+    //       status: "success",
+    //       response: {
+    //         url: res.url
+    //       }
+    //     });
+    //     onInputEvent()
+    //   },
+    //   onFail: () => {
+
+    //   }
+    // })
+  })
+}
+</script>

package/src/components/ebiz-form/index.vue

@@ -1,157 +1,157 @@
-<template>
-  <div style="width: 100%; display: flex;">
-
-    <div style="flex: 1;">
-      <form-text v-if="item.type === 'text' && !item.multiLanguage" v-model="value" :item="item" @input="handleChange">
-      </form-text>
-
-      <form-text-multi-language v-if="item.type === 'text' && item.multiLanguage" v-model="value" :item="item" @input="handleChange">
-      </form-text-multi-language>
-
-      <form-select
-        v-model="value"
-        v-else-if="item.type === 'select'"
-        :item="item"
-        @input="handleChange"
-      >
-      </form-select>
-
-      <form-textarea
-        v-else-if="item.type === 'textarea' && !item.multiLanguage"
-        v-model="value"
-        v-bind:item="item"
-        @input="handleChange"
-      />
-
-      <form-textarea-multi-language
-        v-else-if="item.type === 'textarea' && item.multiLanguage"
-        v-model="value"
-        v-bind:item="item"
-        @input="handleChange"
-      />
-
-      <form-video
-        v-else-if="item.type === 'video' && !item.multiLanguage"
-        v-model="value"
-        v-bind:item="item"
-        @input="handleChange"
-      />
-
-      <form-video-multi-language
-        v-else-if="item.type === 'video' && item.multiLanguage"
-        v-model="value"
-        data_source="article"
-        v-bind:item="item"
-        @onChangeContent="handleChange"
-      />
-
-      <div v-else-if="item.type === 'editor'">
-        <form-editor
-          v-if="!item.multiLanguage"
-          v-model="value"
-          data_source="article"
-          v-bind:item="item"
-          @onChangeContent="handleChange"
-        />
-
-        <form-editor-multi-language
-          v-else
-          v-model="value"
-          data_source="article"
-          v-bind:item="item"
-          @onChangeContent="handleChange"
-        />
-      </div>
-
-
-      <form-checkbox v-else-if="item.type === 'checkbox'" v-model="value" v-bind:item="item" @input="handleChange"/>
-
-      <form-radio v-else-if="item.type === 'radio'" v-model="value" v-bind:item="item" @input="handleChange"/>
-
-      <form-switch v-else-if="item.type === 'switch'" v-model="value" v-bind:item="item" @input="handleChange"/>
-
-      <form-img v-else-if="item.type === 'img' && !item.multiLanguage" v-model="value" v-bind:item="item" @input="handleChange"/>
-      <form-img-multi-language v-else-if="item.type === 'img' && item.multiLanguage" v-model="value" v-bind:item="item" @input="handleChange"/>
-
-
-      <form-images v-else-if="item.type === 'images' && !item.multiLanguage" v-model="value" v-bind:item="item" @input="handleChange"/>
-      <form-images-multi-language v-else-if="item.type === 'images' && item.multiLanguage" v-model="value" v-bind:item="item" @input="handleChange"/>
-
-      <form-date v-else-if="item.type === 'date'" v-model="value" v-bind:item="item" @input="handleChange"/>
-
-      <form-date-range v-else-if="item.type === 'date-range'" v-model="value" v-bind:item="item" @input="handleChange"/>
-
-      <form-date-panel v-else-if="item.type === 'date-panel'" v-model="value" v-bind:item="item" @input="handleChange"/>
-
-      <form-date-range-panel v-else-if="item.type === 'date-range-panel'" v-model="value" v-bind:item="item"
-                             @input="handleChange"/>
-
-      <form-number v-else-if="item.type === 'number'" v-model="value" v-bind:item="item" @input="handleChange">
-        <template #label>
-          <slot name="label"></slot>
-        </template>
-        <template #suffix>
-          <slot name="suffix"></slot>
-        </template>
-      </form-number>
-
-      <form-cascader v-else-if="item.type === 'cascader'" v-model="value" v-bind:item="item" @input="handleChange"/>
-
-      <form-file v-else-if="item.type === 'file' && !item.multiLanguage" v-model="value" v-bind:item="item" @input="handleChange"/>
-      <form-file-multi-language v-else-if="item.type === 'file' && item.multiLanguage" v-model="value" v-bind:item="item" @input="handleChange"/>
-
-
-      <form-city
-        v-else-if="item.type === 'city'"
-        v-model:default="value"
-        v-bind:item="item"
-        @input="handleChange"/>
-    </div>
-
-  </div>
-
-</template>
-
-<script setup>
-import FormText from './components/text.vue';
-import FormTextMultiLanguage from './components/text-multi-language.vue';
-
-import FormSelect from './components/select.vue';
-import FormImages from './components/images.vue';
-import FormImagesMultiLanguage from './components/images-multi-language.vue';
-
-import FormTextarea from './components/textarea.vue';
-import FormTextareaMultiLanguage from './components/textarea-multi-language.vue';
-
-import FormImg from './components/img.vue';
-import FormImgMultiLanguage from './components/img-multi-language.vue';
-
-import FormDate from './components/date.vue';
-import FormDateRange from './components/date-range.vue';
-import FormDatePanel from './components/date-panel.vue';
-import FormDateRangePanel from './components/date-range-panel.vue';
-
-import FormEditor from './components/editor.vue';
-import FormEditorMultiLanguage from './components/editor-multi-language.vue';
-
-import FormSwitch from './components/switch.vue';
-import FormNumber from './components/number.vue';
-import FormCascader from './components/cascader.vue';
-import FormFile from './components/file.vue';
-import FormFileMultiLanguage from './components/file-multi-language.vue';
-
-import FormVideo from './components/video.vue';
-import FormVideoMultiLanguage from './components/video-multi-language.vue';
-
-import FormRadio from './components/radio.vue';
-import FormCheckbox from './components/checkbox.vue';
-import FormCity from './components/city.vue';
-
-const value = defineModel()
-defineProps(['item', 'lang',])
-let emit = defineEmits(['input'])
-
-const handleChange = (value, option) => {
-  emit('input', {value});
-}
-</script>
+<template>
+  <div style="width: 100%; display: flex;">
+
+    <div style="flex: 1;">
+      <form-text v-if="item.type === 'text' && !item.multiLanguage" v-model="value" :item="item" @input="handleChange">
+      </form-text>
+
+      <form-text-multi-language v-if="item.type === 'text' && item.multiLanguage" v-model="value" :item="item" @input="handleChange">
+      </form-text-multi-language>
+
+      <form-select
+        v-model="value"
+        v-else-if="item.type === 'select'"
+        :item="item"
+        @input="handleChange"
+      >
+      </form-select>
+
+      <form-textarea
+        v-else-if="item.type === 'textarea' && !item.multiLanguage"
+        v-model="value"
+        v-bind:item="item"
+        @input="handleChange"
+      />
+
+      <form-textarea-multi-language
+        v-else-if="item.type === 'textarea' && item.multiLanguage"
+        v-model="value"
+        v-bind:item="item"
+        @input="handleChange"
+      />
+
+      <form-video
+        v-else-if="item.type === 'video' && !item.multiLanguage"
+        v-model="value"
+        v-bind:item="item"
+        @input="handleChange"
+      />
+
+      <form-video-multi-language
+        v-else-if="item.type === 'video' && item.multiLanguage"
+        v-model="value"
+        data_source="article"
+        v-bind:item="item"
+        @onChangeContent="handleChange"
+      />
+
+      <div v-else-if="item.type === 'editor'">
+        <form-editor
+          v-if="!item.multiLanguage"
+          v-model="value"
+          data_source="article"
+          v-bind:item="item"
+          @onChangeContent="handleChange"
+        />
+
+        <form-editor-multi-language
+          v-else
+          v-model="value"
+          data_source="article"
+          v-bind:item="item"
+          @onChangeContent="handleChange"
+        />
+      </div>
+
+
+      <form-checkbox v-else-if="item.type === 'checkbox'" v-model="value" v-bind:item="item" @input="handleChange"/>
+
+      <form-radio v-else-if="item.type === 'radio'" v-model="value" v-bind:item="item" @input="handleChange"/>
+
+      <form-switch v-else-if="item.type === 'switch'" v-model="value" v-bind:item="item" @input="handleChange"/>
+
+      <form-img v-else-if="item.type === 'img' && !item.multiLanguage" v-model="value" v-bind:item="item" @input="handleChange"/>
+      <form-img-multi-language v-else-if="item.type === 'img' && item.multiLanguage" v-model="value" v-bind:item="item" @input="handleChange"/>
+
+
+      <form-images v-else-if="item.type === 'images' && !item.multiLanguage" v-model="value" v-bind:item="item" @input="handleChange"/>
+      <form-images-multi-language v-else-if="item.type === 'images' && item.multiLanguage" v-model="value" v-bind:item="item" @input="handleChange"/>
+
+      <form-date v-else-if="item.type === 'date'" v-model="value" v-bind:item="item" @input="handleChange"/>
+
+      <form-date-range v-else-if="item.type === 'date-range'" v-model="value" v-bind:item="item" @input="handleChange"/>
+
+      <form-date-panel v-else-if="item.type === 'date-panel'" v-model="value" v-bind:item="item" @input="handleChange"/>
+
+      <form-date-range-panel v-else-if="item.type === 'date-range-panel'" v-model="value" v-bind:item="item"
+                             @input="handleChange"/>
+
+      <form-number v-else-if="item.type === 'number'" v-model="value" v-bind:item="item" @input="handleChange">
+        <template #label>
+          <slot name="label"></slot>
+        </template>
+        <template #suffix>
+          <slot name="suffix"></slot>
+        </template>
+      </form-number>
+
+      <form-cascader v-else-if="item.type === 'cascader'" v-model="value" v-bind:item="item" @input="handleChange"/>
+
+      <form-file v-else-if="item.type === 'file' && !item.multiLanguage" v-model="value" v-bind:item="item" @input="handleChange"/>
+      <form-file-multi-language v-else-if="item.type === 'file' && item.multiLanguage" v-model="value" v-bind:item="item" @input="handleChange"/>
+
+
+      <form-city
+        v-else-if="item.type === 'city'"
+        v-model:default="value"
+        v-bind:item="item"
+        @input="handleChange"/>
+    </div>
+
+  </div>
+
+</template>
+
+<script setup>
+import FormText from './components/text.vue';
+import FormTextMultiLanguage from './components/text-multi-language.vue';
+
+import FormSelect from './components/select.vue';
+import FormImages from './components/images.vue';
+import FormImagesMultiLanguage from './components/images-multi-language.vue';
+
+import FormTextarea from './components/textarea.vue';
+import FormTextareaMultiLanguage from './components/textarea-multi-language.vue';
+
+import FormImg from './components/img.vue';
+import FormImgMultiLanguage from './components/img-multi-language.vue';
+
+import FormDate from './components/date.vue';
+import FormDateRange from './components/date-range.vue';
+import FormDatePanel from './components/date-panel.vue';
+import FormDateRangePanel from './components/date-range-panel.vue';
+
+import FormEditor from './components/editor.vue';
+import FormEditorMultiLanguage from './components/editor-multi-language.vue';
+
+import FormSwitch from './components/switch.vue';
+import FormNumber from './components/number.vue';
+import FormCascader from './components/cascader.vue';
+import FormFile from './components/file.vue';
+import FormFileMultiLanguage from './components/file-multi-language.vue';
+
+import FormVideo from './components/video.vue';
+import FormVideoMultiLanguage from './components/video-multi-language.vue';
+
+import FormRadio from './components/radio.vue';
+import FormCheckbox from './components/checkbox.vue';
+import FormCity from './components/city.vue';
+
+const value = defineModel()
+defineProps(['item', 'lang',])
+let emit = defineEmits(['input'])
+
+const handleChange = (value, option) => {
+  emit('input', {value});
+}
+</script>