wl-design-mobile 0.0.1 → 0.0.2

package/edit/select/lambo-edit-date.vue

@@ -1,108 +1,108 @@
-<template>
-  <div class="edit-box">
-    <div class="edit-left-box">
-      <div class="edit-left-top">
-        <div v-if="required" class="edit-red-icon">
-          <lambo-required-red-star :required="required"></lambo-required-red-star>
-        </div>
-        <div class="edit-title">{{ title }}</div>
-      </div>
-      <van-field v-model="valName" :placeholder="placeholder" :readonly="true"
-                 class="edit-lambo-input" clear-trigger="focus"></van-field>
-      <van-calendar v-model:show="showBottom" :default-date="defaultDate" :max-date="maxDate" :min-date="minDate"
-                    :style="{ maxHeight: '65%' }" color="#0070D2" type="single" @confirm="onConfirm"/>
-    </div>
-    <div v-if="icon" class="edit-right-icon">
-      <lambo-vector-icon :icon="icon" @click="changeColor"></lambo-vector-icon>
-    </div>
-  </div>
-</template>
-<script>
-import LamboVectorIcon from '@/components/lambo/icon/lambo-vector-icon.vue'
-import LamboRequiredRedStar from '@/components/lambo/icon/lambo-required-red-star.vue'
-import moment from "moment/moment";
-
-export default {
-  name: 'LamboEditDate',
-  components: {LamboRequiredRedStar, LamboVectorIcon},
-  props: {
-    icon: {
-      type: String,
-      default: "date.png",
-    },
-    required: {
-      type: Boolean,
-      default: false,
-    },
-    title: {
-      type: String,
-      default: false,
-    },
-    placeholder: {
-      type: String,
-      default: '请选择',
-    },
-    defaultDate: {
-      type: Date,
-      default: () => null
-    },
-    minDate: {
-      type: Date,
-      default: () => new Date((new Date()).getFullYear() - 3, (new Date()).getMonth(), (new Date()).getDate())
-    },
-    maxDate: {
-      type: Date,
-      default: () => new Date((new Date()).getFullYear() + 3, (new Date()).getMonth(), (new Date()).getDate())
-    }
-  },
-  data() {
-    return {
-      valName: '',
-      showBottom: false,
-      selectItem: {
-        dateStr: '',
-        dateFormat: ''
-      },
-    }
-  },
-  methods: {
-    changeColor() {
-      this.showBottom = !this.showBottom
-      let searchRows = document.querySelectorAll('.edit-box')
-      Array.from(searchRows).forEach(function (row, index) {
-        row.addEventListener('click', function () {
-          Array.from(searchRows).forEach(function (row) {
-            row.style.borderBottom = '1px solid var(--scl-white-2)'
-          })
-          row.style.borderBottom = '1px solid var(--scl-blue)'
-        })
-      })
-    },
-    onConfirm(time) {
-      console.log(" onConfirm time:", time)
-      let dateStr = moment(time).format("yyyyMMDD") || ''
-      let dateFormat = moment(time).format("yyyy-MM-DD") || ''
-      this.valName = dateFormat
-      this.selectItem.dateStr = dateStr
-      this.selectItem.dateFormat = dateFormat
-      this.$emit("on-ok", this.selectItem)
-      this.showBottom = false
-    },
-    initDefaultVal() {
-      // 默认值处理
-      if (this.defaultDate) {
-        this.onConfirm(this.defaultDate)
-      }
-    }
-  },
-  created() {
-    this.initDefaultVal()
-  },
-  mounted() {
-  }
-}
-</script>
-<style scoped>
-@import "../../styles/index.less";
-@import "styles/css/index.css";
-</style>
+<template>
+  <div class="edit-box">
+    <div class="edit-left-box">
+      <div class="edit-left-top">
+        <div v-if="required" class="edit-red-icon">
+          <lambo-required-red-star :required="required"></lambo-required-red-star>
+        </div>
+        <div class="edit-title">{{ title }}</div>
+      </div>
+      <van-field v-model="valName" :placeholder="placeholder" :readonly="true"
+                 class="edit-lambo-input" clear-trigger="focus"></van-field>
+      <van-calendar v-model:show="showBottom" :default-date="defaultDate" :max-date="maxDate" :min-date="minDate"
+                    :style="{ maxHeight: '65%' }" color="#0070D2" type="single" @confirm="onConfirm"/>
+    </div>
+    <div v-if="icon" class="edit-right-icon">
+      <lambo-vector-icon :icon="icon" @click="changeColor"></lambo-vector-icon>
+    </div>
+  </div>
+</template>
+<script>
+import LamboVectorIcon from '../../icon/lambo-vector-icon.vue'
+import LamboRequiredRedStar from '../../icon/lambo-required-red-star.vue'
+import moment from "moment/moment";
+
+export default {
+  name: 'LamboEditDate',
+  components: {LamboRequiredRedStar, LamboVectorIcon},
+  props: {
+    icon: {
+      type: String,
+      default: "date.png",
+    },
+    required: {
+      type: Boolean,
+      default: false,
+    },
+    title: {
+      type: String,
+      default: false,
+    },
+    placeholder: {
+      type: String,
+      default: '请选择',
+    },
+    defaultDate: {
+      type: Date,
+      default: () => null
+    },
+    minDate: {
+      type: Date,
+      default: () => new Date((new Date()).getFullYear() - 3, (new Date()).getMonth(), (new Date()).getDate())
+    },
+    maxDate: {
+      type: Date,
+      default: () => new Date((new Date()).getFullYear() + 3, (new Date()).getMonth(), (new Date()).getDate())
+    }
+  },
+  data() {
+    return {
+      valName: '',
+      showBottom: false,
+      selectItem: {
+        dateStr: '',
+        dateFormat: ''
+      },
+    }
+  },
+  methods: {
+    changeColor() {
+      this.showBottom = !this.showBottom
+      let searchRows = document.querySelectorAll('.edit-box')
+      Array.from(searchRows).forEach(function (row, index) {
+        row.addEventListener('click', function () {
+          Array.from(searchRows).forEach(function (row) {
+            row.style.borderBottom = '1px solid var(--scl-white-2)'
+          })
+          row.style.borderBottom = '1px solid var(--scl-blue)'
+        })
+      })
+    },
+    onConfirm(time) {
+      console.log(" onConfirm time:", time)
+      let dateStr = moment(time).format("yyyyMMDD") || ''
+      let dateFormat = moment(time).format("yyyy-MM-DD") || ''
+      this.valName = dateFormat
+      this.selectItem.dateStr = dateStr
+      this.selectItem.dateFormat = dateFormat
+      this.$emit("on-ok", this.selectItem)
+      this.showBottom = false
+    },
+    initDefaultVal() {
+      // 默认值处理
+      if (this.defaultDate) {
+        this.onConfirm(this.defaultDate)
+      }
+    }
+  },
+  created() {
+    this.initDefaultVal()
+  },
+  mounted() {
+  }
+}
+</script>
+<style scoped>
+@import "../../styles/index.less";
+@import "styles/css/index.css";
+</style>

package/edit/select/lambo-edit-input-textarea.vue

@@ -1,92 +1,92 @@
-<template>
-  <div class="edit-box" @click="changeColor">
-    <div class="edit-left-box">
-      <div class="edit-left-top">
-        <div v-if="required" class="edit-red-icon">
-          <lambo-required-red-star :required="required"></lambo-required-red-star>
-        </div>
-        <div class="edit-title">{{ title }}</div>
-      </div>
-      <van-field v-model="innerValue" :autosize="true" :clearable="true" :maxlength="maxlength"
-                 :placeholder="placeholder" :show-word-limit="showWordLimit" :type="type"
-                 class="edit-lambo-input-textarea" label="" v-bind="$attrs" @input="$emit('input', $event)"/>
-    </div>
-    <div v-if="icon" class="edit-right-icon">
-      <lambo-vector-icon :icon="icon"></lambo-vector-icon>
-    </div>
-  </div>
-</template>
-<script>
-import redIcon from '../assets/icon/required.png'
-import LamboRequiredRedStar from '@/components/lambo/icon/lambo-required-red-star.vue'
-import LamboVectorIcon from "@/components/lambo/icon/lambo-vector-icon.vue"
-
-export default {
-  name: 'LamboEditInputTextarea',
-  components: {LamboVectorIcon, LamboRequiredRedStar},
-  model: {
-    prop: 'value',
-    event: 'input',
-  },
-  props: {
-    required: {
-      type: Boolean,
-      default: false,
-    },
-    type: {
-      default: 'textarea',
-    },
-    maxlength: {
-      type: [String, Number],
-    },
-    placeholder: {
-      type: String,
-      default: '',
-    },
-    title: {
-      type: String,
-      default: false,
-    },
-    value: {
-      type: String,
-      default: '',
-    },
-    showWordLimit: {
-      type: Boolean,
-      default: false,
-    },
-    icon: {
-      type: String,
-      default: "",
-    },
-  },
-  data() {
-    return {
-      requiredReadIcon: redIcon,
-      innerValue: this.value
-    }
-  },
-  methods: {
-    changeColor() {
-      let searchRows = document.querySelectorAll('.edit-box')
-      Array.from(searchRows).forEach(function (row, index) {
-        row.addEventListener('click', function () {
-          Array.from(searchRows).forEach(function (row) {
-            row.style.borderBottom = '1px solid var(--scl-white-2)'
-          })
-          row.style.borderBottom = '1px solid var(--scl-blue)'
-        })
-      })
-    },
-  },
-  watch: {
-    value(newVal) {
-      this.innerValue = newVal
-    },
-  }
-}
-</script>
-<style scoped>
-@import "../../styles/index.less";
-@import "styles/css/index.css";
-</style>
+<template>
+  <div class="edit-box" @click="changeColor">
+    <div class="edit-left-box">
+      <div class="edit-left-top">
+        <div v-if="required" class="edit-red-icon">
+          <lambo-required-red-star :required="required"></lambo-required-red-star>
+        </div>
+        <div class="edit-title">{{ title }}</div>
+      </div>
+      <van-field v-model="innerValue" :autosize="true" :clearable="true" :maxlength="maxlength"
+                 :placeholder="placeholder" :show-word-limit="showWordLimit" :type="type"
+                 class="edit-lambo-input-textarea" label="" v-bind="$attrs" @input="$emit('input', $event)"/>
+    </div>
+    <div v-if="icon" class="edit-right-icon">
+      <lambo-vector-icon :icon="icon"></lambo-vector-icon>
+    </div>
+  </div>
+</template>
+<script>
+import redIcon from '../../assets/icon/required.png'
+import LamboRequiredRedStar from '../../icon/lambo-required-red-star.vue'
+import LamboVectorIcon from "../../icon/lambo-vector-icon.vue"
+
+export default {
+  name: 'LamboEditInputTextarea',
+  components: {LamboVectorIcon, LamboRequiredRedStar},
+  model: {
+    prop: 'value',
+    event: 'input',
+  },
+  props: {
+    required: {
+      type: Boolean,
+      default: false,
+    },
+    type: {
+      default: 'textarea',
+    },
+    maxlength: {
+      type: [String, Number],
+    },
+    placeholder: {
+      type: String,
+      default: '',
+    },
+    title: {
+      type: String,
+      default: false,
+    },
+    value: {
+      type: String,
+      default: '',
+    },
+    showWordLimit: {
+      type: Boolean,
+      default: false,
+    },
+    icon: {
+      type: String,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      requiredReadIcon: redIcon,
+      innerValue: this.value
+    }
+  },
+  methods: {
+    changeColor() {
+      let searchRows = document.querySelectorAll('.edit-box')
+      Array.from(searchRows).forEach(function (row, index) {
+        row.addEventListener('click', function () {
+          Array.from(searchRows).forEach(function (row) {
+            row.style.borderBottom = '1px solid var(--scl-white-2)'
+          })
+          row.style.borderBottom = '1px solid var(--scl-blue)'
+        })
+      })
+    },
+  },
+  watch: {
+    value(newVal) {
+      this.innerValue = newVal
+    },
+  }
+}
+</script>
+<style scoped>
+@import "../../styles/index.less";
+@import "styles/css/index.css";
+</style>

package/edit/select/lambo-edit-input.vue

@@ -1,92 +1,92 @@
-<template>
-  <div class="edit-box" @click="changeColor">
-    <div class="edit-left-box">
-      <div class="edit-left-top">
-        <div class="edit-red-icon" v-if="required">
-          <lambo-required-red-star :required="required"></lambo-required-red-star>
-        </div>
-        <div class="edit-title">{{ title }}</div>
-      </div>
-      <van-field v-model="innerValue" :clearable="true" :maxlength="maxlength" :placeholder="placeholder"
-                 class="edit-lambo-input" :show-word-limit="showWordLimit"
-                 :type="type" label="" v-bind="$attrs" @input="$emit('input', $event)"/>
-    </div>
-    <div class="edit-right-icon" v-if="icon">
-      <lambo-vector-icon :icon="icon"></lambo-vector-icon>
-    </div>
-  </div>
-</template>
-<script>
-import redIcon from '../assets/icon/required.png'
-import LamboRequiredRedStar from '@/components/lambo/icon/lambo-required-red-star.vue'
-import LamboVectorIcon from "@/components/lambo/icon/lambo-vector-icon.vue"
-
-export default {
-  name: 'LamboEditInput',
-  components: {LamboVectorIcon, LamboRequiredRedStar},
-  model: {
-    prop: 'value',
-    event: 'input',
-  },
-  props: {
-    required: {
-      type: Boolean,
-      default: false,
-    },
-    type: {
-      default: 'text',
-    },
-    maxlength: {
-      type: [String, Number],
-    },
-    placeholder: {
-      type: String,
-      default: '',
-    },
-    title: {
-      type: String,
-      default: false,
-    },
-    value: {
-      type: String,
-      default: '',
-    },
-    showWordLimit: {
-      type: Boolean,
-      default: false,
-    },
-    icon: {
-      type: String,
-      default: "",
-    },
-  },
-  data() {
-    return {
-      requiredReadIcon: redIcon,
-      innerValue: this.value
-    }
-  },
-  methods: {
-    changeColor() {
-      let searchRows = document.querySelectorAll('.edit-box')
-      Array.from(searchRows).forEach(function (row, index) {
-        row.addEventListener('click', function () {
-          Array.from(searchRows).forEach(function (row) {
-            row.style.borderBottom = '1px solid var(--scl-white-2)'
-          })
-          row.style.borderBottom = '1px solid var(--scl-blue)'
-        })
-      })
-    },
-  },
-  watch: {
-    value(newVal) {
-      this.innerValue = newVal
-    },
-  }
-}
-</script>
-<style scoped>
-@import "../../styles/index.less";
-@import "styles/css/index.css";
-</style>
+<template>
+  <div class="edit-box" @click="changeColor">
+    <div class="edit-left-box">
+      <div class="edit-left-top">
+        <div class="edit-red-icon" v-if="required">
+          <lambo-required-red-star :required="required"></lambo-required-red-star>
+        </div>
+        <div class="edit-title">{{ title }}</div>
+      </div>
+      <van-field v-model="innerValue" :clearable="true" :maxlength="maxlength" :placeholder="placeholder"
+                 class="edit-lambo-input" :show-word-limit="showWordLimit"
+                 :type="type" label="" v-bind="$attrs" @input="$emit('input', $event)"/>
+    </div>
+    <div class="edit-right-icon" v-if="icon">
+      <lambo-vector-icon :icon="icon"></lambo-vector-icon>
+    </div>
+  </div>
+</template>
+<script>
+import redIcon from '../../assets/icon/required.png'
+import LamboRequiredRedStar from '../../icon/lambo-required-red-star.vue'
+import LamboVectorIcon from "../../icon/lambo-vector-icon.vue"
+
+export default {
+  name: 'LamboEditInput',
+  components: {LamboVectorIcon, LamboRequiredRedStar},
+  model: {
+    prop: 'value',
+    event: 'input',
+  },
+  props: {
+    required: {
+      type: Boolean,
+      default: false,
+    },
+    type: {
+      default: 'text',
+    },
+    maxlength: {
+      type: [String, Number],
+    },
+    placeholder: {
+      type: String,
+      default: '',
+    },
+    title: {
+      type: String,
+      default: false,
+    },
+    value: {
+      type: String,
+      default: '',
+    },
+    showWordLimit: {
+      type: Boolean,
+      default: false,
+    },
+    icon: {
+      type: String,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      requiredReadIcon: redIcon,
+      innerValue: this.value
+    }
+  },
+  methods: {
+    changeColor() {
+      let searchRows = document.querySelectorAll('.edit-box')
+      Array.from(searchRows).forEach(function (row, index) {
+        row.addEventListener('click', function () {
+          Array.from(searchRows).forEach(function (row) {
+            row.style.borderBottom = '1px solid var(--scl-white-2)'
+          })
+          row.style.borderBottom = '1px solid var(--scl-blue)'
+        })
+      })
+    },
+  },
+  watch: {
+    value(newVal) {
+      this.innerValue = newVal
+    },
+  }
+}
+</script>
+<style scoped>
+@import "../../styles/index.less";
+@import "styles/css/index.css";
+</style>