cloud-web-corejs 1.0.54-dev.5 → 1.0.54-dev.500

package/src/components/xform/form-render/container-item/data-table-item.vue

@@ -1,107 +1,28 @@
 <template>
-  <vxe-grid :ref="widget.id" v-bind="vxeOption" :auto-resize="true" v-show="!widget.options.hidden"
-            @resizable-change="$vxeTableUtil.onColumnWitchChange" @custom="$vxeTableUtil.customHandle"
-            @checkbox-change="handleCheckboxChange" @checkbox-all="handleCheckboxAll"
-            @cell-dblclick="handleCellDblclick" :class="dataTableConfig.class" :data="fieldModel">
+  <vxe-grid
+    :ref="widget.id"
+    v-bind="vxeOption"
+    :auto-resize="true"
+    v-show="!widget.options.hidden"
+    @resizable-change="$vxeTableUtil.onColumnWitchChange"
+    @custom="$vxeTableUtil.customHandle"
+    @checkbox-change="handleCheckboxChange"
+    @checkbox-all="handleCheckboxAll"
+    @cell-dblclick="handleCellDblclick"
+    :class="dataTableConfig.class"
+    :data="fieldModel"
+    v-on="eventConfig"
+  >
     <template #form>
-      <!--            <div v-if="widget.options.showSearchArea" class="clearfix screen-btns">
-                    <div class="fl">
-                      &lt;!&ndash;              <vxe-button status="primary" class="button-sty" icon="el-icon-upload2"
-                                          @click="$excelExport({ title: '导出', targetRef: 'grid' + widget.id })"
-                                          v-if="widget.options.showExportBtn!==false">导出
-                              </vxe-button>&ndash;&gt;
-
-                      <template v-if="!!widget.buttons && widget.buttons.length > 0">
-                        <template v-for="(subWidget, swIdx) in widget.buttons">
-                          <template v-if="'container' === subWidget.category">
-                            <component
-                              :is="subWidget.type + '-item'"
-                              :widget="subWidget"
-                              :key="swIdx"
-                              :parent-list="widget.buttons"
-                              :index-of-parent-list="swIdx"
-                              :parent-widget="widget"
-                            >
-                              &lt;!&ndash; 递归传递插槽！！！ &ndash;&gt;
-                              <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-                                <slot :name="slot" v-bind="scope"/>
-                              </template>
-                            </component>
-                          </template>
-                          <template v-else>
-                            <component
-                              :is="subWidget.type + '-widget'"
-                              :field="subWidget"
-                              :designer="null"
-                              :key="swIdx"
-                              :parent-list="widget.buttons"
-                              :index-of-parent-list="swIdx"
-                              :parent-widget="widget"
-                            >
-                              &lt;!&ndash; 递归传递插槽！！！ &ndash;&gt;
-                              <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-                                <slot :name="slot" v-bind="scope"/>
-                              </template>
-                            </component>
-                          </template>
-                        </template>
-                      </template>
-
-                    </div>
-                    <div class="fr">
-                      &lt;!&ndash; <vxe-button icon="el-icon-view" class="button-sty" @click="searchEvent">显示总记录数</vxe-button> &ndash;&gt;
-                      <vxe-button icon="el-icon-brush" class="button-sty" @click="resetEvent" type="text" status="primary"
-                                  plain>重置
-                      </vxe-button>
-
-                      <vxe-button status="warning" icon="el-icon-search" class="button-sty" @click="searchEvent">搜索
-                      </vxe-button>
-                    </div>
-                  </div>
-                  <div v-if="widget.options.showSearchArea && widget.widgetList.length != 0" ref="searchForm"
-                       class="screen-box vxe-form" title-width="92px" title-align="right">
-                    <template v-if="!!widget.widgetList && widget.widgetList.length > 0">
-                      <template v-for="(subWidget, swIdx) in widget.widgetList">
-                        <template v-if="'container' === subWidget.category">
-                          <component
-                            :is="subWidget.type + '-item'"
-                            :widget="subWidget"
-                            :key="swIdx"
-                            :parent-list="widget.widgetList"
-                            :index-of-parent-list="swIdx"
-                            :parent-widget="widget"
-                            formItemType="vxe-form-item"
-                          >
-                            &lt;!&ndash; 递归传递插槽！！！ &ndash;&gt;
-                            <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-                              <slot :name="slot" v-bind="scope"/>
-                            </template>
-                          </component>
-                        </template>
-                        <template v-else>
-                          <component
-                            :is="subWidget.type + '-widget'"
-                            :field="subWidget"
-                            :designer="null"
-                            :key="swIdx"
-                            :parent-list="widget.widgetList"
-                            :index-of-parent-list="swIdx"
-                            :parent-widget="widget"
-                            formItemType="vxe-form-item"
-                          >
-                            &lt;!&ndash; 递归传递插槽！！！ &ndash;&gt;
-                            <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-                              <slot :name="slot" v-bind="scope"/>
-                            </template>
-                          </component>
-                        </template>
-                      </template>
-                    </template>
-                  </div>-->
-
-      <tableForm v-if="widget.options.isQueryTable" :formData.sync="formModel"
-                 @searchEvent="searchEvent" @resetEvent="resetEvent" @advancedClear="advancedClear"
-                 @settingConfirm="tableFormSettingConfirm">
+      <tableForm
+        v-if="widget.options.isQueryTable"
+        :formData.sync="formModel"
+        :xform="true"
+        @searchEvent="searchEvent"
+        @resetEvent="resetEvent"
+        @advancedClear="advancedClear"
+        @settingConfirm="tableFormSettingConfirm"
+      >
         <template #buttonLeft>
           <template v-if="!!widget.buttons && widget.buttons.length > 0">
             <template v-for="(subWidget, swIdx) in widget.buttons">
@@ -115,8 +36,11 @@
                   :parent-widget="widget"
                 >
                   <!-- 递归传递插槽！！！ -->
-                  <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-                    <slot :name="slot" v-bind="scope"/>
+                  <template
+                    v-for="slot in Object.keys($scopedSlots)"
+                    v-slot:[slot]="scope"
+                  >
+                    <slot :name="slot" v-bind="scope" />
                   </template>
                 </component>
               </template>
@@ -131,8 +55,11 @@
                   :parent-widget="widget"
                 >
                   <!-- 递归传递插槽！！！ -->
-                  <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-                    <slot :name="slot" v-bind="scope"/>
+                  <template
+                    v-for="slot in Object.keys($scopedSlots)"
+                    v-slot:[slot]="scope"
+                  >
+                    <slot :name="slot" v-bind="scope" />
                   </template>
                 </component>
               </template>
@@ -140,15 +67,29 @@
           </template>
         </template>
         <template #buttonRight>
-          <vxe-button icon="el-icon-brush" class="button-sty" @click="handleResetClick" type="text" status="primary"
-                      plain>{{ $t2('重置') }}
+          <vxe-button
+            icon="el-icon-brush"
+            class="button-sty"
+            @click="handleResetClick"
+            type="text"
+            status="primary"
+            plain
+            >{{ $t2("重置") }}
           </vxe-button>
-          <vxe-button status="warning" icon="el-icon-search" class="button-sty" @click="handleSearchClick">
-            {{ $t2('搜索') }}
+          <vxe-button
+            status="warning"
+            icon="el-icon-search"
+            class="button-sty"
+            @click="handleSearchClick"
+          >
+            {{ $t2("搜索") }}
           </vxe-button>
         </template>
 
-        <template v-for="(subWidget, swIdx) in widget.widgetList" v-slot:[subWidget.options.name]="{slotFormData}">
+        <template
+          v-for="(subWidget, swIdx) in widget.widgetList"
+          v-slot:[subWidget.options.name]
+        >
           <component
             v-if="'container' !== subWidget.category"
             :key="swIdx"
@@ -160,13 +101,12 @@
           >
             <!-- 递归传递插槽！！！ -->
             <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-              <slot :name="slot" v-bind="scope"/>
+              <slot :name="slot" v-bind="scope" />
             </template>
           </component>
         </template>
 
-        <template #searchWidget="{searchColumn}">
-          {{ searchColumn.widget.type }}
+        <template #searchWidget="{ searchColumn }">
           <component
             :is="searchColumn.widget.type + '-widget'"
             :field="searchColumn.widget"
@@ -177,65 +117,105 @@
           >
             <!-- 递归传递插槽！！！ -->
             <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-              <slot :name="slot" v-bind="scope"/>
+              <slot :name="slot" v-bind="scope" />
             </template>
           </component>
         </template>
-
       </tableForm>
-      <treeMoveDialog v-if="showTreeMoveDialog" :visiable.sync="showTreeMoveDialog" :rows.sync="sortRows" :parent-target="_self" @confirm="confirmTreeMoveDialog"></treeMoveDialog>
+      <treeMoveDialog
+        v-if="showTreeMoveDialog"
+        :visiable.sync="showTreeMoveDialog"
+        :rows.sync="sortRows"
+        :parent-target="_self"
+        @confirm="confirmTreeMoveDialog"
+      ></treeMoveDialog>
     </template>
-    <template v-for="fieldWidget in widgets" v-slot:[fieldWidget.id]="obj">
-      <component
-        :is="getColumnWidgetName(fieldWidget)"
-        :field="fieldWidget"
-        :form-model="globalModel.formModel"
-        :designer="null"
-        :key="fieldWidget.id"
-        :parent-widget="widget"
-        :columnConfig="obj.column.params.columnConfig"
-        :subFormRowIndex="obj.rowIndex"
-        :formItemProp="getColumnProp(widget,obj)"
-        :tableParam="obj"
-      >
-        <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-          <slot :name="slot" v-bind="scope"/>
+    <template #widget="obj">
+      <template v-if="!!getTableColumnWidget(obj)">
+        <template v-if="obj.column.params.widget.type == 'status'">
+          <template
+            v-for="(item, index) in getTableColumnWidget(obj).options.statusParam"
+          >
+            <template v-if="isShowColumnStatusWidget(obj, item)">
+              <span
+                v-if="
+                  getTableColumnWidget(obj).options.formScriptEnabled ||
+                  getTableColumnWidget(obj).options.commonAttributeEnabled
+                "
+                :key="getTableColumnWidget(obj).id + '-' + index"
+                >{{ getI18nLabel(item[getTableColumnStatusWidgetLabelKey(obj)]) }}</span
+              >
+              <span
+                v-else
+                :key="getTableColumnWidget(obj).id + '-' + index"
+                class="list-tag"
+                :class="item.type"
+                >{{ getI18nLabel(item[getTableColumnStatusWidgetLabelKey(obj)]) }}</span
+              >
+            </template>
+          </template>
         </template>
-      </component>
+        <component
+          v-else
+          :is="getColumnWidgetName(obj.column.params.widget)"
+          :field="fieldSchemaMap[obj.row._X_ROW_KEY][obj.column.params.widget.id]"
+          :form-model="globalModel.formModel"
+          :designer="null"
+          :key="fieldSchemaMap[obj.row._X_ROW_KEY][obj.column.params.widget.id].id"
+          :parent-widget="widget"
+          :columnConfig="obj.column.params.columnConfig"
+          :subFormRowIndex="obj.rowIndex"
+          :formItemProp="getColumnProp(obj)"
+          :subFormRowId="obj.row._X_ROW_KEY"
+          :tableParam="obj"
+        >
+          <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
+            <slot :name="slot" v-bind="scope" />
+          </template>
+        </component>
+      </template>
     </template>
-    <template #widget="obj">
-      <component
-        :is="getColumnWidgetName(obj.column.params.widget)"
-        :field="obj.column.params.widget"
-        :form-model="globalModel.formModel"
-        :designer="null"
-        :key="obj.column.params.widget.id"
-        :parent-widget="widget"
-        :columnConfig="obj.column.params.columnConfig"
-        :subFormRowIndex="obj.rowIndex"
-        :formItemProp="getColumnProp(widget,obj)"
-        :tableParam="obj"
-      >
-        <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-          <slot :name="slot" v-bind="scope"/>
+    <template #widgetList="obj">
+      <div>
+        <template v-for="(fieldWidget, index) in obj.column.params.widgetList">
+          <component
+            v-if="!!fieldSchemaMap[obj.row._X_ROW_KEY] && !!obj.row._X_ROW_KEY"
+            :is="getColumnWidgetName(fieldWidget)"
+            v-bind="getRowWidgetOption(obj, fieldWidget)"
+            :form-model="globalModel.formModel"
+            :designer="null"
+            :key="getRowWidgetKey(obj, fieldWidget)"
+            :parent-widget="widget"
+            :columnConfig="obj.column.params.columnConfig"
+            :subFormRowIndex="obj.rowIndex"
+            :subFormRowId="obj.row._X_ROW_KEY"
+            :formItemProp="getColumnProp2(fieldWidget, obj)"
+            :tableParam="obj"
+          >
+            <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
+              <slot :name="slot" v-bind="scope" :tableParam="obj" />
+            </template>
+          </component>
         </template>
-      </component>
+      </div>
     </template>
     <template #editWidget="obj">
       <component
+        v-if="!!fieldSchemaMap[obj.row._X_ROW_KEY]"
         :is="getColumnWidgetName(obj.column.params.editWidget)"
-        :field="obj.column.params.editWidget"
+        :field="fieldSchemaMap[obj.row._X_ROW_KEY][obj.column.params.editWidget.id]"
         :form-model="globalModel.formModel"
         :designer="null"
-        :key="obj.column.params.editWidget.id"
+        :key="fieldSchemaMap[obj.row._X_ROW_KEY][obj.column.params.editWidget.id].id"
         :parent-widget="widget"
         :columnConfig="obj.column.params.columnConfig"
         :subFormRowIndex="obj.rowIndex"
-        :formItemProp="getColumnProp(widget, obj,true)"
+        :subFormRowId="obj.row._X_ROW_KEY"
+        :formItemProp="getColumnProp(obj, true)"
         :tableParam="obj"
       >
         <template v-for="slot in Object.keys($scopedSlots)" v-slot:[slot]="scope">
-          <slot :name="slot" v-bind="scope"/>
+          <slot :name="slot" v-bind="scope" />
         </template>
       </component>
     </template>
@@ -243,81 +223,96 @@
       <div class="cell-operate">
         <template v-if="getGridTable().isActiveByRow(obj.row)">
           <a @click="saveEditRow(obj)" class="a-link" data-tit="保存">
-            <el-tooltip :enterable="false" effect="dark" content="保存" placement="top"
-                        popper-class="tooltip-skin"><i class="el-icon-circle-check"></i></el-tooltip>
+            <el-tooltip
+              :enterable="false"
+              effect="dark"
+              content="保存"
+              placement="top"
+              popper-class="tooltip-skin"
+              ><i class="el-icon-circle-check"></i
+            ></el-tooltip>
           </a>
-          <a @click="cancleRowEvent(obj)" class="a-link" data-tit="取消行编辑" v-if="hasSaveRow(obj.row)">
-            <el-tooltip :enterable="false" effect="dark" content="取消行编辑" placement="top"
-                        popper-class="tooltip-skin"><i class="el-icon-circle-close"></i></el-tooltip>
+          <a
+            @click="cancleRowEvent(obj)"
+            class="a-link"
+            data-tit="取消行编辑"
+            v-if="hasSaveRow(obj.row)"
+          >
+            <el-tooltip
+              :enterable="false"
+              effect="dark"
+              content="取消行编辑"
+              placement="top"
+              popper-class="tooltip-skin"
+              ><i class="el-icon-circle-close"></i
+            ></el-tooltip>
           </a>
-          <a @click="removeEditRow(obj)" class="a-link" data-tit="删除" v-if="!hasSaveRow(obj.row)">
-            <el-tooltip :enterable="false" effect="dark" content="删除" placement="top"
-                        popper-class="tooltip-skin"><i class="el-icon-delete"></i></el-tooltip>
+          <a
+            @click="removeEditRow(obj)"
+            class="a-link"
+            data-tit="删除"
+            v-if="!hasSaveRow(obj.row)"
+          >
+            <el-tooltip
+              :enterable="false"
+              effect="dark"
+              content="删除"
+              placement="top"
+              popper-class="tooltip-skin"
+              ><i class="el-icon-delete"></i
+            ></el-tooltip>
           </a>
         </template>
         <template v-else>
-          <a class="a-link" data-tit="新增" @click="addEditRow(null,obj)">
-            <el-tooltip :enterable="false" effect="dark" content="新增" placement="top"
-                        popper-class="tooltip-skin"><i class="el-icon-circle-plus-outline"></i></el-tooltip>
+          <a class="a-link" data-tit="新增" @click="addEditRow(null, obj)">
+            <el-tooltip
+              :enterable="false"
+              effect="dark"
+              content="新增"
+              placement="top"
+              popper-class="tooltip-skin"
+              ><i class="el-icon-circle-plus-outline"></i
+            ></el-tooltip>
           </a>
-          <a @click="editRowEvent(obj)" class="a-link" data-tit="行编辑" v-if="obj.row && obj.row.parent !== 0">
-            <el-tooltip :enterable="false" effect="dark" content="行编辑" placement="top"
-                        popper-class="tooltip-skin"><i class="el-icon-edit-outline"></i></el-tooltip>
+          <a @click="editRowEvent(obj)" class="a-link" data-tit="行编辑">
+            <el-tooltip
+              :enterable="false"
+              effect="dark"
+              content="行编辑"
+              placement="top"
+              popper-class="tooltip-skin"
+              ><i class="el-icon-edit-outline"></i
+            ></el-tooltip>
           </a>
         </template>
       </div>
     </template>
-    <!--    <template #editDelete="obj">
-          <a
-            href="javascript:void(0);"
-            class="a-link"
-            @click="deleteRow(obj.row,obj.rowIndex)"
-            :key="obj.rowIndex+'-editDelete'"
-            v-show="!hasWf"
-          >
-            <el-tooltip :enterable="false" effect="dark" content="删除" placement="top" popper-class="tooltip-skin">
-              <i class="el-icon-delete"/>
-            </el-tooltip>
-          </a>
-        </template>
-        <template #editButton="obj">
-          <a
-            href="javascript:void(0);"
-            class="a-link"
-            @click="openEditDialog(obj.row)"
-          >
-            <el-tooltip :enterable="false" effect="dark" content="查看" placement="top" popper-class="tooltip-skin">
-              <i class="el-icon-edit"/>
-            </el-tooltip>
-          </a>
-        </template>-->
   </vxe-grid>
 </template>
 
 <script>
-import FieldComponents from '../../../../components/xform/form-designer/form-widget/field-widget/index';
-import dataTableMixin from './data-table-mixin.js';
+import FieldComponents from "../../../../components/xform/form-designer/form-widget/field-widget/index";
+import dataTableMixin from "./data-table-mixin.js";
 import tableForm from "../../../../components/table/tableForm.vue";
 import treeMoveDialog from "../../../../components/xform/form-designer/form-widget/dialog/treeMoveDialog.vue";
 
-
 export default {
-  name: 'DataTableItem',
+  name: "DataTableItem",
   components: {
     tableForm,
     treeMoveDialog,
-    ...FieldComponents
+    ...FieldComponents,
   },
   mixins: [dataTableMixin],
   computed: {
-    heightStyle() {
+    /*heightStyle() {
       let tableHeight = this.widget.options.tableHeight;
       if (tableHeight && (tableHeight == 'auto' || tableHeight.slice(-1) == '%')) {
         return 'height:100%';
       }
       return '';
-    }
-  }
+    }*/
+  },
 };
 </script>