vue2-client 1.0.0 → 1.2.1

package/src/base-client/components/common/XForm/XFormItem.vue

@@ -1,217 +1,217 @@
-<template>
-  <!-- 综合筛选 -->
-  <x-form-col
-    :xl="xl"
-    :xxl="xxl"
-    v-if="attr.type === 'select' && attr.model === 'rowIdValue'">
-    <a-form-model-item
-      :ref="attr.model"
-      :label="attr.name"
-      :prop="attr.model">
-      <a-input :disabled="disabled" v-model="form[attr.model]">
-        <a-select
-          slot="addonBefore"
-          v-model="form['rowIdName']"
-          style="width: 100px">
-          <a-select-option
-            v-for="(item,index) in attr.keys"
-            :key="index"
-            :value="Object.keys(item)[0]">{{ item[Object.keys(item)[0]] }}
-          </a-select-option>
-        </a-select>
-      </a-input>
-    </a-form-model-item>
-  </x-form-col>
-  <!-- 输入框 -->
-  <x-form-col
-    :xl="xl"
-    :xxl="xxl"
-    v-else-if="attr.type === 'input'">
-    <a-form-model-item
-      :ref="attr.model"
-      :label="attr.name"
-      :prop="attr.model">
-      <a-input :disabled="disabled" v-model="form[attr.model]" :placeholder="attr.placeholder ? attr.placeholder : '请输入'+attr.name.replace(/\s*/g, '')"/>
-    </a-form-model-item>
-  </x-form-col>
-  <!-- 下拉框 -->
-  <x-form-col
-    :xl="xl"
-    :xxl="xxl"
-    v-else-if="attr.type === 'select'">
-    <a-form-model-item
-      :ref="attr.model"
-      :label="attr.name"
-      :prop="attr.model">
-      <a-select
-        v-model="form[attr.model]"
-        :disabled="disabled"
-        show-search
-        :placeholder="attr.placeholder ? attr.placeholder : '请选择'"
-        :filter-option="filterOption"
-      >
-        <a-select-option
-          v-if="mode === '查询'"
-          key="999999"
-          value="全部">全部
-        </a-select-option>
-        <template v-if="attr.keys">
-          <a-select-option
-            v-for="(item,index) in attr.keys"
-            :key="index"
-            :value="Object.keys(item)[0]">
-            {{ item[Object.keys(item)[0]] }}
-          </a-select-option>
-        </template>
-        <template v-else>
-          <template v-if="attr.keyName.indexOf('logic@') !== -1">
-            <a-select-option
-              v-for="(item,index) in option"
-              :key="index"
-              :value="Object.keys(item)[0]">{{ item[Object.keys(item)[0]] }}
-            </a-select-option>
-          </template>
-          <template v-else>
-            <a-select-option
-              v-for="item in $appdata.getDictionaryList(attr.keyName)"
-              :key="item.value"
-              :value="item.value">
-              <!-- 徽标(badge) -->
-              <x-badge :badge-key="attr.keyName" :value="item.value" :replaceText="item.text"/>
-            </a-select-option>
-          </template>
-        </template>
-      </a-select>
-    </a-form-model-item>
-  </x-form-col>
-  <!-- TODO 多选框 -->
-  <!-- TODO 单选框 -->
-  <!-- 日期范围选择器 -->
-  <x-form-col
-    :xl="xl"
-    :xxl="xxl"
-    v-else-if="attr.type === 'rangePicker'">
-    <a-form-model-item :ref="attr.model" :label="attr.name" :prop="attr.model">
-      <a-range-picker :disabled="disabled" :show-time="true" v-model="form[attr.model]" valueFormat="YYYY-MM-DD HH:mm:ss"/>
-    </a-form-model-item>
-  </x-form-col>
-  <!-- 月份选择器 -->
-  <x-form-col
-    :xl="xl"
-    :xxl="xxl"
-    v-else-if="attr.type === 'monthPicker'">
-    <a-form-model-item :ref="attr.model" :label="attr.name" :prop="attr.model">
-      <a-month-picker :disabled="disabled" :show-time="true" v-model="form[attr.model]" valueFormat="YYYY-MM"/>
-    </a-form-model-item>
-  </x-form-col>
-  <!-- 日期选择器 -->
-  <x-form-col
-    :xl="xl"
-    :xxl="xxl"
-    v-else-if="attr.type === 'datePicker'">
-    <a-form-model-item :ref="attr.model" :label="attr.name" :prop="attr.model">
-      <a-date-picker :disabled="disabled" :show-time="true" v-model="form[attr.model]" valueFormat="YYYY-MM-DD"/>
-    </a-form-model-item>
-  </x-form-col>
-  <!-- 级联选择器 -->
-  <x-form-col
-    :xl="xl"
-    :xxl="xxl"
-    v-else-if="attr.type === 'cascader'">
-    <a-form-model-item :ref="attr.model" :label="attr.name" :prop="attr.model">
-      <template v-if="attr.keys">
-        <a-dcascader :disabled="disabled" :option="attr.keys" :value="form[attr.model]"/>
-      </template>
-      <template v-else>
-        <a-dcascader :disabled="disabled" :option="option" :value="form[attr.model]"/>
-      </template>
-    </a-form-model-item>
-  </x-form-col>
-  <!-- 文本域 -->
-  <x-form-col
-    :xl="24"
-    :xxl="24"
-    :xs="24"
-    :sm="24"
-    :md="24"
-    :lg="24"
-    v-else-if="attr.type === 'textarea'">
-    <a-form-model-item
-      :ref="attr.model"
-      :label="attr.name"
-      :prop="attr.model">
-      <a-textarea :rows="4" :disabled="disabled" v-model="form[attr.model]" :placeholder="attr.placeholder ? attr.placeholder : '请输入'+attr.name.replace(/\s*/g, '')"/>
-    </a-form-model-item>
-  </x-form-col>
-  <!-- TODO 文件上传 -->
-  <!-- TODO 图片上传 -->
-</template>
-<script>
-
-import { post } from '@/services/api/restTools'
-
-export default {
-  name: 'XFormItem',
-  data () {
-    return {
-      option: []
-    }
-  },
-  props: {
-    attr: {
-      type: Object,
-      default: () => {
-        return {}
-      }
-    },
-    form: {
-      type: Object,
-      default: () => {
-        return {}
-      }
-    },
-    disabled: {
-      type: Boolean,
-      default: () => {
-        return false
-      }
-    },
-    mode: {
-      type: String,
-      default: () => {
-        return '查询'
-      }
-    },
-    xl: {
-      type: Number,
-      default: undefined
-    },
-    xxl: {
-      type: Number,
-      default: undefined
-    }
-  },
-  created () {
-    if (this.attr.keyName && this.attr.keyName.indexOf('logic@') !== -1) {
-      const logicName = this.attr.keyName
-      const logic = logicName.substring(6)
-      post('/webmeterapi/' + logic, {}).then(res => {
-        this.option = res
-      })
-    }
-  },
-  methods: {
-    filterOption (input, option) {
-      if (option.componentOptions.children[0].text) {
-        return (
-          option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
-        )
-      } else {
-        return (
-          option.componentOptions.children[0].child.value.toLowerCase().indexOf(input.toLowerCase()) >= 0
-        )
-      }
-    }
-  }
-}
-</script>
+<template>
+  <!-- 综合筛选 -->
+  <x-form-col
+    :xl="xl"
+    :xxl="xxl"
+    v-if="attr.type === 'select' && attr.model === 'rowIdValue'">
+    <a-form-model-item
+      :ref="attr.model"
+      :label="attr.name"
+      :prop="attr.model">
+      <a-input :disabled="disabled" v-model="form[attr.model]">
+        <a-select
+          slot="addonBefore"
+          v-model="form['rowIdName']"
+          style="width: 100px">
+          <a-select-option
+            v-for="(item,index) in attr.keys"
+            :key="index"
+            :value="Object.keys(item)[0]">{{ item[Object.keys(item)[0]] }}
+          </a-select-option>
+        </a-select>
+      </a-input>
+    </a-form-model-item>
+  </x-form-col>
+  <!-- 输入框 -->
+  <x-form-col
+    :xl="xl"
+    :xxl="xxl"
+    v-else-if="attr.type === 'input'">
+    <a-form-model-item
+      :ref="attr.model"
+      :label="attr.name"
+      :prop="attr.model">
+      <a-input :disabled="disabled" v-model="form[attr.model]" :placeholder="attr.placeholder ? attr.placeholder : '请输入'+attr.name.replace(/\s*/g, '')"/>
+    </a-form-model-item>
+  </x-form-col>
+  <!-- 下拉框 -->
+  <x-form-col
+    :xl="xl"
+    :xxl="xxl"
+    v-else-if="attr.type === 'select'">
+    <a-form-model-item
+      :ref="attr.model"
+      :label="attr.name"
+      :prop="attr.model">
+      <a-select
+        v-model="form[attr.model]"
+        :disabled="disabled"
+        show-search
+        :placeholder="attr.placeholder ? attr.placeholder : '请选择'"
+        :filter-option="filterOption"
+      >
+        <a-select-option
+          v-if="mode === '查询'"
+          key="999999"
+          value="全部">全部
+        </a-select-option>
+        <template v-if="attr.keys">
+          <a-select-option
+            v-for="(item,index) in attr.keys"
+            :key="index"
+            :value="Object.keys(item)[0]">
+            {{ item[Object.keys(item)[0]] }}
+          </a-select-option>
+        </template>
+        <template v-else>
+          <template v-if="attr.keyName.indexOf('logic@') !== -1">
+            <a-select-option
+              v-for="(item,index) in option"
+              :key="index"
+              :value="Object.keys(item)[0]">{{ item[Object.keys(item)[0]] }}
+            </a-select-option>
+          </template>
+          <template v-else>
+            <a-select-option
+              v-for="item in $appdata.getDictionaryList(attr.keyName)"
+              :key="item.value"
+              :value="item.value">
+              <!-- 徽标(badge) -->
+              <x-badge :badge-key="attr.keyName" :value="item.value" :replaceText="item.text"/>
+            </a-select-option>
+          </template>
+        </template>
+      </a-select>
+    </a-form-model-item>
+  </x-form-col>
+  <!-- TODO 多选框 -->
+  <!-- TODO 单选框 -->
+  <!-- 日期范围选择器 -->
+  <x-form-col
+    :xl="xl"
+    :xxl="xxl"
+    v-else-if="attr.type === 'rangePicker'">
+    <a-form-model-item :ref="attr.model" :label="attr.name" :prop="attr.model">
+      <a-range-picker :disabled="disabled" :show-time="true" v-model="form[attr.model]" valueFormat="YYYY-MM-DD HH:mm:ss"/>
+    </a-form-model-item>
+  </x-form-col>
+  <!-- 月份选择器 -->
+  <x-form-col
+    :xl="xl"
+    :xxl="xxl"
+    v-else-if="attr.type === 'monthPicker'">
+    <a-form-model-item :ref="attr.model" :label="attr.name" :prop="attr.model">
+      <a-month-picker :disabled="disabled" :show-time="true" v-model="form[attr.model]" valueFormat="YYYY-MM"/>
+    </a-form-model-item>
+  </x-form-col>
+  <!-- 日期选择器 -->
+  <x-form-col
+    :xl="xl"
+    :xxl="xxl"
+    v-else-if="attr.type === 'datePicker'">
+    <a-form-model-item :ref="attr.model" :label="attr.name" :prop="attr.model">
+      <a-date-picker :disabled="disabled" :show-time="true" v-model="form[attr.model]" valueFormat="YYYY-MM-DD"/>
+    </a-form-model-item>
+  </x-form-col>
+  <!-- 级联选择器 -->
+  <x-form-col
+    :xl="xl"
+    :xxl="xxl"
+    v-else-if="attr.type === 'cascader'">
+    <a-form-model-item :ref="attr.model" :label="attr.name" :prop="attr.model">
+      <template v-if="attr.keys">
+        <a-dcascader :disabled="disabled" :option="attr.keys" :value="form[attr.model]"/>
+      </template>
+      <template v-else>
+        <a-dcascader :disabled="disabled" :option="option" :value="form[attr.model]"/>
+      </template>
+    </a-form-model-item>
+  </x-form-col>
+  <!-- 文本域 -->
+  <x-form-col
+    :xl="24"
+    :xxl="24"
+    :xs="24"
+    :sm="24"
+    :md="24"
+    :lg="24"
+    v-else-if="attr.type === 'textarea'">
+    <a-form-model-item
+      :ref="attr.model"
+      :label="attr.name"
+      :prop="attr.model">
+      <a-textarea :rows="4" :disabled="disabled" v-model="form[attr.model]" :placeholder="attr.placeholder ? attr.placeholder : '请输入'+attr.name.replace(/\s*/g, '')"/>
+    </a-form-model-item>
+  </x-form-col>
+  <!-- TODO 文件上传 -->
+  <!-- TODO 图片上传 -->
+</template>
+<script>
+
+import { post } from '@vue2-client/services/api/restTools'
+
+export default {
+  name: 'XFormItem',
+  data () {
+    return {
+      option: []
+    }
+  },
+  props: {
+    attr: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    },
+    form: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    },
+    disabled: {
+      type: Boolean,
+      default: () => {
+        return false
+      }
+    },
+    mode: {
+      type: String,
+      default: () => {
+        return '查询'
+      }
+    },
+    xl: {
+      type: Number,
+      default: undefined
+    },
+    xxl: {
+      type: Number,
+      default: undefined
+    }
+  },
+  created () {
+    if (this.attr.keyName && this.attr.keyName.indexOf('logic@') !== -1) {
+      const logicName = this.attr.keyName
+      const logic = logicName.substring(6)
+      post('/webmeterapi/' + logic, {}).then(res => {
+        this.option = res
+      })
+    }
+  },
+  methods: {
+    filterOption (input, option) {
+      if (option.componentOptions.children[0].text) {
+        return (
+          option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+        )
+      } else {
+        return (
+          option.componentOptions.children[0].child.value.toLowerCase().indexOf(input.toLowerCase()) >= 0
+        )
+      }
+    }
+  }
+}
+</script>