bri-components 1.0.5 → 1.1.1

package/src/components/unit/DshFormItem.vue

@@ -4,7 +4,6 @@
             'DshFormItem',
             { 'DshFormItem-required': formItem._required&&canEdit },
             { 'DshFormItem-line': formItem._line },
-            `DshFormItem-${mode}`,
             `DshFormItem-${formItem._type}`,
             formControlClass,
         ]"
@@ -80,7 +79,6 @@
                 <component
                     ref="control"
                     :is="componentNameMap[formItem._type] || 'DshUndeveloped'"
-                    :mode="mode"
                     :canEdit="canEdit"
                     :value="formData"
                     :propsObj="formItem"

package/src/components/unit/DshUnit.vue

@@ -16,8 +16,8 @@
         <template v-else>
             <component
                 :is="componentNameMap[formItem._type]"
-                :mode="mode"
                 :canEdit="canEdit"
+                :isUnit="isUnit"
                 :parentData="parentData"
                 :value="formData"
                 :propsObj="{

package/src/components/unit/unitMixin.js

@@ -3,7 +3,6 @@ import { componentNameMap, registerComponents } from "../controls/controlMap.js"
 export default {
     components: registerComponents(),
     props: {
-        mode: String,
         canEdit: {
             type: Boolean,
             default: true
@@ -20,6 +19,10 @@ export default {
             default () {
                 return [];
             }
+        },
+        isUnit: {
+            type: Boolean,
+            default: false
         }
     },
     data () {

package/src/index.js

@@ -4,6 +4,8 @@ import utilMap from "./utils/index.js";
 import ViewUI from "view-design";
 import DshDraggable from "vuedraggable";
 import DshCropper from "vue-cropperjs";
+import { VeTable, VeLocale } from "vue-easytable";
+import CN from "vue-easytable/libs/locale/lang/zh-CN.js";
 
 // list
 import { VTable } from "./components/list/easyTable/index.js";
@@ -11,8 +13,10 @@ import EvTable from "./components/list/evTable/EvTable.vue"; // 大表格
 import DshBox from "./components/list/DshBox/DshBox.vue";
 import DshTable from "./components/list/DshBox/DshTable.vue";
 import DshList from "./components/list/DshBox/DshList.vue";
+
+import BriTable from "./components/list/BriTable.vue";
 import ZTree from "./components/list/ZTree.vue";
-import DshFlatTable from "./components/list/DshFlatTable.vue";
+import BriFlatTable from "./components/list/BriFlatTable.vue";
 import DshCascaderTable from "./components/list/DshCascaderTable.vue";
 
 // form
@@ -25,6 +29,7 @@ import DshUnit from "./components/unit/DshUnit.vue";
 import DshFormItem from "./components/unit/DshFormItem.vue";
 
 // controls
+import controlShow from "./components/controls/base/controlShow.vue";
 import DshInput from "./components/controls/base/DshInput.vue";
 import DshNumber from "./components/controls/base/DshNumber/DshNumber.vue";
 import DshSelect from "./components/controls/base/DshSelect.vue";
@@ -43,6 +48,7 @@ import YNoPermission from "./components/other/YNoPermission.vue";
 import ZGantt from "./components/other/ZGantt.vue";
 import ZCollapseTree from "./components/other/ZCollapseTree.vue";
 import ZLoading from "./components/other/ZLoading.vue";
+import BriTransfer from "./components/other/BriTransfer.vue";
 
 // small
 import DshModal from "./components/small/DshModal.vue";
@@ -61,6 +67,8 @@ import Ctooltip from "./components/small/Ctooltip.vue";
 import DshPage from "./components/small/DshPage.vue";
 import DshControlDefine from "./components/small/DshControlDefine.vue";
 import DshFileShow from "./components/small/DshFileShow.vue";
+import BriButton from "./components/small/BriButton.vue";
+import BriTree from "./components/small/BriTree.vue";
 
 /* -------------------- 局部组件 ----------------------- */
 // pages
@@ -101,8 +109,9 @@ const map = {
     DshBox,
     DshTable,
     DshList,
+    BriTable,
     ZTree,
-    DshFlatTable,
+    BriFlatTable,
     DshCascaderTable,
 
     DshForm,
@@ -112,6 +121,7 @@ const map = {
     DshUnit,
     DshFormItem,
 
+    controlShow,
     DshInput,
     DshNumber,
     DshSelect,
@@ -129,6 +139,7 @@ const map = {
     ZGantt,
     ZCollapseTree,
     ZLoading,
+    BriTransfer,
 
     DshModal,
     DshDropdown,
@@ -145,7 +156,9 @@ const map = {
     Ctooltip,
     DshPage,
     DshControlDefine,
-    DshFileShow
+    DshFileShow,
+    BriButton,
+    BriTree
 };
 const install = function (Vue, opts = {}) {
     ViewUI.LoadingBar.config({
@@ -154,6 +167,8 @@ const install = function (Vue, opts = {}) {
         height: 3
     });
     Vue.use(ViewUI);
+    VeLocale.use(CN);
+    Vue.use(VeTable);
 
     // 挂载方法
     Object.keys(utilMap).forEach(key => {
@@ -184,8 +199,9 @@ export {
     DshBox,
     DshTable,
     DshList,
+    BriTable,
     ZTree,
-    DshFlatTable,
+    BriFlatTable,
     DshCascaderTable,
 
     DshForm,
@@ -195,6 +211,7 @@ export {
     DshUnit,
     DshFormItem,
 
+    controlShow,
     DshInput,
     DshNumber,
     DshSelect,
@@ -212,6 +229,7 @@ export {
     ZGantt,
     ZCollapseTree,
     ZLoading,
+    BriTransfer,
 
     DshModal,
     DshDropdown,
@@ -229,6 +247,8 @@ export {
     DshPage,
     DshControlDefine,
     DshFileShow,
+    BriButton,
+    BriTree,
 
     /* 局部 */
     Error500,

package/src/styles/bundle.css

@@ -1,5 +1,3 @@
-@import "view-design/dist/styles/iview.css";
-
 @import "codemirror/lib/codemirror.css";
 @import "codemirror/theme/cobalt.css";
 @import "codemirror/theme/base16-light.css";

package/src/styles/common/common.less

@@ -18,7 +18,7 @@
     padding: 20px 10px;
     text-align: center;
     font-size: 14px;
-    color: @subColor;
+    color: @textColor;
 }
 
 #btn-style {
@@ -26,6 +26,6 @@
     color: @themeColor;
     border-radius: 4px;
     font-weight: bold;
-    font-family:titleFontFamily;
+    font-family: titleFontFamily;
     border: 1px solid #6694ED;
 }

package/src/styles/common/control.less

@@ -0,0 +1,54 @@
+// 表格展示
+.unit-show () {
+    background-color: @theme-focus;
+    color: @themeColor;
+    border-radius: @borderRadius;
+    padding: 3px 8px;
+    text-align: center;
+    line-height: 24px;
+}
+
+// 表单模式
+.control-show {
+    border: none;
+    background-color: transparent;
+}
+.control-edit {
+    height: 32px;
+    color: @textColor;
+    border: 1px solid @borderColor;
+    background: @inputBg;
+    border-radius: @borderRadius;
+    cursor: pointer;
+}
+.control-placeholder {
+    color: @placeholderColor;
+}
+.control-readonly {
+    color: @textColor-readonly;
+    border: 1px solid @border-readonly;
+    background: @inputBg-readonly;
+    border-radius: @borderRadius;
+}
+.control-disabled {
+    color: @textColor-disabled;
+    border: 1px solid @border-disabled;
+    background: @inputBg-disabled;
+    border-radius: @borderRadius;
+    cursor: not-allowed;
+}
+.control-notext {
+    color: @placeholderColor;
+}
+
+// 暂时移到这里，部分需要删除
+.control-show-text {
+    display: inline-block;
+    width: 100%;
+    height: 100%;
+}
+
+.control-nodata-text {
+    color: @placeholderColor ;
+    font-weight: 400;
+}

package/src/styles/common/index.less

@@ -2,3 +2,4 @@
 @import "./box.less";
 @import "./flex.less";
 @import "./text.less";
+@import "./control.less";

package/src/styles/components/controls/BriLabels.less

@@ -0,0 +1,119 @@
+.BriLabels {
+    width: 100%;
+
+    &-dropdown {
+        width: 100%;
+
+        &-show {
+            display: flex;
+            justify-content: space-between;
+            cursor: pointer;
+            border-radius: @borderRadius;
+            border: 1px solid @borderColor;
+            padding-left: 5px;
+
+            &-active {
+                border-color: #64c6d1;
+                box-shadow: 0 0 0 2px rgba(61, 184, 197, 0.2);
+            }
+
+            &-arrow {
+                display: flex;
+                align-items: center;
+                margin-right: 5px;
+            }
+        }
+
+        &-item {
+            margin: 4px 8px;
+            border-radius: @borderRadius;
+
+            &-active {
+                background-color: @theme-focus;
+                color: @themeColor;
+            }
+
+            &-show {
+                // width: 100%;
+                display: flex;
+                justify-content: space-between;
+                align-items: center;
+
+                &-icons {
+                    margin-left: 10px;
+
+                    i {
+                        padding: 3px;
+                        border-radius: @borderRadius;
+                        color: rgba(0, 0, 0, 0.4);
+
+                        &:hover {
+                            background-color: #fff;
+                        }
+                    }
+
+                    &-edit {
+                        &:hover {
+                            color: @themeColor;
+                        }
+                    }
+
+                    &-del {
+                        &:hover {
+                            color: @error-color;
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    .ivu-select-dropdown {
+        width: fit-content;
+    }
+
+    .ivu-input-suffix {
+        display: flex;
+        align-items: center;
+
+        i {
+            width: 24px;
+            height: 24px;
+            line-height: 24px;
+
+            &:hover {
+                background-color: @btn-hover;
+                border-radius: @borderRadius;
+            }
+        }
+    }
+
+    &-view {
+        .dsh-flex-row-start-start();
+        flex-wrap: wrap;
+        height: 32px;
+        overflow-y: hidden;
+
+        &-readonly {
+            width: 100%;
+            background: @white;
+            border: 1px solid #eee;
+            border-radius: 4px;
+            height: 32px;
+            cursor: not-allowed;
+
+            .DshLabels-view-nodata {
+                display: none;
+            }
+        }
+
+        &-tag {
+            width: fit-content;
+            margin-right: 10px;
+        }
+
+        &-nodata {
+            color: @textColor;
+        }
+    }
+}

package/src/styles/components/controls/DshCascader.less

@@ -6,7 +6,7 @@
         padding: 0 10px;
         height: 32px;
         line-height: 32px;
-        border: 1px solid @formBorderColor;
+        border: 1px solid @borderColor;
         border-radius: 4px;
         cursor: pointer;
 
@@ -19,7 +19,7 @@
             &-text {
                 .dsh-ellipsis();
                 &-disabled {
-                    color: @formBorderColor;
+                    color: @borderColor;
                 }
             }
             
@@ -29,7 +29,7 @@
         }
 
         &-placeholder {
-            color: @formBorderColor;
+            color: @borderColor;
         }
     }
 

package/src/styles/components/controls/DshCheckbox.less

@@ -135,7 +135,7 @@
 
     .readonlyCheckbox {
         .ivu-checkbox-disabled+span {
-            color: @activeDarkGreyColor;
+            color: #515a6e;
         }
     }
 

package/src/styles/components/controls/DshCoordinates.less

@@ -1,12 +1,14 @@
 .DshCoordinates {
+    width: 100%;
+    line-height: 32px;
     .textRight {
         text-align: right;
     }
 
     &-wrap {
-        cursor: pointer;
         position: relative;
-
+        padding: 0 8px;
+        .control-edit();
         &-zuobiao{
             color: #e5e5e5;
             line-height: 32px;
@@ -28,7 +30,7 @@
     }
 
     &-notext {
-        color: #c6c9ce;
+        .control-placeholder();
     }
 
     &-message {
@@ -47,6 +49,9 @@
     &-readonly {
         cursor: not-allowed;
     }
+    &-show {
+        padding: 0 8px;
+    }
 }
 
 

package/src/styles/components/controls/DshDate.less

@@ -0,0 +1,54 @@
+.DshDate {
+    width: 100%;
+}
+
+// .ivu-date-picker-cells-year .ivu-date-picker-cells-cell-focused,
+// .ivu-date-picker-cells-month .ivu-date-picker-cells-cell-focused {
+//     position: relative;
+
+//     em {
+//         background-color: transparent;
+//         color: @themeColor;
+//     }
+
+//     &::after {
+//         position: absolute;
+//         bottom: -5px;
+//         right: calc(50% - 3px);
+//         content: "";
+//         width: 6px;
+//         height: 6px;
+//         border-radius: 50%;
+//         background-color: @themeColor;
+//     }
+// }
+
+// .ivu-date-picker-cells {
+//     &-focused em {
+//         box-shadow: none;
+//     }
+
+//     span em {
+//         border-radius: 50%;
+//     }
+
+//     &-cell-today {
+//         em {
+//             position: relative;
+//             color: @themeColor;
+
+//             &::after {
+//                 content: '';
+//                 display: block;
+//                 width: 6px;
+//                 height: 6px;
+//                 border-radius: 50%;
+//                 background: #3DB8C5;
+//                 position: absolute;
+//                 top: auto;
+//                 bottom: -5px;
+//                 right: calc(50% - 3px);
+//             }
+//         }
+//     }
+// }

package/src/styles/components/controls/DshDaterange.less

@@ -20,7 +20,7 @@
 
     &-item {
         height: 32px;
-        border: 1px solid @formBorderColor;
+        border: 1px solid @borderColor;
         border-radius: 4px;
         overflow: hidden;
         position: relative;

package/src/styles/components/controls/DshEditor.less

@@ -1,8 +1,10 @@
-.DshEditor {
-    width: 100%;
-
+.DshEditor {   
+    &-unit {
+        .unit-show();
+        display: inline-block;
+    }
     &-wrap {
-        border: 1px solid @formBorderColor;
+        border: 1px solid @themeColor;
         border-radius: 4px;
         background: #fff;
 
@@ -11,12 +13,11 @@
             padding: 10px;
         }
     }
-
     &-show {
         height: 100%;
         min-height: 32px;
-        cursor: pointer;
-
+        padding: 4px 10px;
+        border-radius: @borderRadius;
         p {
             font-size: 14px !important;
         }
@@ -32,15 +33,32 @@
         ol li {
             list-style: auto;
         }
+        &-nodata {
+            border: none;
+            color: @grey3;
+            padding-left: 0px;
+        }
+        &-disabled {
+            border: 1px solid @border-disabled;
+            cursor: not-allowed;
+        }
+    }
+    &-edit {
+        border: 1px solid @borderColor;
+        cursor: pointer;
+        &-placeholder {
+            color: @input-placeholder-color;
+        }
+        &:hover {
+            border-color: @theme-hover;
+        }
     }
-
     .toolbar {
         margin-top: 5px;
     }
 
     .text {
         min-height: 130px;
-
         ul li {
             list-style: disc;
         }

package/src/styles/components/controls/DshInput.less

@@ -9,14 +9,14 @@
     }
 
     &-ellipsis-readonly {
-        color: @activeDarkGreyColor;
-        border-color: @readonlyBorderColor;
+        color: @textColor-readonly;
+        border-color: @border-readonly;
     }
 
     &-ellipsis-disabled {
-        background-color: @disabledBgColor;
-        color: @disabledColor;
-        border-color: @readonlyBorderColor;
+        background-color: @inputBg-disabled;
+        color: @textColor-disabled;
+        border-color: @border-readonly;
     }
 
     &-textarea-show {
@@ -37,4 +37,10 @@
         width: 100%;
         display: flex;
     }
+}
+.ivu-input {
+    .control-edit();
+    &[disabled] {
+        .control-disabled(); 
+    }
 }

package/src/styles/components/controls/DshLabels.less

@@ -115,7 +115,7 @@
         }
 
         &-nodata{
-            color: @subColor;
+            color: @textColor;
         }
     }