Mon Feb 26 16:43:00 CST 2024 inscode

src/App.vue

-<script setup>
-import HelloWorld from './components/HelloWorld.vue'
-import TheWelcome from './components/TheWelcome.vue'
-</script>
-
 <template>
-  <header>
-    <img alt="Vue logo" class="logo" src="./assets/logo.svg" width="125" height="125" />
+  <a-card :bordered="false">
+    <!-- 查询区域 -->
+    <div class="table-page-search-wrapper">
+      <a-form layout="inline" @keyup.enter.native="searchQuery">
+        <a-row :gutter="24">
+          <a-col :xl="4" :lg="7" :md="8" :sm="24">
+            <a-form-item label="SAP类型">
+              <a-select placeholder="请选择SAP.类型" v-model="queryParam.sapType" @change="getStoreAuthList">
+                <a-select-option v-for="d in sapTypeList" :key="d">
+                  {{ d }}
+                </a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :xl="4" :lg="7" :md="8" :sm="24">
+            <a-form-item label="工厂">
+              <a-select placeholder="请输入工厂" v-model="queryParam.factory" @change="getStoreAuthList">
+                <a-select-option v-for="d in factoryList" :key="d">
+                  {{ d }}
+                </a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :xl="6" :lg="7" :md="8" :sm="24">
+            <a-form-item label="单据类型">
+              <a-select placeholder="请选择单据类型" v-model="queryParam.docType" @change="getStoreAuthList" allowClear>
+                <a-select-option v-for="d in docTypeList" :key="d">
+                  {{ d }}
+                </a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :xl="4" :lg="7" :md="8" :sm="24">
+            <a-form-item label="凭证编号">
+              <j-input placeholder="请输入凭证编号" v-model="queryParam.docNo"></j-input>
+            </a-form-item>
+          </a-col>
+          <a-col :xl="4" :lg="7" :md="8" :sm="24">
+            <a-form-item label="操作人员">
+              <a-input placeholder="请输入操作人员" v-model="queryParam.operator"></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :xl="4" :lg="7" :md="8" :sm="24">
+            <a-form-item label="操作日期">
+              <j-date placeholder="请选择操作日期" v-model="queryParam.modifyDate"></j-date>
+            </a-form-item>
+          </a-col>
+          <a-col :xl="4" :lg="7" :md="8" :sm="24">
+            <a-form-item label="状态">
+              <a-select placeholder="请选择状态" v-model="queryParam.delFlag" :options="delFlagList"></a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :xl="4" :lg="7" :md="8" :sm="24">
+            <a-form-item label="时间目录">
+              <j-date placeholder="请输入时间目录" v-model="queryParam.dateDir" date-format="YYYYMM"></j-date>
+            </a-form-item>
+          </a-col>
+          <a-col :xl="4" :lg="7" :md="8" :sm="24">
+            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
+              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
+              <a-button type="primary" icon="download" style="margin-left: 8px" @click="handleExportXls('单据上传明细')"
+                >导出</a-button
+              >
+              <!-- <a @click="handleToggleSearch" style="margin-left: 8px">
+                {{ toggleSearchStatus ? '收起' : '展开' }}
+                <a-icon :type="toggleSearchStatus ? 'up' : 'down'" />
+              </a> -->
+            </span>
+          </a-col>
+        </a-row>
+      </a-form>
+    </div>
+    <!-- 查询区域-END -->
 
-    <div class="wrapper">
-      <HelloWorld msg="You did it!" />
+    <!-- 操作按钮区域 -->
+    <div class="table-operator">
+      <!-- <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button> -->
+      <a-upload
+        name="file"
+        :showUploadList="false"
+        :multiple="false"
+        :headers="tokenHeader"
+        :action="importExcelUrl"
+        @change="handleImportExcel"
+      >
+        <!-- <a-button type="primary" icon="import">导入</a-button> -->
+      </a-upload>
+      <a-dropdown v-if="selectedRowKeys.length > 0">
+        <a-menu slot="overlay">
+          <a-menu-item key="1" :hidden="roleType == 3" @click="batchDel"><a-icon type="delete" />删除</a-menu-item>
+          <a-menu-item key="2" @click="batchExport"><a-icon type="export" />下载</a-menu-item>
+        </a-menu>
+        <a-button style="margin-left: 8px"> 批量操作 <a-icon type="down"/></a-button>
+      </a-dropdown>
     </div>
-  </header>
 
-  <main>
-    <TheWelcome />
-  </main>
-</template>
+    <!-- table区域-begin -->
+    <div>
+      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
+        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择
+        <a style="font-weight: 600">{{ selectedRowKeys.length }}</a
+        >项
+        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
+      </div>
 
-<style scoped>
-header {
-  line-height: 1.5;
-}
+      <a-table
+        ref="table"
+        size="middle"
+        bordered
+        rowKey="id"
+        :columns="columns"
+        :dataSource="dataSource"
+        :pagination="ipagination"
+        :loading="loading"
+        :rowSelection="{
+          selectedRowKeys: selectedRowKeys,
+          onChange: onSelectChange,
+          getCheckboxProps: record => ({
+            props: {
+              disabled: record.banFlag == true
+            }
+          })
+        }"
+        class="j-table-force-nowrap"
+        @change="handleTableChange"
+      >
+        <span slot="action" slot-scope="text, record">
+          <a @click="preveiw(record.storePath)">预览</a>
+          <a-divider type="vertical" />
+          <a @click="getDocLog(record.docNo, record.factory)">日志</a>
+          <!-- <a-divider type="vertical" />
+          <a
+            :disabled="roleType == 3 || record.delFlag == 1 || (roleType == 2 && record.account != username)"
+            @click="handleEdit(record)"
+            >编辑</a
+          > -->
+        </span>
 
-.logo {
-  display: block;
-  margin: 0 auto 2rem;
-}
+        <template slot="status" slot-scope="text, record">
+          <a-tag v-if="record.delFlag == 1" color="red">已删除</a-tag>
+          <a-tag v-else color="green">已上传</a-tag>
+        </template>
+      </a-table>
+    </div>
+    <financeDocRecords-modal ref="modalForm" @ok="modalFormOk"></financeDocRecords-modal>
 
-@media (min-width: 1024px) {
-  header {
-    display: flex;
-    place-items: center;
-    padding-right: calc(var(--section-gap) / 2);
+    <a-modal :width="1200" title="凭证日志" v-model="logFlag" :footer="null">
+      <financeDocLogList ref="modelClick"></financeDocLogList>
+    </a-modal>
+    <a-modal :width="1200" title="送货单明细" v-model="recordsDetail1" :footer="null">
+      <a-table
+        ref="table"
+        size="middle"
+        bordered
+        rowKey="id"
+        :columns="columns2"
+        :dataSource="dataSource2"
+        
+        :loading="loading"
+        class="j-table-force-nowrap"></a-table>
+    </a-modal>
+  </a-card>
+</template>
+
+<script>
+import '@/assets/less/TableExpand.less'
+import { mixinDevice } from '@/utils/mixin'
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+import FinanceDocRecordsModal from './modules/FinanceDocRecordsModal'
+import FinanceDocLogList from './FinanceDocLogList'
+import McOrderDetailList from './McOrderDetailList'
+import JDate from '@/components/jeecg/JDate.vue'
+import { getFileAction,httpAction, getAction } from '@/api/manage'
+import JInput from '@/components/jeecg/JInput'
+
+export default {
+  name: 'FinanceDocRecordsList',
+  mixins: [JeecgListMixin, mixinDevice],
+  components: {
+    JDate,
+    FinanceDocRecordsModal,
+    FinanceDocLogList,
+    JInput
+  },
+  data() {
+    return {
+      description: '单据上传明细管理页面',
+      sapTypeList: [],
+      factoryList: [],
+      docTypeList: [],
+      dataSource2:{},
+      queryParam: {
+        delFlag: 0
+      },
+      delFlagList: [
+        {
+          title: '已上传',
+          value: 0
+        },
+        {
+          title: '已删除',
+          value: 1
+        }
+      ],
+      logFlag: false,
+      recordsDetail1: false,
+      roleType: 0,
+      username: this.$store.state.user.username,
+      docNo: '',
+      // 表头
+      columns: [
+        {
+          title: '序号',
+          dataIndex: '',
+          key:'rowIndex',
+          width:60,
+          align:"center",
+          customRender:function (t,r,index) {
+            return parseInt(index)+1;
           }
+        },
+        {
+          title: 'SAP类型',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.sapType.localeCompare(b.mandt)
+          },
+          dataIndex: 'mandt'
+        },
+        {
+          title: '客户代码',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.kunnr.localeCompare(b.kunnr)
+          },
+          dataIndex: 'kunnr'
+        },
+        {
+          title: '客户名称',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.name1.localeCompare(b.name1)
+          },
+          dataIndex: 'name1'
+        },
         
-  .logo {
-    margin: 0 2rem 0 0;
+        
+        {
+          title: '送货单',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.docNo.localeCompare(b.printno)
+          },
+          dataIndex: 'printno',
+          customRender: (text, row, index) => {
+            const username = this.$store.state.user.realname;
+            var _this=this;
+            let child = this.$createElement('a', {
+              domProps: {
+                  innerHTML: text
+              },
+              on: {
+                click: () => {
+                  let row1 = row;
+                  let printNo = row1.printno;
+                  let params ={printno:printNo};
+                  httpAction(this.url.queryDetailList,params,'post').then((res) => {
+                    if (res.success) {
+                      debugger
+                      this.recordsDetail1 = true;
+                      this.dataSource2 = res.result;
+                    }
+                    if (res.code === 510) {
+                      this.$message.warning(res.message)
+                    }
+                  })
+                }
               }
+            },{})
+            const obj = {
+                children: child,
+                attrs: {}
+            }
+            return obj
             
-  header .wrapper {
-    display: flex;
-    place-items: flex-start;
-    flex-wrap: wrap;
+          },
+        },
+        {
+          title: '来货单号',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.xblnr.localeCompare(b.xblnr)
+          },
+          dataIndex: 'xblnr'
+        },
+        {
+          title: '移动类型',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.bwart.localeCompare(b.bwart)
+          },
+          dataIndex: 'bwart'
+        },
+        {
+          title: '送货总数量',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.menge.localeCompare(b.menge)
+          },
+          dataIndex: 'menge'
+        },
+        {
+          title: '收货类别',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.type.localeCompare(b.type)
+          },
+          dataIndex: 'type'
+        },
+        {
+          title: '创建人工号',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.personid.localeCompare(b.personid)
+          },
+          dataIndex: 'personid'
+        },
+        {
+          title: '过账日期',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.budat.localeCompare(b.budat)
+          },
+          dataIndex: 'budat'
+        },
+        {
+          title: '放行日期',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.slipdata.localeCompare(b.slipdata)
+          },
+          dataIndex: 'slipdata'
+        },
+        {
+          title: '放行条编码',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.slipno.localeCompare(b.slipno)
+          },
+          dataIndex: 'slipno'
+        },
+        {
+          title: '工厂',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.factory.localeCompare(b.factory)
+          },
+          dataIndex: 'factory'
+        },
+        {
+          title: '存档到期日期',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.lastModifyDate.localeCompare(b.lastModifyDate)
+          },
+          dataIndex: 'lastModifyDate'
+        },
+        {
+          title: '实际存档日期',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.modifyDate.localeCompare(b.modifyDate)
+          },
+          dataIndex: 'modifyDate',
+          customRender: function(text) {
+            return !text ? '' : text.length > 19 ? text.substr(0, 19) : text
+          }
+        },
+        {
+          title: '状态',
+          align: 'center',
+          dataIndex: 'status',
+          scopedSlots: { customRender: 'status' }
+        },
+        {
+          title: '操作人员',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.operator.localeCompare(b.operator)
+          },
+          dataIndex: 'operator'
+        },
+        {
+          title: '操作时间',
+          align: 'center',
+          sorter: (a, b) => {
+            return a.createTime.localeCompare(b.createTime)
+          },
+          dataIndex: 'createTime',
+          customRender: function(text) {
+            return !text ? '' : text.length > 19 ? text.substr(0, 19) : text
+          }
+        },
+        {
+          title: '操作',
+          dataIndex: 'action',
+          align: 'center',
+          // fixed:"right",
+          width: 147,
+          scopedSlots: { customRender: 'action' }
+        }
+      ],
+      columns2: [
+          {
+            title: '序号',
+            dataIndex: '',
+            key:'rowIndex',
+            width:60,
+            align:"center",
+            customRender:function (t,r,index) {
+              return parseInt(index)+1;
+            }
+          },
+          {
+            title:'集团',
+            align:"center",
+            dataIndex: 'mandt'
+          },
+          {
+            title:'客户代码',
+            align:"center",
+            dataIndex: 'kunnr'
+          },
+          {
+            title:'客户名称',
+            align:"center",
+            dataIndex: 'name1'
+          },
+          {
+            title:'送货单',
+            align:"center",
+            dataIndex: 'printno'
+          },
+          {
+            title:'收货单号[物料凭证]',
+            align:"center",
+            dataIndex: 'mblnr'
+          },
+          {
+            title:'来货单号',
+            align:"center",
+            dataIndex: 'xblnr'
+          },
+          {
+            title:'SO',
+            align:"center",
+            dataIndex: 'vbeln'
+          },
+          {
+            title:'SO Item',
+            align:"center",
+            dataIndex: 'posnr'
+          },
+          {
+            title:'成品编码',
+            align:"center",
+            dataIndex: 'matnr'
+          },
+          {
+            title:'成品料号描述',
+            align:"center",
+            dataIndex: 'maktx'
+          },
+          {
+            title:'素材编码',
+            align:"center",
+            dataIndex: 'comps'
+          },
+          {
+            title:'素材物料描述',
+            align:"center",
+            dataIndex: 'maktxcomps'
+          },
+          {
+            title:'库存地点',
+            align:"center",
+            dataIndex: 'lgort'
+          },
+          {
+            title:'基本单位',
+            align:"center",
+            dataIndex: 'meins'
+          },
+          {
+            title:'移动类型',
+            align:"center",
+            dataIndex: 'bwart'
+          },
+          {
+            title:'送货数量',
+            align:"center",
+            dataIndex: 'menge'
+          },
+          {
+            title:'状态',
+            align:"center",
+            dataIndex: 'status'
+          },
+          {
+            title:'收货类别',
+            align:"center",
+            dataIndex: 'shType'
+          },
+          {
+            title:'制单人',
+            align:"center",
+            dataIndex: 'zman'
+          },
+          {
+            title:'创建人工号',
+            align:"center",
+            dataIndex: 'personid'
+          },
+          {
+            title:'过账日期',
+            align:"center",
+            dataIndex: 'budat'
+          },
+          {
+            title:'件数',
+            align:"center",
+            dataIndex: 'pieces'
+          },
+          {
+            title:'放行日期',
+            align:"center",
+            dataIndex: 'slipdata'
+          },
+          {
+            title:'放行条编码',
+            align:"center",
+            dataIndex: 'slipno'
+          },
+        ],
+      url: {
+        list: '/storedoc/financeDocRecords/list',
+        // recordsDetailList: "/storedoc/mcOrderDetail/list",
+        queryDetailList:'/storedoc/financeDocRecords/queryDetailList',
+        delete: '/storedoc/financeDocRecords/delete',
+        deleteBatch: '/storedoc/financeDocRecords/deleteBatch',
+        exportXlsUrl: '/storedoc/financeDocRecords/exportXls',
+        importExcelUrl: 'storedoc/financeDocRecords/importExcel'
+      },
+      dictOptions: {}
+    }
+  },
+  computed: {
+    importExcelUrl: function() {
+      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
+    }
+  },
+  created() {
+    this.getRoleType()
+    this.getStoreAuthList()
+  },
+  methods: {
+    initDictConfig() {},
+    getStoreAuthList() {
+      getAction('/storedoc/financeDocAuth/getStoreAuthList', this.model).then(res => {
+        if (res.success) {
+          this.sapTypeList = res.result.sapTypeList
+          this.factoryList = res.result.factoryList
+          this.docTypeList = res.result.docTypeList
+          if (this.sapTypeList && this.sapTypeList.length == 1) {
+            this.queryParam.sapType = res.result.sapTypeList[0]
+          }
+          if (this.factoryList && this.factoryList.length == 1) {
+            this.queryParam.factory = res.result.factoryList[0]
+          }
+          if (this.docTypeList && this.docTypeList.length == 1) {
+            this.queryParam.docType = res.result.docTypeList[0]
+          }
+        }
+      })
+    },
+    preveiw(filePath) {
+      if (!filePath || filePath == '') {
+        this.$message.warning('文件不存在')
+      } else {
+        window.open(filePath)
+        // getFileAction('/finance/orderBackUpload/exportFile', { filePath: filePath }).then(res => {
+        //   let url = window.URL.createObjectURL(res)
+        //   console.log(res)
+        //   let result = `${window._CONFIG['domianURL']}/generic/web/viewer.html?file=` + encodeURIComponent(url)
+        //   window.open(url)
+        // })
+      }
+    },
+    getRoleType() {
+      getAction('/storedoc/financeDocAuth/getRoleType').then(res => {
+        this.roleType = res.result
+      })
+    },
+    getDocLog(docNo, factory) {
+      this.logFlag = true
+      this.$nextTick(() => {
+        this.$refs.modelClick.refresh(docNo, factory)
+      })
+    },
+    batchExport() {
+      if (this.selectedRowKeys.length <= 0) {
+        this.$message.warning('请选择一条记录！')
+        return
+      } else if (this.selectedRowKeys.length > 50) {
+        this.$message.warning('最多选择50条记录！')
+        return
+      } else {
+        var ids = ''
+        for (var a = 0; a < this.selectedRowKeys.length; a++) {
+          ids += this.selectedRowKeys[a] + ','
+        }
+        var that = this
+        this.$confirm({
+          title: '确认下载',
+          content: '是否下载选中数据?',
+          onOk: function() {
+            that.loading = true
+            getFileAction('/storedoc/financeDocRecords/batchDownload', { ids: ids })
+              .then(res => {
+                let url = window.URL.createObjectURL(res)
+                const link = document.createElement('a') // 创建a标签
+                link.href = url
+                link.download = '单据明细.zip' // 重命名文件
+                link.click()
+                URL.revokeObjectURL(url) // 释放内存
+                // window.open(url)
+              })
+              .finally(() => {
+                that.loading = false
+              })
+          }
+        })
+      }
+    }
   }
 }
+</script>
+<style scoped>
+@import '~@assets/less/common.less';
 </style>
+