centaline-data-driven-v3 0.1.14 → 0.1.16

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "centaline-data-driven-v3",
-  "version": "0.1.14",
+  "version": "0.1.16",
   "private": false,
   "description": "centaline-data-driven-v3",
   "main": "dist/centaline-data-driven-v3.umd.js",

package/src/assets/commonApp.css

@@ -323,4 +323,10 @@
   color: rgb(255, 255, 255);
   background-color: rgb(250, 82, 82);
   border-color: rgb(250, 82, 82);
+}
+
+/* 让 label 占整行，输入框自动换到下一行 */
+  .label-top {
+  display: block !important;
+  width: 100% !important;
 }

package/src/assets/commonWeb.css

@@ -128,7 +128,8 @@ body {
   line-height: 26px;
   color: var(--centalineGray);
 }
-.el-input__suffix{
+
+.el-input__suffix {
   font-size: 12px;
 }
 
@@ -414,7 +415,7 @@ body {
 }
 
 .ct-searchtable .ct-tr>.ct-td {
-  padding: 2px 20px;
+  padding: 2px 10px;
   box-sizing: border-box;
 }
 
@@ -909,7 +910,11 @@ body {
   background-color: var(--el-fill-color-light) !important;
 }
 
-
+.el-col1 {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end; 
+}
 
 .el-collapse {
   border-top: none;
@@ -1044,21 +1049,25 @@ body {
   background-color: #ed745f;
 }
 
-.ct-location .el-location-input{
+.ct-location .el-location-input {
   border: 1px solid var(--bagGray);
   line-height: 24px;
   padding-left: 5px;
   color: var(--centalineBlue);
   border-radius: 6px !important;
   font-size: inherit;
- }
- .ct-location .el-location-input:hover{
+}
+
+.ct-location .el-location-input:hover {
   border-color: var(--centalineBlue);
- }
- .ct-location .el-location-input:focus{
-  outline:0;
- }
- .h26{
+}
+
+.ct-location .el-location-input:focus {
+  outline: 0;
+}
+
+.h26 {
   height: 26px;
 }
+
 /*elementPlus样式重置结束*/

package/src/components/app/ComboBox.vue

@@ -3,7 +3,8 @@
         <template v-if="!model.isList">
             <van-field clearable :type="model.inputType" :rows="model.rows" v-bind="model.attrs"
                 :label="model.controlLabel" readonly :is-link="!model.locked" :placeholder="model.placeholder"
-                :label-class="[model.required ? 'requiredLabel' : '']" :class="[model.multiple ? 'multiple' : '']"
+                :label-class="[model.required ? 'requiredLabel' : '', { 'label-top': model.labelPlacement == '1' }]"
+                :class="[model.multiple ? 'multiple' : '']"
                 @click="visibleChange()">
                 <template v-if="model.unitName1" #button>
                     {{ model.unitName1 }}

package/src/components/app/DatePicker.vue

@@ -1,8 +1,10 @@
 <template>
     <div class="ct-field">
         <van-field clearable type="text" :rows="model.rows" v-bind="model.attrs" v-model="model.code1" readonly
-            :disabled="model.locked">
-            <template v-if="model.unitName1" #button>
+            :disabled="model.locked"
+             :label-class="[ { 'label-top': model.labelPlacement == '1' }]"
+            >
+            <template  #button>
                 {{ model.unitName1 }}
             </template>
             <template #label v-if="model.showLabel && model.controlLabel">

package/src/components/app/Field.vue

@@ -1,21 +1,24 @@
 <template>
     <div class="ct-field" v-if="model">
         <van-field clearable :type="model.inputType" :rows="model.rows" v-bind="model.attrs" v-model="model.code1"
-            :readonly="model.readonly" :disabled="model.locked"
-            :show-word-limit="model.showwordlimit" :label-align="model.inputType == 'textarea' ? 'top' : 'left'">
+            :readonly="model.readonly" :disabled="model.locked" :show-word-limit="model.showwordlimit"
+            :label-align="model.inputType == 'textarea' ? 'top' : 'left'"
+            :label-class="[{ 'label-top': model.labelPlacement == '1' }]">
             <template #label v-if="model.showLabel && model.controlLabel">
                 <slot name="ControlLabel">
-                    <div :class="[model.required ? 'requiredLabel' : '']" :style="model.isList ? 'white-space: nowrap' : ''">
+                    <div :class="[model.required ? 'requiredLabel' : '']"
+                        :style="model.isList ? 'white-space: nowrap' : ''">
                         <span>{{ model.controlLabel }}</span>
+
+
                     </div>
                 </slot>
             </template>
-            <template #left-icon>
-                <slot name="PreLabel">
-                    <template v-if="model.preLabel1"><span style="display: flex;height: 28px;align-items: center;" v-html="model.preLabel1"></span></template>
-                </slot>
-            </template>
+
             <template #input>
+                <template v-if="model.preLabel1"><span
+                        style="display: flex;height: 28px;align-items: center;padding-left: 5px;"
+                        v-html="model.preLabel1"></span></template>
                 <slot name="Control">
 
                 </slot>
@@ -26,7 +29,8 @@
                 </slot>
             </template>
             <template #extra>
-                <slot name="SufLabel" v-if="model.controlType != Enum.ControlType.CheckBox&&model.controlType != Enum.ControlType.Switch">
+                <slot name="SufLabel"
+                    v-if="model.controlType != Enum.ControlType.CheckBox && model.controlType != Enum.ControlType.Switch">
                     <span v-if="model.sufLabel1" v-html="model.sufLabel1"></span>
                 </slot>
             </template>

package/src/components/app/TextBox.vue

@@ -1,6 +1,7 @@
 <template>
     <div>
-        <van-field readonly v-if="model.moreActionRouter && model.controlType == Enum.ControlType.MultiLineText">
+        <van-field readonly v-if="model.moreActionRouter && model.controlType == Enum.ControlType.MultiLineText"
+            :label-class="[{ 'label-top': model.labelPlacement == '1' }]">
             <template #button>
                 <van-button class="van-button-app" v-if="!model.moreActionRouter.controlLabel" icon="search"
                     size="small" type="danger" @click="popupSearchListHandle"></van-button>
@@ -9,9 +10,11 @@
             </template>
         </van-field>
         <van-field clearable :type="model.inputType" :rows="model.rows" v-bind="model.attrs" v-model="model.code1"
-            :readonly="model.readonly" :disabled="model.locked" :maxlength="model.controlType !== Enum.ControlType.NumericTextBox ? model.maxValue1 : ''"
+            :readonly="model.readonly" :disabled="model.locked"
+            :maxlength="model.controlType !== Enum.ControlType.NumericTextBox ? model.maxValue1 : '9999999999'"
             :show-word-limit="model.showWordLimit" :label-align="model.inputType == 'textarea' ? 'top' : 'left'"
-            @input="input()" @blur="change()" class="ct-text" autocomplete="off">
+            @input="input()" @blur="change()" class="ct-text" autocomplete="off"
+            :label-class="[{ 'label-top': model.labelPlacement == '1' }]">
             <template #label v-if="model.showLabel && model.controlLabel">
                 <div :class="[model.required ? 'requiredLabel' : '']"
                     :style="model.isList ? 'white-space: nowrap' : ''">
@@ -19,7 +22,7 @@
                 </div>
             </template>
             <template #extra v-if="model.sufLabel1">
-                    <span v-html="model.sufLabel1" style="margin-left: 5px;line-height: 32px;"></span>
+                <span v-html="model.sufLabel1" style="margin-left: 5px;line-height: 32px;"></span>
             </template>
             <template v-if="model.unitName1" #button>
                 {{ model.unitName1 }}
@@ -62,14 +65,14 @@ function popupSearchListHandle() {
     emit('popupSearchList', isSingle, model, model.value.moreActionRouter);
 }
 function input() {
-  if(model.value.controlType===Enum.ControlType.MultiLineText || model.value.controlType===Enum.ControlType.TextBox){
-  }
-  else{
-    change();
-  }
-} 
+    if (model.value.controlType === Enum.ControlType.MultiLineText || model.value.controlType === Enum.ControlType.TextBox) {
+    }
+    else {
+        change();
+    }
+}
 function change() {
-  changeHandler(model.value, emit);
+    changeHandler(model.value, emit);
 }
 defineExpose({
     model

package/src/components/web/Button.vue

@@ -31,6 +31,42 @@
     <el-checkbox v-else-if="model.isCheckbox" v-model="model.code1" @change="clickHandle">
         {{ model.controlLabel }}
     </el-checkbox>
+
+    <el-dropdown split-button trigger="click" ref="refsearchwhere" class="search-btn-dropdown" popper-class="earch-btn-dropdown-popper"
+        :type="model.isHyperLink ? 'text' : 'primary'" v-bind="model.attrs" @click="clickHandle"
+        v-else-if="model.isSearchRouterKey && fieldSearchWhere" :hide-on-click="false"
+        @visible-change="clickHandleDropdown"
+        :style="{ color: model.textColor, backgroundColor: model.imgUrl ? 'transparent' : model.bgColor, borderColor: model.imgUrl ? 'transparent' : model.borderColor, padding: model.imgUrl ? '0px' : null }"
+        :icon="model.icon" :disabled="model.disabled || model.locked" placement="bottom">
+        <div v-if="flagAppMode" :title="model.label">
+            <img :src="model.imgUrl" :height="model.buttonHeight + 'px'" />
+            <div style="margin-top:5px;" class="labelText">{{ model.label }}</div>
+        </div>
+        <div v-else>
+            <img v-if="model.imgUrl" :title="model.controlLabel" :src="model.imgUrl"
+                :height="model.buttonHeight + 'px'" />
+            <span v-else>{{ model.controlLabel }}</span>
+        </div>
+        <template #dropdown>
+            <el-dropdown-menu>
+                <el-dropdown-item>
+                    <div style="width:100%;float: left;margin:10px 0;">
+                        <el-button style="float: left" v-for="(field, index) in SearchWhereButtons" :key="index"
+                            :type="field.isHyperLink ? 'text' : 'primary'" :disabled="field.locked"
+                            @click="SaveSearchWhere(field)">{{ field.controlLabel }}</el-button>
+                        <span style="margin-left:10px;margin-top:3px;float:left" @click="SearchWhereManage"
+                            title="维维护已保存的查询条件，如：设置和取消默认、修改标签、删除等。"><el-icon :size="18">
+                                <Tools />
+                            </el-icon></span>
+                    </div>
+                </el-dropdown-item>
+                <el-dropdown-item v-for="(col, index) in SearchWhereList" :key="index">
+                    <span @click="clickDropdownItem(col)" style="width:100%;float: left;">{{ col.labelName }}</span>
+                </el-dropdown-item>
+            </el-dropdown-menu>
+        </template>
+    </el-dropdown>
+
     <el-button v-else-if="model.subText" style="height: 100%;padding: 5px 0;" type="primary" v-bind="model.attrs"
         @click="clickHandle"
         :style="{ color: model.textColor, backgroundColor: model.bgColor, borderColor: model.borderColor }"
@@ -41,7 +77,7 @@
     <!-- <ct-selectfile v-else-if="model.isOpenFileDialog" :form="model"  :vmodel="model"></ct-selectfile> -->
     <template v-else-if="model.isOpenFileDialog" :form="model" :vmodel="model">
         <input type="file" multiple ref="fileInput" @change="handleFileChange" style="display: none"
-            :accept="model.fileAccept" /> 
+            :accept="model.fileAccept" />
         <el-button type="primary" @click="triggerUpload" v-bind="model.attrs"
             :style="{ color: model.textColor, backgroundColor: model.imgUrl ? 'transparent' : model.bgColor, borderColor: model.imgUrl ? 'transparent' : model.borderColor, padding: model.imgUrl ? '0px' : null }"
             :disabled="model.disabled || model.locked" class="btn-add">
@@ -54,7 +90,7 @@
     </template>
 
     <el-button v-else type="primary" :loading="model.loading" v-bind="model.attrs" @click="clickHandle"
-        :style="{ color: model.textColor, backgroundColor: model.imgUrl ? 'transparent' : model.bgColor, borderColor: model.imgUrl ? 'transparent' : model.borderColor, padding: model.imgUrl ? '0px' : null }"
+        :style="{ color: model.textColor, backgroundColor: model.imgUrl ? 'transparent' : model.bgColor, borderColor: model.imgUrl ? 'transparent' : model.borderColor, padding: model.imgUrl ? '0px' : null,'margin-bottom': model.labelPlacement=='1'? '1px':null }"
         :disabled="model.disabled || model.locked">
         <template #icon v-if="model.icon">
             <i :class="model.icon"></i>
@@ -75,9 +111,8 @@ import { initData } from '../../utils/mixins';
 import Button from '../../loader/src/Button';
 import Enum from '../../utils/Enum'
 import common from '../../utils/common'
-import request from '../../utils/request'
 import { ElMessage, UploadFile } from 'element-plus'
-const emit = defineEmits(['input', 'fieldClick', 'importComplete'])
+const emit = defineEmits(['input', 'fieldClick', 'importComplete', 'SearchWhereManage', 'SaveSearchWhere','clichSearchWhere'])
 const props = defineProps({
     parameterAction: String,
     fileData: Object,
@@ -85,18 +120,28 @@ const props = defineProps({
     source: Object,
     flagAppMode: Boolean,
     parentModel: Object,
+    actionRouters: Array,
 })
 
 interface FileItem {
     name: string;
     raw: File;
 }
-
+const fieldSearchWhere = ref(null)
+const SearchWhereButtons = ref([])
+const SearchWhereList = ref([])
+const refsearchwhere = ref()
 const fileInput = ref(null); // 获取 input 元素的引用 
 const fileList = ref<FileItem[]>([]);
 
 
 const model = initData(props, Button)
+if (props.actionRouters && model.value.routerKey) {
+    fieldSearchWhere.value = props.actionRouters.find((b) => {
+        return b.key === model.value.routerKey;
+    });
+}
+
 if (model.value.controlType == Enum.ControlType.ButtonAdvancedSearch) {
     model.value.icon = 'ico-open';
 }
@@ -196,7 +241,43 @@ const handleFileChange = (event) => {
     event.target.value = '';
 
 };
-
+function clickHandleDropdown(v) {
+    if (v) {
+        getSearchWherList();
+    }
+}
+function getSearchWherList() {
+    if (model.value.routerKey) {
+        let field = props.actionRouters.find((b) => {
+            return b.key === model.value.routerKey;
+        });
+        if (field) {
+            model.value.getApiData(loadSearchWher, field);
+        }
+    }
+}
+function loadSearchWher(data, Buttons) {
+    SearchWhereList.value = [];
+    data.rows.forEach((row) => {
+        SearchWhereList.value.push(row);
+    });
+    SearchWhereButtons.value = Buttons;
+}
+function SearchWhereManage() {
+    refsearchwhere.value.handleClose();
+    emit('SearchWhereManage', model.value);
+}
+function SaveSearchWhere(field) {
+    if (field.locked) {
+        return;
+    }
+    refsearchwhere.value.handleClose();
+    emit('SaveSearchWhere', field);
+}
+function clickDropdownItem(col) {
+    refsearchwhere.value.handleClose();
+    emit('clichSearchWhere', col);
+}
 function generateUUID() {
     return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c =>
         (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
@@ -251,4 +332,82 @@ function generateUUID() {
     border-color: var(--btnFocusRed);
     color: #fff;
 }
+</style>
+<style lang="css">
+.search-btn-dropdown {
+    margin-right: 10px;
+    vertical-align: middle;
+}
+
+.search-btn-dropdown button {
+    height: 26px !important;
+    line-height: 26px !important;
+    background: var(--chinaRed);
+    border-color: var(--chinaRed);
+    box-shadow: 0 2px 4px #ee6b6b40;
+    border-radius: 6px;
+    color: #fff;
+}
+
+/* 搜索按钮,重置按钮和更多按钮的hover */
+.earch-btn-dropdown button:hover {
+    background-color: var(--btnHoverRed);
+    border-color: var(--btnHoverRed);
+    color: #fff;
+}
+
+.earch-btn-dropdown button:hover .open,
+.earch-btn-dropdown button:hover .fold {
+    background-color: var(--btnHoverRed);
+}
+
+.search-btn-dropdown button:active,
+.search-btn-dropdown button:focus {
+    background-color: var(--btnFocusRed);
+    border-color: var(--btnFocusRed);
+    color: #fff;
+}
+
+.earch-btn-dropdown-popper .el-dropdown-menu .el-button--primary:hover,
+.earch-btn-dropdown-popper .el-dropdown-menu .el-button--default:hover {
+    background: var(--btnHoverRed);
+    color: #FFF;
+}
+
+.earch-btn-dropdown-popper .el-dropdown-menu .el-button--primary {
+    background-color: var(--chinaRed);
+}
+
+.earch-btn-dropdown-popper .el-dropdown-menu .el-button--primary:hover {
+    background: var(--btnHoverRed);
+    color: #FFF;
+}
+
+.earch-btn-dropdown-popper .el-dropdown-menu .el-icon:hover {
+    color: var(--btnHoverRed);
+}
+
+.earch-btn-dropdown-popper .el-dropdown-menu li:hover,
+.earch-btn-dropdown-popper .el-dropdown-menu li:focus {
+     background: #ffffff;
+     color: #606266;
+}
+
+.earch-btn-dropdown-popper .el-dropdown-menu .el-button--primary.is-disabled,
+.earch-btn-dropdown-popper .el-dropdown-menu .el-button--primary.is-disabled:hover,
+.earch-btn-dropdown-popper .el-dropdown-menu .el-button--primary.is-disabled:focus,
+.earch-btn-dropdown-popper .el-dropdown-menu .el-button--primary.is-disabled:active {
+    color: #FFF !important;
+    background-color: var(--chinaRed);
+    border-color: var(--chinaRed);
+}
+
+.earch-btn-dropdown-popper .el-dropdown-menu .el-button.is-disabled,
+.earch-btn-dropdown-popper .el-dropdown-menu .el-button.is-disabled:hover,
+.earch-btn-dropdown-popper .el-dropdown-menu .el-button.is-disabled:focus,
+.earch-btn-dropdown-popper .el-dropdown-menu .el-button.is-disabled:active {
+    color: var(--centalineMediumGray) !important;
+    background: #F3F3F3;
+    border: 1px solid var(--bagGray);
+}
 </style>

package/src/components/web/DatePicker.vue

@@ -2,19 +2,34 @@
     <ct-field :vmodel="model">
         <template #Control>
             <template v-if="model.flagtime">
-                <el-time-picker v-model="model.code1" v-bind="model.attrs" :disabled="model.locked"
+                <el-time-picker v-model="model.code1" v-bind="model.attrs" :disabled="model.locked" :format="model.format"
                     @change="changeHandler(model, emit)" class="fieldControl" />
                 <span class="range-span" v-if="model.flagrange"> - </span>
-                <el-time-picker v-if="model.flagrange" v-model="model.code2" v-bind="model.attrs" :disabled="model.locked"
-                    @change="changeHandler(model, emit)" class="fieldControl" />
+                <el-time-picker v-if="model.flagrange" v-model="model.code2" v-bind="model.attrs" :format="model.format"
+                    :disabled="model.locked" @change="changeHandler(model, emit)" class="fieldControl" />
             </template>
             <template v-else>
-                <el-date-picker v-model="model.code1" :type="model.dateType" v-bind="model.attrs" :disabled="model.locked"
-                    :disabled-date="disabledDate" @change="changeHandler(model, emit)" class="fieldControl" />
-                <span class="range-span" v-if="model.flagrange"> - </span>
-                <el-date-picker v-if="model.flagrange" v-model="model.code2" :type="model.dateType" v-bind="model.attrs"
-                    :disabled="model.locked" :disabled-date="disabledDate" @change="changeHandler(model, emit)"
-                    class="fieldControl" />
+                <template v-if="model.flagDateTime">
+                    <DateTimePicker v-model="model.code1" :format="model.format" :minute-step="model.minuteStep"
+                        @change="changeHandler(model, emit)" class="fieldControl" :model="model"
+                        :class="[!model.valid ? 'is-error' : '']">
+                    </DateTimePicker>
+
+                    <span class="range-span" v-if="model.flagrange"> - </span>
+                    <DateTimePicker v-model="model.code2" :format="model.format" v-if="model.flagrange"
+                        :minute-step="model.minuteStep" @change="changeHandler(model, emit)" class="fieldControl"
+                        :model="model" :class="[!model.valid ? 'is-error' : '']">
+                    </DateTimePicker>
+                </template>
+                <template v-else>
+                    <el-date-picker v-model="model.code1" :type="model.dateType" v-bind="model.attrs"
+                        :disabled="model.locked" :disabled-date="disabledDate" @change="changeHandler(model, emit)"
+                        class="fieldControl" />
+                    <span class="range-span" v-if="model.flagrange"> - </span>
+                    <el-date-picker v-if="model.flagrange" v-model="model.code2" :type="model.dateType"
+                        v-bind="model.attrs" :disabled="model.locked" :disabled-date="disabledDate"
+                        @change="changeHandler(model, emit)" class="fieldControl" />
+                </template>
             </template>
         </template>
     </ct-field>
@@ -22,6 +37,7 @@
 <script lang="ts" setup>
 import { initData, changeHandler } from '../../utils/mixins';
 import DatePicker from '../../loader/src/DatePicker';
+import DateTimePicker from './DateTimePicker/DateTimePicker.vue';
 const emit = defineEmits(['input', 'change'])
 const props = defineProps({
     parameterAction: String,
@@ -29,7 +45,6 @@ const props = defineProps({
     source: Object,
 })
 const model = initData(props, DatePicker)
-
 //可以选择的日期区间
 function disabledDate(time) {
     let validate = false;
@@ -46,5 +61,3 @@ defineExpose({
     model
 })
 </script>
-
-