1

huangxiaoqiang

21 小时以前 af5847927931d3f491d7be5e0178cff3c37ac6f9

 ÏîÄ¿´úÂë/WMS/WIDESEA_WMSClient/src/components/basic/ViewGrid/ViewGrid.vue

@@ -2,35 +2,60 @@
  <div class="layout-container">
    <a :href="exportHref" ref="export"></a>
    <!--开启懒加载2020.12.06 -->
    <vol-box :on-model-close="closeCustomModel" v-model="viewModel" :height="520" :width="500" :padding="0" :lazy="true"
      title="设置">
    <vol-box
      :on-model-close="closeCustomModel"
      v-model="viewModel"
      :height="520"
      :width="500"
      :padding="0"
      :lazy="true"
      title="设置"
    >
      <template #content>
        <custom-column :view-columns="viewColumns"></custom-column>
      </template>
      <template #footer>
        <div style="text-align: center">
          <el-button type="default" size="small" @click="closeCustomModel"><i class="el-icon-close"></i>取消</el-button>
          <el-button type="success" size="small" @click="initViewColumns(true)"><i
              class="el-icon-refresh"></i>重置</el-button>
          <el-button type="primary" size="small" @click="saveColumnConfig"><i class="el-icon-check"></i>确定</el-button>
          <el-button type="default" size="small" @click="closeCustomModel"
            ><i class="el-icon-close"></i>取消</el-button
          >
          <el-button type="success" size="small" @click="initViewColumns(true)"
            ><i class="el-icon-refresh"></i>重置</el-button
          >
          <el-button type="primary" size="small" @click="saveColumnConfig"
            ><i class="el-icon-check"></i>确定</el-button
          >
        </div>
      </template>
    </vol-box>
    <ViewGridAudit @auditClick="saveAudit" :option="table" ref="audit">

    </ViewGridAudit>
    <ViewGridAudit @auditClick="saveAudit" :option="table" ref="audit"> </ViewGridAudit>

    <!--导入excel功能-->
    <!--2020.10.31添加导入前的方法-->
    <!--开启懒加载2020.12.06 -->
    <!-- 2022.01.08增加明细表导入判断 -->
    <vol-box v-if="upload.url" v-model="upload.excel" :height="350" :width="600" :lazy="true"
      :title="(boxModel ? detailOptions.cnName : table.cnName) + '-导入'">
      <UploadExcel ref="upload_excel" @importExcelAfter="importExcelAfter" :importExcelBefore="importExcelBefore"
        :url="upload.url" :template="upload.template"></UploadExcel>
    <vol-box
      v-if="upload.url"
      v-model="upload.excel"
      :height="350"
      :width="600"
      :lazy="true"
      :title="(boxModel ? detailOptions.cnName : table.cnName) + '-导入'"
    >
      <UploadExcel
        ref="upload_excel"
        @importExcelAfter="importExcelAfter"
        :importExcelBefore="importExcelBefore"
        :url="upload.url"
        :template="upload.template"
      ></UploadExcel>
    </vol-box>
    <!--头部自定义组件-->
    <component :is="dynamicComponent.gridHeader" ref="gridHeader" @parentCall="parentCall"></component>
    <component
      :is="dynamicComponent.gridHeader"
      ref="gridHeader"
      @parentCall="parentCall"
    ></component>
    <!--主界面查询与table表单布局-->
    <div class="view-container">
      <!-- 2020.09.11增加固定查询表单 -->
@@ -38,8 +63,15 @@
      <div class="grid-search">
        <div :class="[fiexdSearchForm ? 'fiexd-search-box' : 'search-box']" v-show="searchBoxShow">
          <!-- 2020.09.13增加formFileds拼写错误兼容处理 -->
          <vol-form ref="searchForm" :load-key="false" style="padding: 0 15px" :label-width="labelWidth"
            :formRules="searchFormOptions" :formFields="searchFormFields" :select2Count="select2Count">
          <vol-form
            ref="searchForm"
            :load-key="false"
            style="padding: 0 15px"
            :label-width="labelWidth"
            :formRules="searchFormOptions"
            :formFields="searchFormFields"
            :select2Count="select2Count"
          >
            <template #footer>
              <div v-if="!fiexdSearchForm" class="form-closex">
                <el-button size="small" type="primary" plain @click="search">
@@ -67,9 +99,15 @@
          </div>
          <!--快速查询字段-->
          <div class="search-line" v-if="!fiexdSearchForm && !searchBoxShow">
            <QuickSearch v-if="singleSearch" :searchFormOptions="searchFormOptions" :searchFormFields="searchFormFields"
              :select2Count="select2Count" :label-width="labelWidth" :queryFields="queryFields"
              @tiggerPress="quickSearchKeyPress"></QuickSearch>
            <QuickSearch
              v-if="singleSearch"
              :searchFormOptions="searchFormOptions"
              :searchFormFields="searchFormFields"
              :select2Count="select2Count"
              :label-width="labelWidth"
              :queryFields="queryFields"
              @tiggerPress="quickSearchKeyPress"
            ></QuickSearch>
          </div>
          <!--操作按钮组-->
          <!-- 2020.11.29增加查询界面hidden属性 -->
@@ -78,7 +116,8 @@
            <template :key="bIndex" v-for="(btn, bIndex) in buttons.slice(0, maxBtnLength)">
              <el-dropdown size="small" v-if="btn.data" :split-button="false">
                <el-button :color="btn.color" :dark="false" :type="btn.type" :plain="btn.plain">
                  {{ btn.name }}<i class="el-icon-arrow-down el-icon--right"></i></el-button>
                  {{ btn.name }}<i class="el-icon-arrow-down el-icon--right"></i
                ></el-button>
                <template #dropdown>
                  <el-dropdown-menu>
                    <el-dropdown-item v-for="(item, index) in btn.data" :key="index">
@@ -90,13 +129,28 @@
                  </el-dropdown-menu>
                </template>
              </el-dropdown>
              <el-button v-else :type="btn.type" size="small" :color="btn.color" :dark="false" :class="btn.class"
                :plain="btn.plain" v-show="!btn.hidden" @click="onClick(btn.onClick)">
              <el-button
                v-else
                :type="btn.type"
                size="small"
                :color="btn.color"
                :dark="false"
                :class="btn.class"
                :plain="btn.plain"
                v-show="!btn.hidden"
                @click="onClick(btn.onClick)"
              >
                <i :class="btn.icon"></i> {{ btn.name }}
              </el-button>
            </template>
            <el-button type="default" style="padding: 0px 10px" size="small" :plain="true" v-if="showCustom"
              @click="showCustomModel">
            <el-button
              type="default"
              style="padding: 0px 10px"
              size="small"
              :plain="true"
              v-if="showCustom"
              @click="showCustomModel"
            >
              <i class="el-icon-s-grid"></i>
            </el-button>
            <el-dropdown size="small" @click="changeDropdown" v-if="buttons.length > maxBtnLength">
@@ -105,11 +159,15 @@
              </el-button>
              <template #dropdown>
                <el-dropdown-menu>
                  <el-dropdown-item @click="changeDropdown(item.name)" :name="item.name" v-show="!item.hidden" v-for="(item, dIndex) in buttons.slice(
                    maxBtnLength,
                    buttons.length
                  )" :key="dIndex">
                    <i :class="item.icon"></i> {{ item.name }}</el-dropdown-item>
                  <el-dropdown-item
                    @click="changeDropdown(item.name)"
                    :name="item.name"
                    v-show="!item.hidden"
                    v-for="(item, dIndex) in buttons.slice(maxBtnLength, buttons.length)"
                    :key="dIndex"
                  >
                    <i :class="item.icon"></i> {{ item.name }}</el-dropdown-item
                  >
                </el-dropdown-menu>
              </template>
            </el-dropdown>
@@ -117,27 +175,54 @@
        </div>

        <!-- åˆ†å‰²ä½ç½® -->
        <vol-box v-if="boxInit" v-model="boxModel" :title="boxOptions.title" :width="boxOptions.width"
          :height="boxOptions.height" :modal="boxOptions.modal" :draggable="boxOptions.draggable" :padding="0"
          :on-model-close="onGridModelClose" @fullscreen="fullscreen">
        <vol-box
          v-if="boxInit"
          v-model="boxModel"
          :title="boxOptions.title"
          :width="boxOptions.width"
          :height="boxOptions.height"
          :modal="boxOptions.modal"
          :draggable="boxOptions.draggable"
          :padding="0"
          :on-model-close="onGridModelClose"
          @fullscreen="fullscreen"
        >
          <!--明细头部自定义组件-->
          <template #content>
            <div class="box-com vol-edit-box">
              <div class="vol-edit-content">
                <component :is="dynamicComponent.modelHeader" ref="modelHeader" @parentCall="parentCall"></component>
                <component
                  :is="dynamicComponent.modelHeader"
                  ref="modelHeader"
                  @parentCall="parentCall"
                ></component>
                <!-- <div v-show="isBoxAudit" class="flow-step">
                <div v-for="(item, index) in workFlowSteps" :key="index">
                  {{ item.stepName }}
                </div>
              </div> -->
                <div class="item form-item">
                  <vol-form ref="form" :editor="editor" :load-key="false" :label-width="boxOptions.labelWidth"
                    :formRules="editFormOptions" :formFields="editFormFields" :select2Count="select2Count"></vol-form>
                  <vol-form
                    ref="form"
                    :editor="editor"
                    :load-key="false"
                    :label-width="boxOptions.labelWidth"
                    :formRules="editFormOptions"
                    :formFields="editFormFields"
                    :select2Count="select2Count"
                  ></vol-form>
                </div>
                <!--明细body自定义组件-->
                <component :is="dynamicComponent.modelBody" ref="modelBody" @parentCall="parentCall"></component>
                <div v-show="hasDetail" v-if="detail.columns && detail.columns.length > 0"
                  class="grid-detail table-item item">
                <component
                  :is="dynamicComponent.modelBody"
                  ref="modelBody"
                  @parentCall="parentCall"
                ></component>
                <div
                  v-show="hasDetail"
                  v-if="detail.columns && detail.columns.length > 0"
                  class="grid-detail table-item item"
                >
                  <div class="toolbar">
                    <div class="title form-text">
                      <span>
@@ -147,43 +232,85 @@
                    </div>
                    <!--明细表格按钮-->
                    <div class="btns" v-show="!isBoxAudit">
                      <el-button v-for="(btn, bIndex) in detailOptions.buttons" :key="bIndex" :plain="btn.plain"
                        v-show="!(typeof btn.hidden == 'boolean' && btn.hidden)" @click="onClick(btn.onClick)"
                        size="small"><i :class="btn.icon"></i>{{ btn.name }}</el-button>
                      <el-button
                        v-for="(btn, bIndex) in detailOptions.buttons"
                        :key="bIndex"
                        :plain="btn.plain"
                        v-show="!(typeof btn.hidden == 'boolean' && btn.hidden)"
                        @click="onClick(btn.onClick)"
                        size="small"
                        ><i :class="btn.icon"></i>{{ btn.name }}</el-button
                      >
                    </div>
                  </div>
                  <vol-table ref="detail" @loadBefore="loadInternalDetailTableBefore" @loadAfter="loadDetailTableAfter"
                    @rowChange="detailRowOnChange" @rowClick="detailRowOnClick" :url="detailOptions.url"
                    :load-key="false" :index="true" :tableData="detailOptions.data" :columns="detailOptions.columns"
                    :pagination="detailOptions.pagination" :height="detailOptions.height" :single="detailOptions.single"
                    :pagination-hide="detailOptions.paginationHide" :defaultLoadPage="detailOptions.load"
                    :beginEdit="detailOptions.beginEdit" :endEditBefore="detailOptions.endEditBefore"
                    :endEditAfter="detailOptions.endEditAfter" :double-edit="detailOptions.doubleEdit"
                    :column-index="detailOptions.columnIndex" :ck="detailOptions.ck"
                    :text-inline="detailOptions.textInline" :select2Count="select2Count" :selectable="detailSelectable"
                    :spanMethod="detailSpanMethod"></vol-table>
                  <vol-table
                    ref="detail"
                    @loadBefore="loadInternalDetailTableBefore"
                    @loadAfter="loadDetailTableAfter"
                    @rowChange="detailRowOnChange"
                    @rowClick="detailRowOnClick"
                    :url="detailOptions.url"
                    :load-key="false"
                    :index="true"
                    :tableData="detailOptions.data"
                    :columns="detailOptions.columns"
                    :pagination="detailOptions.pagination"
                    :height="detailOptions.height"
                    :single="detailOptions.single"
                    :pagination-hide="detailOptions.paginationHide"
                    :defaultLoadPage="detailOptions.load"
                    :beginEdit="detailOptions.beginEdit"
                    :endEditBefore="detailOptions.endEditBefore"
                    :endEditAfter="detailOptions.endEditAfter"
                    :double-edit="detailOptions.doubleEdit"
                    :column-index="detailOptions.columnIndex"
                    :ck="detailOptions.ck"
                    :text-inline="detailOptions.textInline"
                    :select2Count="select2Count"
                    :selectable="detailSelectable"
                    :spanMethod="detailSpanMethod"
                  ></vol-table>
                </div>
                <component :is="dynamicComponent.modelFooter" ref="modelFooter" @parentCall="parentCall"></component>
                <component
                  :is="dynamicComponent.modelFooter"
                  ref="modelFooter"
                  @parentCall="parentCall"
                ></component>
              </div>
              <div class="vol-edit-box-right">
                <component :is="dynamicComponent.modelRight" ref="modelRight" @parentCall="parentCall"></component>
                <component
                  :is="dynamicComponent.modelRight"
                  ref="modelRight"
                  @parentCall="parentCall"
                ></component>
              </div>
            </div>
          </template>
          <template #footer>
            <div style="text-align: center;" v-show="isBoxAudit">
            <div style="text-align: center" v-show="isBoxAudit">
              <el-button size="small" type="primary" plain @click="onGridModelClose(false)">
                <i class="el-icon-close">关闭</i>
              </el-button>
              <el-button size="small" type="primary" v-show="auditParam.showViewButton"
                @click="auditParam.model = true">
              <el-button
                size="small"
                type="primary"
                v-show="auditParam.showViewButton"
                @click="auditParam.model = true"
              >
                <i class="el-icon-view">审批</i>
              </el-button>
            </div>
            <div v-show="!isBoxAudit">
              <el-button v-for="(btn, bIndex) in boxButtons" :key="bIndex" :type="btn.type" size="small"
                :plain="btn.plain" v-show="!(typeof btn.hidden == 'boolean' && btn.hidden)"
                :disabled="btn.hasOwnProperty('disabled') && !!btn.disabled" @click="onClick(btn.onClick)">
              <el-button
                v-for="(btn, bIndex) in boxButtons"
                :key="bIndex"
                :type="btn.type"
                size="small"
                :plain="btn.plain"
                v-show="!(typeof btn.hidden == 'boolean' && btn.hidden)"
                :disabled="btn.hasOwnProperty('disabled') && !!btn.disabled"
                @click="onClick(btn.onClick)"
              >
                <i :class="btn.icon"></i>{{ btn.name }}
              </el-button>
              <el-button size="small" type="primary" plain @click="onGridModelClose(false)">
@@ -195,26 +322,61 @@
      </div>
      <!--body自定义组件-->
      <div class="grid-body">
        <component :is="dynamicComponent.gridBody" ref="gridBody" @parentCall="parentCall"></component>
        <component
          :is="dynamicComponent.gridBody"
          ref="gridBody"
          @parentCall="parentCall"
        ></component>
      </div>

      <!--table表格-->
      <div class="grid-container">
        <!-- 2021.05.02增加树形结构 rowKey -->
        <vol-table ref="table" :single="single" :rowKey="rowKey" :loadTreeChildren="loadTreeTableChildren"
          @loadBefore="loadTableBefore" @loadAfter="loadTableAfter" @rowChange="rowOnChange" @rowClick="rowOnClick"
          @rowDbClick="rowOnDbClick" @selectionChange="selectionOnChange" :tableData="[]" :linkView="linkData"
          :columns="columns" :pagination="pagination" :height="height" :max-height="tableMaxHeight"
          :pagination-hide="paginationHide" :url="url" :load-key="false" :defaultLoadPage="load"
          :double-edit="doubleEdit" :index="doubleEdit" :beginEdit="tableBeginEdit" :endEditBefore="tableEndEditBefore"
          :column-index="columnIndex" :text-inline="textInline" :ck="ck" :select2Count="select2Count"
          :selectable="selectable" :spanMethod="spanMethod" :lazy="lazy" :defaultExpandAll="defaultExpandAll"
          :expandRowKeys="expandRowKeys" :rowParentField="rowParentField"></vol-table>
        <vol-table
          ref="table"
          :single="single"
          :rowKey="rowKey"
          :loadTreeChildren="loadTreeTableChildren"
          @loadBefore="loadTableBefore"
          @loadAfter="loadTableAfter"
          @rowChange="rowOnChange"
          @rowClick="rowOnClick"
          @rowDbClick="rowOnDbClick"
          @selectionChange="selectionOnChange"
          :tableData="[]"
          :linkView="linkData"
          :columns="columns"
          :pagination="pagination"
          :height="height"
          :max-height="tableMaxHeight"
          :pagination-hide="paginationHide"
          :url="url"
          :load-key="false"
          :defaultLoadPage="load"
          :double-edit="doubleEdit"
          :index="doubleEdit"
          :beginEdit="tableBeginEdit"
          :endEditBefore="tableEndEditBefore"
          :column-index="columnIndex"
          :text-inline="textInline"
          :ck="ck"
          :select2Count="select2Count"
          :selectable="selectable"
          :spanMethod="spanMethod"
          :lazy="lazy"
          :defaultExpandAll="defaultExpandAll"
          :expandRowKeys="expandRowKeys"
          :rowParentField="rowParentField"
        ></vol-table>
      </div>
    </div>

    <!--footer自定义组件-->
    <component :is="dynamicComponent.gridFooter" ref="gridFooter" @parentCall="parentCall"></component>
    <component
      :is="dynamicComponent.gridFooter"
      ref="gridFooter"
      @parentCall="parentCall"
    ></component>
  </div>
</template>

@@ -231,34 +393,22 @@
  DOWNLOADTEMPLATE: 'DownLoadTemplate', //下载导入模板
  IMPORT: 'Import', //导入(导入表的Excel功能)
  UPLOAD: 'Upload' //上传文件
};
import Empty from '@/components/basic/Empty.vue';
}
import Empty from '@/components/basic/Empty.vue'

import VolTable from '@/components/basic/VolTable.vue';
import VolForm from '@/components/basic/VolForm.vue';
import {
  defineAsyncComponent,
  defineComponent,
  ref,
  shallowRef,
  toRaw
} from 'vue';
import VolTable from '@/components/basic/VolTable.vue'
import VolForm from '@/components/basic/VolForm.vue'
import { defineAsyncComponent, defineComponent, ref, shallowRef, toRaw } from 'vue'
var vueParam = {
  emits: ['parentCall'],
  components: {
    'vol-form': VolForm,
    'vol-table': VolTable,
    VolBox: defineAsyncComponent(() => import('@/components/basic/VolBox.vue')),
    QuickSearch: defineAsyncComponent(() =>
      import('@/components/basic/QuickSearch.vue')
    ),
    QuickSearch: defineAsyncComponent(() => import('@/components/basic/QuickSearch.vue')),
    Audit: defineAsyncComponent(() => import('@/components/basic/Audit.vue')),
    UploadExcel: defineAsyncComponent(() =>
      import('@/components/basic/UploadExcel.vue')
    ),
    'custom-column': defineAsyncComponent(() =>
      import('./ViewGridCustomColumn.vue')
    ),
    UploadExcel: defineAsyncComponent(() => import('@/components/basic/UploadExcel.vue')),
    'custom-column': defineAsyncComponent(() => import('./ViewGridCustomColumn.vue')),
    'vol-header': defineAsyncComponent(() => import('./../VolHeader.vue')),
    ViewGridAudit: defineAsyncComponent(() => import('./ViewGridAudit.vue'))
  },
@@ -273,17 +423,17 @@
      modelBody: Empty,
      modelRight: Empty,
      modelFooter: Empty
    };
    }
    //合并扩展组件
    if (props.extend.components) {
      for (const key in props.extend.components) {
        if (props.extend.components[key]) {
          dynamicCom[key] = toRaw(props.extend.components[key]);
          dynamicCom[key] = toRaw(props.extend.components[key])
        }
      }
    }
    const dynamicComponent = shallowRef(dynamicCom);
    return { dynamicComponent };
    const dynamicComponent = shallowRef(dynamicCom)
    return { dynamicComponent }
  },
  data() {
    return {
@@ -356,15 +506,15 @@
        currentReadonly: false, //当前用户没有编辑或新建权限时，表单只读(可用于判断用户是否有编辑或新建权限)
        //开启编辑时
        beginEdit: (row, column, index) => {
          return true;
          return true
        },
        //结束编辑前
        endEditBefore: (row, column, index) => {
          return true;
          return true
        },
        //结束编辑后
        endEditAfter: (row, column, index) => {
          return true;
          return true
        },
        columnIndex: false, //2020.11.01明细是否显示行号
        ck: true //2020.11.01明细是否显示checkbox
@@ -427,62 +577,58 @@
      defaultExpandAll: false,//树形表格是否展开所有
      expandRowKeys: [],//默认展开行的主键值2024.09.03
      paginationHide: false,//是否隐藏分页
      rowParentField: "", //树形表格父级id
      text: ""//界面上标题后显示的文本，可以是html标签
    };
      rowParentField: '', //树形表格父级id
      text: '' //界面上标题后显示的文本，可以是html标签
    }
  },
  methods: {},
  activated() {
    this.initFlowQuery();
    this.initFlowQuery()
    //2020.06.25增加activated方法
    this.onActivated && this.onActivated();
    this.onActivated && this.onActivated()
    if (!this._inited) {
      this._inited = true;
      return;
      this._inited = true
      return
    }
    if (this.activatedLoad) {
      this.refresh();
      this.refresh()
    }
  },
  mounted() {
    this.mounted();
    this.mounted()
    // this.$refs.searchForm.forEach()
  },
  unmounted() {
    this.destroyed();
    this.destroyed()
  },
  created: function () {
    //合并自定义业务扩展方法
    Object.assign(this, this.extend.methods);
    Object.assign(this, this.extend.methods)
    //如果没有指定排序字段，则用主键作为默认排序字段
    this.pagination.sortName = this.table.sortName || this.table.key;
    this.initBoxButtons(); //初始化弹出框与明细表格按钮
    this.initAuditColumn();
    this.onInit(); //初始化前，如果需要做其他处理在扩展方法中覆盖此方法
    this.getButtons();
    this.pagination.sortName = this.table.sortName || this.table.key
    this.initBoxButtons() //初始化弹出框与明细表格按钮
    this.initAuditColumn()
    this.onInit() //初始化前，如果需要做其他处理在扩展方法中覆盖此方法
    this.getButtons()
    //初始化自定义表格列
    this.initViewColumns();
    this.initViewColumns()
    //初始编辑框等数据
    this.initBoxHeightWidth();
    this.initDicKeys(); //初始下框数据源
    this.onInited(); //初始化后，如果需要做其他处理在扩展方法中覆盖此方法
    this.initBoxHeightWidth()
    this.initDicKeys() //初始下框数据源
    this.onInited() //初始化后，如果需要做其他处理在扩展方法中覆盖此方法
  },
  beforeUpdate: function () { },
  updated: function () { }
};
}

import props from './props.js';
import methods from './methods.jsx';
import props from './props.js'
import methods from './methods.jsx'

//合并属性
vueParam.props = Object.assign(vueParam.props, props);
vueParam.props = Object.assign(vueParam.props, props)
//合并方法
vueParam.methods = Object.assign(
  vueParam.methods,
  methods,
  props.extend.methods
);
export default defineComponent(vueParam);
vueParam.methods = Object.assign(vueParam.methods, methods, props.extend.methods)
export default defineComponent(vueParam)
</script>
<style lang="less" scoped>
@import './ViewGrid.less';