widget.qw 1.0.70 → 1.0.72

package/src/components/FilePicker.vue

@@ -2,9 +2,10 @@
     <van-field v-if="!isGone" name="image" :label="props.label" :required="isRequired" :rules="props.rules"
         label-class="label" :placeholder="props.placeholder">
         <template #input>
-            <div class="image-box">
-                <van-uploader v-model="files" :max-count="1" :afterRead="onAfterRead" :disabled="isDisabled"
-                    :accept="props.accept" upload-icon="plus" :deletable="!isDisabled" :before-delete="onBeforeDelete" />
+            <div class="file-box">
+                <van-uploader v-model="files" :max-count="props.max" :afterRead="onAfterRead" :disabled="isDisabled"
+                    :accept="props.accept" upload-icon="plus" :deletable="!isDisabled"
+                    :before-delete="onBeforeDelete" />
             </div>
         </template>
     </van-field>
@@ -17,13 +18,17 @@ import { useVModel } from "@vueuse/core"
 
 const props = defineProps({
     modelValue: {
-        type: String,
-        default: ''
+        type: [String, Array],
+        default: null
     },
     label: {
         type: String,
         default: ''
     },
+    multiple: {
+        type: Boolean,
+        default: false
+    },
     required: {
         type: Boolean,
         default: false
@@ -67,26 +72,50 @@ const onAfterRead = async (file) => {
     }
 
     return util.file_upload(params).then(res => {
-        modelValue.value = res.data
+        if (props.multiple)
+            modelValue.value = [...(modelValue.value || []), res.data]
+        else
+            modelValue.value = res.data
         return Promise.resolve(file)
     })
 }
 
 const onBeforeDelete = (e) => {
-    modelValue.value = ''
+    if (props.multiple) {
+        let newUrls = props.modelValue.filter(item => {
+            return item != e.url
+        })
+        emit('update:modelValue', newUrls)
+    } else {
+        modelValue.value = ''
+    }
+
     return Promise.resolve(e)
 }
 
 watch(() => props.modelValue,
     (newVal, oldVal) => {
-        if (!props.modelValue) {
-            files.value = []
-            return
-        }
+        if (props.multiple) {
+            if (!props.modelValue || props.modelValue.length < 1) {
+                files.value = []
+                return
+            }
 
-        files.value = [{
-            url: props.modelValue
-        }]
+            files.value = props.modelValue.map(item => {
+                return {
+                    url: item
+                }
+            })
+        } else {
+            if (!props.modelValue) {
+                files.value = []
+                return
+            }
+
+            files.value = [{
+                url: props.modelValue
+            }]
+        }
     },
     {
         immediate: true

package/src/components/ObjsEditor.vue

@@ -8,7 +8,12 @@
                         <van-icon name="arrow-left" @click.stop="onForward(index)" />
                         <div style="padding: 5px 5px;">
                             <div v-for="(k, j) in visiableKeys" :key="j" style="padding:2px 2px;font-size: 12px;">
-                                {{ `${key2name(k)}:${key2value(k, item)}` }}
+                                <div v-if="props.schema[k].type != 'Images'">
+                                    {{ `${key2name(k)}:${key2value(k, item)}` }}
+                                </div>
+                                <div v-else>
+                                    <ImagesPicker v-model="item[k]" readonly/>
+                                </div>
                             </div>
                         </div>
 
@@ -45,6 +50,9 @@
                                 <DatetimePicker v-if="props.schema[key].type == 'Datetime'"
                                     v-model="data.inputValue[key]" placeholder="选择时间" />
 
+                                <ImagesPicker v-if="props.schema[key].type == 'Images'"
+                                    v-model="data.inputValue[key]" />
+
                                 <DateSelector v-if="props.schema[key]?.schema?.options" v-model="data.inputValue[key]"
                                     :options="props.schema[key]?.schema?.options" :placeholder="`请输入${key2name(key)}`"
                                     :columnsFieldNames="{
@@ -77,6 +85,7 @@ import { useVModel } from '@vueuse/core'
 import util from '@/util'
 import DatetimePicker from './DatetimePicker/index.vue'
 import DateSelector from './data_selector.vue'
+import ImagesPicker from './images_picker.vue'
 
 const props = defineProps({
     modelValue: {
@@ -176,7 +185,10 @@ const key2value = (key, item) => {
     console.log('key2value', key, item[key], item)
 
     let v = item[key]
-    if (Array.isArray(v)) {
+    if (props.schema[key].type === 'Images') {
+        return (v || []).join(',')
+    }
+    else if (Array.isArray(v)) {
         let formatValues = v.map(e => {
             let kvs = Object.keys(e).map(k => {
                 console.log(props.schema[key])

package/src/components/image_picker.vue

@@ -5,11 +5,11 @@
             <div class="image-box">
                 <van-uploader v-if="props.capture" v-model="files" :max-count="1" :capture="props.capture"
                     accept="image/jpeg,image/png" :afterRead="onAfterRead" :disabled="isDisabled"
-                    :deletable="!isDisabled" :before-delete="onBeforeDelete"
+                    :deletable="!isReadonly && !isDisabled" :before-delete="onBeforeDelete" :show-upload="!isReadonly"
                      />
                 <van-uploader v-else v-model="files" :max-count="1" accept="image/jpeg,image/png"
-                    :afterRead="onAfterRead" :disabled="isDisabled" :deletable="!isDisabled"
-                    :before-delete="onBeforeDelete"
+                    :afterRead="onAfterRead" :disabled="isDisabled" :deletable="!isReadonly && !isDisabled"
+                    :before-delete="onBeforeDelete" :show-upload="!isReadonly"
                      />
             </div>
         </template>

package/src/components/images_picker.vue

@@ -4,11 +4,11 @@
         <template #input>
             <div class="image-box">
                 <van-uploader v-if="props.capture" v-model="files" :max-count="props.max" :capture="props.capture"
-                    accept="image/jpeg,image/png" :disabled="isDisabled" :deletable="!isDisabled"
-                    :afterRead="onAfterRead" :before-delete="onBeforeDelete" />
+                    accept="image/jpeg,image/png" :disabled="isDisabled" :deletable="!isRequired && !isDisabled"
+                    :afterRead="onAfterRead" :before-delete="onBeforeDelete" :show-upload="!isReadonly"/>
                 <van-uploader v-else v-model="files" :max-count="props.max" accept="image/jpeg,image/png"
-                    :disabled="isDisabled" :deletable="!isDisabled" :afterRead="onAfterRead"
-                    :before-delete="onBeforeDelete" />
+                    :disabled="isDisabled" :deletable="!isReadonly && !isDisabled" :afterRead="onAfterRead"
+                    :before-delete="onBeforeDelete" :show-upload="!isReadonly"/>
             </div>
         </template>
     </van-field>

package/src/env.d.ts

@@ -1,8 +1,8 @@
-/// <reference types="vite/client" />
-
-declare module '*.vue' {
-  import type { DefineComponent } from 'vue'
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
-  const component: DefineComponent<{}, {}, any>
-  export default component
-}
+/// <reference types="vite/client" />
+
+declare module '*.vue' {
+  import type { DefineComponent } from 'vue'
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
+  const component: DefineComponent<{}, {}, any>
+  export default component
+}

package/src/views/billcard/index.vue

@@ -1,11 +1,14 @@
 <template>
     <div class="page">
-        <widget-qw-bill-card
-            :category="data.category"
-            :no="data.no"
-            :userState="data.loginUserState"
-            :processState="data.processState"
-            :fields="data.fields" />
+        <widget-qw-bill-card :category="data.category" :no="data.no" :userState="data.loginUserState"
+            :processState="data.processState" :fields="data.fields">
+
+            <template #foot>
+                <div style="text-align: right;">
+                    <van-button type="warning" size="small">警告按钮</van-button>
+                </div>
+            </template>
+        </widget-qw-bill-card>
     </div>
 </template>
 
@@ -13,21 +16,21 @@
 import { onMounted, reactive, watch } from "vue";
 
 const data = reactive({
-    category:'作业单',
+    category: '作业单',
     no: '123',
-    loginUserState:'pass',
+    loginUserState: 'pass',
     processState: 'finish_pass',
-    fields:[{
+    fields: [{
         title: '字段1',
         value: '一号门与二号门之间前花园1',
-    },{
+    }, {
         title: '字段2',
         value: '一号门与二号门之间前花园2',
     }]
 })
 
-watch(()=>data.codes,(newVal,oldVal)=>{
-    console.log(newVal,oldVal) 
+watch(() => data.codes, (newVal, oldVal) => {
+    console.log(newVal, oldVal)
 })
 </script>
 

package/src/views/filepicker/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="page">
-      <widget-qw-file-picker label="文件" v-model="data.url" :auth="data.auth" accept=".xls,.xlsx" />
+      <widget-qw-file-picker label="文件" multiple v-model="data.urls" :auth="data.auth" accept=".jpg,.png" />
   </div>
 </template>
 
@@ -8,8 +8,8 @@
 import { onMounted, reactive, watch } from "vue";
 
 const data = reactive({
-  auth:'readonly',
-  url: 'https://1.pdf'
+  auth:'require',
+  urls: ['https://1.pdf']
 })
 
 watch(()=>data.url,(newVal,oldVal)=>{

package/src/views/imagespicker/index.vue

@@ -8,8 +8,8 @@
 import { onMounted, reactive, watch } from "vue";
 
 const data = reactive({
-  auth:'require',
-  urls: ''
+  auth:'readonly',
+  urls: ['http://www.zjpsjdsb.online/static//HrMi9Q2J.png']
 })
 
 watch(()=>data.url,(newVal,oldVal)=>{

package/src/views/objseditor/index.vue

@@ -53,6 +53,12 @@ const data = reactive({
             default: 1,
             auth: 'required',
         },
+        images: {
+            label: '图片',
+            type: 'Images',
+            default: [],
+            auth: 'required',
+        },
         materials: {
             label: '材料表',
             type: 'Array',

package/tsconfig.json

@@ -1,19 +1,19 @@
-{
-  "compilerOptions": {
-    "target": "esnext",
-    "useDefineForClassFields": true,
-    "module": "esnext",
-    "moduleResolution": "node",
-    "strict": true,
-    "jsx": "preserve",
-    "sourceMap": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "esModuleInterop": true,
-    "lib": ["esnext", "dom"],
-    "skipLibCheck": true,
-    "allowJs": true,
-  },
-  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
-  "references": [{ "path": "./tsconfig.node.json" }]
-}
+{
+  "compilerOptions": {
+    "target": "esnext",
+    "useDefineForClassFields": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "strict": true,
+    "jsx": "preserve",
+    "sourceMap": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "lib": ["esnext", "dom"],
+    "skipLibCheck": true,
+    "allowJs": true,
+  },
+  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
+  "references": [{ "path": "./tsconfig.node.json" }]
+}

package/tsconfig.node.json

@@ -1,8 +1,8 @@
-{
-  "compilerOptions": {
-    "composite": true,
-    "module": "esnext",
-    "moduleResolution": "node"
-  },
-  "include": ["vite.config.ts"]
-}
+{
+  "compilerOptions": {
+    "composite": true,
+    "module": "esnext",
+    "moduleResolution": "node"
+  },
+  "include": ["vite.config.ts"]
+}