update

Former-commit-id: fcf21ad1ac5698b6a8c7cb6892467ce26b97425f
Former-commit-id: cd703fb1341908c86dc15cdeea9bf913b5678d67

projects/WebMVC/libman.json

@@ -2,6 +2,12 @@
   "version": "1.0",
   "defaultProvider": "cdnjs",
   "libraries": [
+    {
+      "provider": "filesystem",
+      "library": "../lib/local/tree-multiselect/dist",
+      "destination": "wwwroot/lib/tree-multiselect/",
+      "files": [ "jquery.tree-multiselect.min.css", "jquery.tree-multiselect.min.js" ]
+    },
     {
       "provider": "filesystem",
       "library": "../lib/local/jqcron-master/src/",
@@ -47,6 +53,12 @@
       "destination": "wwwroot/lib/vuex",
       "files": [ "vuex.min.js" ]
     },
+    {
+      "provider": "unpkg",
+      "library": "vuelidate@0.7.5",
+      "destination": "wwwroot/lib/vuelidate",
+      "files": [ "dist/vuelidate.min.js" ]
+    },
     {
       "library": "popper.js@2.4.2",
       "destination": "wwwroot/lib/popper.js",
@@ -140,12 +152,6 @@
       "library": "flv.js@1.5.0",
       "destination": "wwwroot/lib/flv.js/",
       "files": [ "flv.min.js" ]
-    },
-    {
-      "provider": "unpkg",
-      "library": "cronstrue@1.94.0",
-      "destination": "wwwroot/lib/cronstrue",
-      "files": [ "dist/cronstrue.min.js", "dist/cronstrue-i18n.min.js" ]
     }
   ]
 }

projects/WebMVC/wwwroot/index.html

@@ -13,6 +13,7 @@
     <link rel="stylesheet" href="lib/weui/style/weui.min.css" />
     <link rel="stylesheet" href="lib/fancybox/jquery.fancybox.min.css" />
     <link rel="stylesheet" href="lib/sweetalert2/dist/minimal.min.css" />
+    <link rel="stylesheet" href="lib/tree-multiselect/jquery.tree-multiselect.min.css" />
     <link rel="stylesheet" href="lib/jqcron/jqCron.css" />
     <link rel="stylesheet" href="css/site.css" />
     <title></title>
@@ -36,6 +37,7 @@
     <script src="lib/vue/vue.js"></script>
     <script src="lib/vuex/vuex.min.js"></script>
     <script src="lib/vue-router/vue-router.min.js"></script>
+    <script src="lib/vuelidate/dist/vuelidate.min.js"></script>
     <script src="lib/jwt-decode/build/jwt-decode.min.js"></script>
     <script src="lib/admin-lte/js/adminlte.min.js"></script>
     <script src="lib/signalr/signalr.min.js"></script>
@@ -43,7 +45,7 @@
     <script src="lib/flv.js/flv.min.js"></script>
     <script src="lib/fancybox/jquery.fancybox.min.js"></script>
     <script src="lib/sweetalert2/dist/sweetalert2.all.min.js"></script>
-    <script src="lib/cronstrue/dist/cronstrue.min.js"></script>
+    <script src="lib/tree-multiselect/jquery.tree-multiselect.min.js"></script>
     <script src="lib/jqcron/jqCron.js"></script>
     <script src="lib/jqcron/jqCron.cn.js"></script>
     <!--<script src="lib/toastr.js/toastr.min.js"></script>-->

projects/WebMVC/wwwroot/js/common.js

@@ -1,5 +1,6 @@
 Vue.prototype.baseUrl = config.baseUrl;
 Vue.prototype.isMobile = config.isMobile;
+Vue.use(window.vuelidate.default);
 
 function vueComponent(name, url) {
     Vue.component(name, function (resolve, reject) {

projects/WebMVC/wwwroot/js/form.js

@@ -11,6 +11,7 @@
     'edit-boolean',
     'edit-integer',
     'edit-selectlist',
+    'edit-multiselectlist',
     'edit-cron',
 ];
 for (var i = 0; i < formComponents.length; i++) {

projects/WebMVC/wwwroot/lib/tree-multiselect/jquery.tree-multiselect.min.css

@@ -0,0 +1,2 @@
+/* jQuery Tree Multiselect v2.6.1 | (c) Patrick Tsai | MIT Licensed */
+div.tree-multiselect{border:2px solid #D8D8D8;border-radius:5px;display:table;height:inherit;width:100%}div.tree-multiselect>div.selected,div.tree-multiselect>div.selections{display:inline-block;box-sizing:border-box;overflow:auto;padding:1%;vertical-align:top;width:50%}div.tree-multiselect>div.selections{border-right:solid 2px #D8D8D8}div.tree-multiselect>div.selections div.item{margin-left:16px}div.tree-multiselect>div.selections div.item label{cursor:pointer;display:inline}div.tree-multiselect>div.selections div.item label.disabled{color:#D8D8D8}div.tree-multiselect>div.selections *[searchhit=false]{display:none}div.tree-multiselect>div.selections.no-border{border-right:none}div.tree-multiselect>div.selected>div.item{background:#EAEAEA;border-radius:2px;padding:2px 5px;overflow:auto}div.tree-multiselect>div.selected.ui-sortable>div.item:hover{cursor:move}div.tree-multiselect div.section>div.section,div.tree-multiselect div.section>div.item{padding-left:20px}div.tree-multiselect div.section.collapsed>div.title span.collapse-section:after{content:"+"}div.tree-multiselect div.section.collapsed:not([searchhit])>.item,div.tree-multiselect div.section.collapsed:not([searchhit])>.section{display:none}div.tree-multiselect div.title,div.tree-multiselect div.item{margin-bottom:2px}div.tree-multiselect div.title{background:#777;color:white;padding:2px}div.tree-multiselect div.title>*{display:inline-block}div.tree-multiselect div.title>span.collapse-section{margin:0 3px;width:8px}div.tree-multiselect div.title>span.collapse-section:after{content:"-"}div.tree-multiselect div.title:hover{cursor:pointer}div.tree-multiselect input[type=checkbox]{display:inline;margin-right:5px}div.tree-multiselect input[type=checkbox]:not([disabled]):hover{cursor:pointer}div.tree-multiselect span.remove-selected,div.tree-multiselect span.description{background:#777;border-radius:2px;color:white;margin-right:5px;padding:0 3px}div.tree-multiselect span.remove-selected:hover{cursor:pointer}div.tree-multiselect span.description:hover{cursor:help}div.tree-multiselect div.temp-description-popup{background:#EAEAEA;border:2px solid #676767;border-radius:3px;padding:5px}div.tree-multiselect span.section-name{float:right;font-style:italic}div.tree-multiselect .auxiliary{display:table;width:100%}div.tree-multiselect .auxiliary input.search{border:2px solid #D8D8D8;display:table-cell;margin:0;padding:5px;width:100%}div.tree-multiselect .auxiliary .select-all-container{display:table-cell;text-align:right}div.tree-multiselect .auxiliary .select-all-container span.select-all,div.tree-multiselect .auxiliary .select-all-container span.unselect-all{margin-right:5px;padding-right:5px}div.tree-multiselect .auxiliary .select-all-container span.select-all:hover,div.tree-multiselect .auxiliary .select-all-container span.unselect-all:hover{cursor:pointer}div.tree-multiselect .auxiliary .select-all-container span.select-all{border-right:2px solid #D8D8D8}

projects/WebMVC/wwwroot/router/shared/edit/boolean.html

@@ -1,5 +1,7 @@
 <template>
-    <div class="form-check col-form-label"><input type="checkbox" class="form-check-input" style="height:16px;width:16px;" :name="name" :value="value" /></div>
+    <div class="form-check">
+        <input type="checkbox" class="form-check-input" style="height:16px;width:16px;" :name="name" :value="value" />
+    </div>
 </template>
 <script>
     export default {

projects/WebMVC/wwwroot/router/shared/edit/multiselectlist.html

@@ -0,0 +1,35 @@
+<template>
+    <div>
+        <select class="col-xs-10 col-sm-5 MultiSelectList" multiple ref="select" :name="name">
+            <template v-for="(item,index) in list">
+                <option :value="item.value" :data-section="item.group.name" :data-index="index" selected v-if="item.selected">{{item.text}}</option>
+                <option :value="item.value" :data-section="item.group.name" :data-index="index" v-else>{{item.text}}</option>
+            </template>
+        </select>
+    </div>
+</template>
+<script>
+    export default {
+        props: ['name', 'value', 'data'],
+        mounted: function () {
+            var select = this.$refs.select;
+            this.$nextTick(function () {
+                $(select).treeMultiselect({
+                    enableSelectAll: true,
+                    searchable: true,
+                    selectAllText: "全选",
+                    unselectAllText: "反选"
+                });
+            });
+        },
+        computed: {
+            list: function () {
+                var key = this.name;
+                if (this.prefix) {
+                    key = this.name.substring(this.prefix.length + 1);
+                }
+                return this.data[key + 'SelectList'];
+            }
+        }
+    };
+</script>