leisure-core 0.5.1 → 0.5.4

package/index.js

@@ -41,6 +41,8 @@ import LeListForm from "./le-list-form/index.js";
 import LeDatePicker from "./le-date-picker/index.js";
 import LeUrl from "./le-url/index.js";
 import LeSpan from "./le-span/index.js";
+import LeInputAdvanced from "./le-input-advanced/index.js";
+
 
 const components = [
   LeArea,
@@ -81,6 +83,7 @@ const components = [
   LeDatePicker,
   LeSpan,
   LeUrl,
+  LeInputAdvanced
 ];
 
 const install = function (Vue) {
@@ -189,4 +192,5 @@ export default {
   LeDatePicker,
   LeUrl,
   LeSpan,
+  LeInputAdvanced
 };

package/le-input-advanced/index.js

@@ -0,0 +1,7 @@
+import LeInputAdvanced from "./src/main.vue";
+
+LeInputAdvanced.install = function (Vue) {
+  Vue.component(LeInputAdvanced.name, LeInputAdvanced);
+};
+
+export default LeInputAdvanced;

package/le-input-advanced/src/main.vue

@@ -0,0 +1,71 @@
+<template>
+  <div class="le-input-money">
+    <el-input-number v-model="displayValue" v-bind="mergedAttrs" :class="['customClass', $attrs.class]"
+      :style="$attrs.style" :precision="precision" clearable></el-input-number>
+    &nbsp;&nbsp;&nbsp;单位:{{ unit }}
+  </div>
+</template>
+<script>
+export default {
+  name: "le-input-advanced",
+  inheritAttrs: false,
+  props: {
+    value: {
+      type: Number,
+      default: 0
+    },
+    converted: {//是否进行转换
+      type: Boolean,
+      default: false
+    },
+    scale: {//转换比例
+      type: Number,
+      default: 100
+    },
+    precision: {//小数位数
+      type: Number,
+      default: 2
+    },
+    unit: {//单位
+      type: String,
+      default: '元'
+    },
+  },
+  computed: {
+    displayValue: {
+      get() {
+        if (this.converted) {
+          return this.value / this.scale;
+        }
+        return this.value;
+      },
+      set(val) {
+        let value = val !== null && val !== undefined ? val : null;
+        if (this.converted) {
+          value = val !== null && val !== undefined ? Math.round(val * this.scale) : null;
+        }
+        this.$emit('input', value);
+      }
+    },
+    mergedAttrs() {
+      const { value, min, max, step, ...attrs } = this.$attrs;
+      const converted = {};
+      ['min', 'max', 'step'].forEach(attr => {
+        if (typeof this.$attrs[attr] === 'number') {
+          converted[attr] = this.$attrs[attr] / 100
+        }
+      })
+
+      return { ...attrs, ...converted }
+    },
+  }
+}
+</script>
+<style lang="scss" scoped>
+.le-input-money {
+  width: 100%;
+  display: flex;
+  display: -webkit-flex;
+
+}
+</style>

package/le-list/src/main.vue

@@ -5,79 +5,46 @@
       <el-form-item>
         <slot></slot>
         <le-button type="primary" @click="onClickQuery()">查询</le-button>
-        <le-button type="primary" @click="addItem()" v-if="isDispAddBtn"
-          >新建</le-button
-        >
+        <le-button type="primary" @click="addItem()" v-if="isDispAddBtn">新建</le-button>
         <slot name="headerBtns" :params="searchData"></slot>
       </el-form-item>
     </el-form>
-    <el-table
-      ref="eltablemain"
-      :max-height="elTableMaxHeight"
-      :data="tableData"
-      border
-      row-key="id"
-      :header-cell-style="{ 'text-align': 'center' }"
-      :cell-style="{ 'text-align': 'center' }"
-      stripe
-      style="width: 100%"
-    >
-      <el-table-column
-        v-for="column in tableColumns"
-        show-overflow-tooltip
-        :key="column.prop"
-        :prop="column.prop"
-        :label="column.label"
-        :width="column.width"
-      >
+    <el-table ref="eltablemain" :max-height="elTableMaxHeight" :data="tableData" border row-key="id"
+      :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }" stripe
+      style="width: 100%">
+      <el-table-column v-for="column in tableColumns" show-overflow-tooltip :key="column.prop" :prop="column.prop"
+        :label="column.label" :width="column.width">
         <template #default="scope">
           <!-- <span v-html="renderColumnContent(column, scope)"></span> -->
-          <component
-            :is="renderColumnContent(column)"
-            v-bind="getComponentProps(column, scope)"
-          ></component>
+          <component :is="renderColumnContent(column)" v-bind="getComponentProps(column, scope)"></component>
         </template>
       </el-table-column>
-      <el-table-column
-        fixed="right"
-        label="操作"
-        :width="btnCellWidht"
-        align="center"
-      >
+      <el-table-column fixed="right" label="操作" :width="btnCellWidht" align="center">
         <template slot-scope="scope">
-          <div class="rowBtns">
-            <le-button @click="editItem(scope.row)" v-if="disBtn === 'edit'">
-              编辑</le-button
-            >
-            <le-button @click="detail(scope.row)" v-if="disBtn === 'detail'">
-              详情</le-button
-            >
-            <le-button-msg @click="del(scope.row.id)" v-if="isDispDelBtn"
-              >删除</le-button-msg
-            >
-            <div class="rowBtnsExt">
-              <slot name="rowBtns" :scope="scope"></slot>
+          <template v-if="$scopedSlots.rowAllBtns">
+            <slot name="rowAllBtns" :rowdata="scope.row"></slot>
+          </template>
+          <template v-else>
+            <div class="rowBtns">
+              <le-button @click="editItem(scope.row)" v-if="disBtn === 'edit'">
+                编辑</le-button>
+              <le-button @click="detail(scope.row)" v-if="disBtn === 'detail'">
+                详情</le-button>
+              <le-button-msg @click="del(scope.row.id)" v-if="isDispDelBtn">删除</le-button-msg>
+              <div class="rowBtnsExt">
+                <slot name="rowBtns" :scope="scope"></slot>
+              </div>
             </div>
-          </div>
+          </template>
         </template>
       </el-table-column>
     </el-table>
     <div style="text-align: center; margin-top: 30px">
-      <el-pagination
-        background
-        layout="prev, pager, next"
-        :current-page="searchData.pageNo"
-        :total="searchData.total"
-        :page-size="searchData.pageSize"
-        @current-change="current_change"
-      >
+      <el-pagination background layout="prev, pager, next" :current-page="searchData.pageNo" :total="searchData.total"
+        :page-size="searchData.pageSize" @current-change="current_change">
       </el-pagination>
     </div>
-    <le-dialog-container
-      :title="dialogTitle"
-      :width="dialogWidth"
-      :showDialog="showDialog"
-    >
+    <le-dialog-container :title="dialogTitle" :width="dialogWidth" :showDialog="showDialog">
       <slot name="sub" v-if="showDialog" :rowItem="rowItem"></slot>
     </le-dialog-container>
   </div>
@@ -107,7 +74,7 @@ export default {
     },
     searchParam: {
       type: Object,
-      default: () => {},
+      default: () => { },
     },
     isDispAddBtn: {
       type: Boolean,
@@ -190,8 +157,10 @@ export default {
       if (column.formatter) {
         value = column.formatter(scope.rows, scope.column, value);
       }
+      if (column.type) {
+        value = this.format(column.type, value);
+      }
       let ctype = this.componentMap[column.type];
-      value = this.format(ctype, value);
       let prop = ctype?.prop || "value";
       let param = {};
       param[prop] = value || "";
@@ -245,7 +214,8 @@ export default {
         date: () => this.parseTime(value),
         currency: () => `$${parseFloat(value).toFixed(2)}`,
       };
-      return renderers[type]?.() || value;
+      let result = renderers[type]?.() || value;
+      return result;
     },
   },
 };

package/le-list-form/src/main.vue

@@ -1,50 +1,25 @@
 <template>
-  <el-form
-    :model="formPop"
-    :rules="rules"
-    ref="ruleForm"
-    :label-width="labelWidth"
-  >
-    <el-form-item
-      v-for="(item, index) in formColumns"
-      :key="index"
-      :label="item.label"
-      :prop="item.prop"
-      class="leisure-form-item-class"
-    >
+  <el-form :model="formPop" :rules="rules" ref="ruleForm" :label-width="labelWidth">
+    <el-form-item v-for="(item, index) in formColumns" :key="index" :label="item.label" :prop="item.prop"
+      class="leisure-form-item-class">
       <div class="comContainerClass">
-        <component
-          :is="componentType(item.type)"
-          v-model="formPop[item.prop]"
-          v-bind="mergeProps(getComponentProps(item.type), item.attr || {})"
-          v-on="item.event"
-        >
+        <component :is="componentType(item.type)" v-model="formPop[item.prop]"
+          v-bind="mergeProps(getComponentProps(item), item.attr || {})" v-on="item.event" class="compontClass">
           <template v-if="item.type === 'radio'">
-            <el-radio
-              v-for="(option, index) in item.options"
-              :label="option.id"
-              :key="index + '_radio'"
-              >{{ option.lable }}</el-radio
-            >
+            <el-radio v-for="(option, index) in item.options" :label="option.id" :key="index + '_radio'">{{ option.lable
+            }}</el-radio>
           </template>
           <template v-else-if="item.type === 'select'">
-            <le-select-option
-              :options="fieldOptions[item.prop]"
-              :label="item.kv.label"
-              :value="item.kv.key"
-              :keyNum="item.keyNum"
-            />
+            <le-select-option :options="fieldOptions[item.prop]" :label="item.kv.label" :value="item.kv.key"
+              :keyNum="item.keyNum" />
           </template>
         </component>
+        <slot :name="item.prop"></slot>
       </div>
     </el-form-item>
+    <slot></slot>
     <el-form-item v-rfooter>
-      <le-button
-        type="primary"
-        @click="saveData"
-        v-if="handleStatus == 1 || handleStatus == 2"
-        >保存</le-button
-      >
+      <le-button type="primary" @click="saveData" v-if="handleStatus == 1 || handleStatus == 2">保存</le-button>
       <le-button type="info" @click="close()">关闭</le-button>
     </el-form-item>
   </el-form>
@@ -60,11 +35,11 @@ export default {
     },
     formData: {
       type: Object,
-      default: () => {},
+      default: () => { },
     },
     rules: {
       type: Object,
-      default: () => {},
+      default: () => { },
     },
     labelWidth: {
       type: String,
@@ -72,7 +47,7 @@ export default {
     },
     fieldOptions: {
       type: Object,
-      default: () => {},
+      default: () => { },
     },
     handleStatus: {
       type: Number,
@@ -84,6 +59,7 @@ export default {
       handler(val) {
         if (val) {
           this.formPop = JSON.parse(JSON.stringify(val));
+          this.$emit("itemChange", this.formPop);
         }
       },
       deep: true,
@@ -109,6 +85,10 @@ export default {
           props: {},
         },
         radio: { component: "el-radio-group", props: {} },
+        money: {
+          component: "le-input-advanced",
+          props: {},
+        },
         date: {
           component: "le-date-picker",
           props: {
@@ -118,21 +98,29 @@ export default {
           },
         },
         select: { component: "le-select", props: {} },
+        image: { component: "le-image-container", props: {} },
       },
       formPop: {},
       options: {}, //{field1:[{value:1,label:'选项1'},{value:2,label:'选项2'}]}
     };
   },
   computed: {},
-  mounted() {},
+  mounted() { },
   methods: {
     componentType(type) {
       let result = this.componentMap[type]?.component || "le-input";
       return result;
     },
-
-    getComponentProps(type) {
-      return this.componentMap[type]?.props || {};
+    getComponentProps(item) {
+      let type = item.type;
+      let props = this.componentMap[type]?.props || {};
+      if (type === "image") {
+        let images = [];
+        images.push(this.formPop[item.prop]);
+        props = { ...props, "images": images };
+        return props;
+      }
+      return this.componentMap[item.type]?.props || {};
     },
     mergeProps(defaultProps, customProps) {
       return { ...defaultProps, ...customProps };
@@ -144,7 +132,7 @@ export default {
     saveData() {
       this.$refs["ruleForm"].validate((valid) => {
         if (valid) {
-          this.$emit("saveData", this.formPop, () => {});
+          this.$emit("saveData", this.formPop, () => { });
         } else {
           return false;
         }
@@ -154,11 +142,15 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-.leisure-form-item-class {
-}
+.leisure-form-item-class {}
+
 .comContainerClass {
-  // display: flex;
-  // display: -webkit-flex;
+  display: flex;
+  display: -webkit-flex;
   line-height: inherit;
+
+  .compontClass {
+    flex: 1
+  }
 }
 </style>

package/le-menu/src/main.vue

@@ -1,21 +1,11 @@
 <template>
   <div class="le-menu-mainClass">
     <div class="titleClass">角色:{{ roleInfo.roleName }}的功能菜单</div>
-    <el-tree
-      :data="menus"
-      ref="elTree"
-      show-checkbox
-      node-key="id"
-      :props="props"
-    >
+    <el-tree :data="menus" ref="elTree" show-checkbox node-key="id" :props="props">
       <span class="custom-tree-node" slot-scope="{ node, data }">
         <span>{{ node.label }}</span>
         <span v-if="!data.children && data.btns && data.btns.length > 0">
-          <el-button
-            type="text"
-            size="mini"
-            @click="() => buttonPermission(data)"
-          >
+          <el-button type="text" size="mini" @click="() => buttonPermission(data)">
             页面按钮
           </el-button>
         </span>
@@ -26,21 +16,10 @@
       <el-button type="primary" @click="saveAll">保 存</el-button>
     </div>
     <div>
-      <el-dialog
-        width="50%"
-        title="页面按钮"
-        append-to-body
-        :visible.sync="showDialog"
-        :close-on-click-modal="true"
-      >
+      <el-dialog width="50%" title="页面按钮" append-to-body :visible.sync="showDialog" :close-on-click-modal="true">
         <el-form>
           <el-checkbox-group v-model="checkBtnList">
-            <el-checkbox
-              v-for="item in btnsList"
-              :label="item.id"
-              :key="item.id"
-              >{{ item.name }}</el-checkbox
-            >
+            <el-checkbox v-for="item in btnsList" :label="item.id" :key="item.id">{{ item.name }}</el-checkbox>
           </el-checkbox-group>
         </el-form>
         <span slot="footer" class="dialog-footer">
@@ -59,7 +38,7 @@ export default {
   props: {
     roleInfo: {
       type: Object,
-      default: () => {},
+      default: () => { },
     },
   },
   data() {
@@ -193,7 +172,7 @@ export default {
       });
     },
     saveAll() {
-      this.save().then(() => {});
+      this.save().then(() => { });
     },
     getMenus() {
       let param = {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "leisure-core",
-  "version": "0.5.01",
+  "version": "0.5.04",
   "description": "leisure-core是京心数据基于vue2.x开发的一套后台管理系统桌面端组件库，封装了大量实用的UI控件模板,非常方便开发者快速搭建前端应用",
   "private": false,
   "author": "北方乐逍遥(zcx7878)",