|
@@ -1,257 +0,0 @@
|
|
-<template>
|
|
|
|
- <div>
|
|
|
|
- <a-card size="small" :bordered="false" class="foreignTradeGoods-wrap searchBoxNormal">
|
|
|
|
- <!-- 搜索条件 -->
|
|
|
|
- <div ref="tableSearch" class="table-page-search-wrapper">
|
|
|
|
- <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
|
|
|
|
- <a-row :gutter="15">
|
|
|
|
- <a-col :md="6" :sm="24">
|
|
|
|
- <a-form-item label="产品编码/原厂编码">
|
|
|
|
- <a-input id="foreignTradeGoods-productCode" v-model.trim="queryParam.productCode" allowClear placeholder="请输入产品编码/原厂编码"/>
|
|
|
|
- </a-form-item>
|
|
|
|
- </a-col>
|
|
|
|
- <a-col :md="6" :sm="24">
|
|
|
|
- <a-form-item label="OE码">
|
|
|
|
- <a-input id="foreignTradeGoods-oeCode" v-model.trim="queryParam.oeCode" allowClear placeholder="请输入OE码"/>
|
|
|
|
- </a-form-item>
|
|
|
|
- </a-col>
|
|
|
|
- <a-col :md="6" :sm="24">
|
|
|
|
- <a-form-item label="大厂码">
|
|
|
|
- <a-input id="foreignTradeGoods-queryBigCode " v-model.trim="queryParam.queryBigCode " allowClear placeholder="请输入大厂码"/>
|
|
|
|
- </a-form-item>
|
|
|
|
- </a-col>
|
|
|
|
- <template v-if="advanced">
|
|
|
|
- <a-col :md="6" :sm="24">
|
|
|
|
- <a-form-item label="产品名称">
|
|
|
|
- <a-input id="foreignTradeGoods-productName" v-model.trim="queryParam.productName" allowClear placeholder="请输入产品名称"/>
|
|
|
|
- </a-form-item>
|
|
|
|
- </a-col>
|
|
|
|
- <a-col :md="6" :sm="24">
|
|
|
|
- <a-form-item label="产品分类">
|
|
|
|
- <productTypeAll id="foreignTradeGoods-productType" placeholder="请选择产品分类" @change="changeProductType" v-model="productType"></productTypeAll>
|
|
|
|
- </a-form-item>
|
|
|
|
- </a-col>
|
|
|
|
- <a-col :md="6" :sm="24">
|
|
|
|
- <a-form-item label="主材料">
|
|
|
|
- <a-input id="foreignTradeGoods-material" v-model.trim="queryParam.material" allowClear placeholder="请输入主材料"/>
|
|
|
|
- </a-form-item>
|
|
|
|
- </a-col>
|
|
|
|
- </template>
|
|
|
|
- <a-col :md="6" :sm="24" style="margin-bottom: 10px;">
|
|
|
|
- <a-button type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="foreignTradeGoods-refresh">查询</a-button>
|
|
|
|
- <a-button style="margin-left: 5px" @click="resetSearchForm" :disabled="disabled" id="foreignTradeGoods-reset">重置</a-button>
|
|
|
|
- <a-button
|
|
|
|
- style="margin-left: 5px;"
|
|
|
|
- v-if="$hasPermissions('B_foreignTradeGood_export')"
|
|
|
|
- type="primary"
|
|
|
|
- class="button-warning"
|
|
|
|
- @click="handleExport"
|
|
|
|
- :disabled="disabled"
|
|
|
|
- :loading="exportLoading"
|
|
|
|
- id="foreignTradeGoods-export">导出</a-button>
|
|
|
|
- <a @click="advanced=!advanced" style="margin-left: 5px">
|
|
|
|
- {{ advanced ? '收起' : '展开' }}
|
|
|
|
- <a-icon :type="advanced ? 'up' : 'down'"/>
|
|
|
|
- </a>
|
|
|
|
- </a-col>
|
|
|
|
- </a-row>
|
|
|
|
- </a-form>
|
|
|
|
- </div>
|
|
|
|
- </a-card>
|
|
|
|
- <a-card size="small" :bordered="false">
|
|
|
|
- <a-spin :spinning="spinning" tip="Loading...">
|
|
|
|
- <!-- 操作按钮-->
|
|
|
|
- <div class="table-operator">
|
|
|
|
- <a-button
|
|
|
|
- v-if="$hasPermissions('B_foreignTradeGood_search')"
|
|
|
|
- id="foreignTradeGoods-batchAudit"
|
|
|
|
- type="primary"
|
|
|
|
- @click="openGuideModal = true"
|
|
|
|
- >批量查询</a-button>
|
|
|
|
- </div>
|
|
|
|
- <s-table
|
|
|
|
- class="sTable fixPagination"
|
|
|
|
- ref="table"
|
|
|
|
- :style="{ height: tableHeight+70+'px' }"
|
|
|
|
- size="small"
|
|
|
|
- :rowKey="(record) => record.no"
|
|
|
|
- rowKeyName="no"
|
|
|
|
- :columns="columns"
|
|
|
|
- :data="loadData"
|
|
|
|
- :pageSize="30"
|
|
|
|
- :scroll="{ y: tableHeight-30 }"
|
|
|
|
- :defaultLoadData="false"
|
|
|
|
- bordered>
|
|
|
|
- </s-table>
|
|
|
|
- </a-spin>
|
|
|
|
- <!-- 批量查询 -->
|
|
|
|
- <importGuideModal :openModal="openGuideModal" @close="openGuideModal=false" />
|
|
|
|
- <!-- 导出提示框 -->
|
|
|
|
- <reportModal :visible="showExport" @close="showExport=false"></reportModal>
|
|
|
|
- </a-card>
|
|
|
|
- </div>
|
|
|
|
-</template>
|
|
|
|
-
|
|
|
|
-<script>
|
|
|
|
-import { commonMixin } from '@/utils/mixin'
|
|
|
|
-// 组件
|
|
|
|
-import { STable, VSelect } from '@/components'
|
|
|
|
-import productTypeAll from '@/views/common/productTypeAll.js'
|
|
|
|
-import { hdExportExcel } from '@/libs/exportExcel'
|
|
|
|
-import ImportGuideModal from './importGuideModal.vue'
|
|
|
|
-import reportModal from '@/views/common/reportModal.vue'
|
|
|
|
-// 接口
|
|
|
|
-import { productForeignList, foreignProductListExport } from '@/api/productForeign'
|
|
|
|
-export default {
|
|
|
|
- name: 'ForeignTradeGoods',
|
|
|
|
- mixins: [commonMixin],
|
|
|
|
- components: { STable, VSelect, productTypeAll, ImportGuideModal, reportModal },
|
|
|
|
- data () {
|
|
|
|
- const _this = this
|
|
|
|
- return {
|
|
|
|
- spinning: false,
|
|
|
|
- openGuideModal: false, // 批量查询 弹窗
|
|
|
|
- advanced: true, // 高级搜索 展开/关闭
|
|
|
|
- disabled: false, // 查询、重置按钮是否可操作
|
|
|
|
- tableHeight: 0, // 表格高度
|
|
|
|
- queryParam: { // 查询条件
|
|
|
|
- productName: undefined, // 产品名称
|
|
|
|
- productCode: undefined, // 产品编码
|
|
|
|
- productTypeSn1: undefined, // 产品一级分类
|
|
|
|
- productTypeSn2: undefined, // 产品二级分类
|
|
|
|
- productTypeSn3: undefined, // 产品三级分类
|
|
|
|
- oeCode: undefined, // oe码
|
|
|
|
- queryBigCode: undefined, // 大厂码
|
|
|
|
- material: undefined// 主材料
|
|
|
|
- },
|
|
|
|
- productType: [], // 产品分类
|
|
|
|
- exportLoading: false, // 导出 loading
|
|
|
|
- showExport: false, // 导出弹窗
|
|
|
|
- columns: [
|
|
|
|
- { title: '序号', dataIndex: 'no', width: '4%', align: 'center' },
|
|
|
|
- { title: '产品名称', dataIndex: 'productEntity.name', align: 'left', width: '15%', customRender: function (text) { return text || '--' }, ellipsis: true },
|
|
|
|
- { title: '产品编码', dataIndex: 'productEntity.code', width: '8%', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
|
- { title: '原厂编码', dataIndex: 'productEntity.origCode', width: '10%', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
|
- { title: '产品一级分类', dataIndex: 'productEntity.productTypeName1', width: '10%', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
|
- { title: '产品二级分类', dataIndex: 'productEntity.productTypeName2', width: '10%', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
|
- { title: '产品三级分类', dataIndex: 'productEntity.productTypeName3', width: '10%', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
|
- { title: '主材料', dataIndex: 'material', width: '8%', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
|
- { title: 'OE码', dataIndex: 'oeCode', width: '9%', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
|
- { title: '大厂码',
|
|
|
|
- children: [
|
|
|
|
- {
|
|
|
|
- title: 'MANN No.', dataIndex: 'mannCode', width: '10%', align: 'center', customRender: function (text) { return text || '--' }
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- title: 'MAHLE No.', dataIndex: 'mahleCode', width: '10%', align: 'center', customRender: function (text) { return text || '--' }
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- title: 'VIC No.', dataIndex: 'vicCode', width: '10%', align: 'center', customRender: function (text) { return text || '--' }
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- title: 'FRAM NO.', dataIndex: 'framCode', width: '10%', align: 'center', customRender: function (text) { return text || '--' }
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- title: 'WIX No.', dataIndex: 'wixCode', width: '10%', align: 'center', customRender: function (text) { return text || '--' }
|
|
|
|
- }
|
|
|
|
- ]
|
|
|
|
- },
|
|
|
|
- { title: '含盒报价', dataIndex: 'priceFreeBox', width: '8%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
|
|
|
|
- { title: '无盒报价', dataIndex: 'priceWithBox', width: '8%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } }
|
|
|
|
- ],
|
|
|
|
- // 加载数据方法 必须为 Promise 对象
|
|
|
|
- loadData: parameter => {
|
|
|
|
- this.disabled = true
|
|
|
|
- this.spinning = true
|
|
|
|
- return productForeignList(Object.assign(parameter, this.queryParam)).then(res => {
|
|
|
|
- let data
|
|
|
|
- if (res.status == 200) {
|
|
|
|
- data = res.data
|
|
|
|
- const no = (data.pageNo - 1) * data.pageSize
|
|
|
|
- for (var i = 0; i < data.list.length; i++) {
|
|
|
|
- data.list[i].no = no + i + 1
|
|
|
|
- }
|
|
|
|
- this.disabled = false
|
|
|
|
- }
|
|
|
|
- this.spinning = false
|
|
|
|
- return data
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- methods: {
|
|
|
|
- // 重置
|
|
|
|
- resetSearchForm () {
|
|
|
|
- this.queryParam = {
|
|
|
|
- productName: undefined, // 产品名称
|
|
|
|
- productCode: undefined, // 产品编码
|
|
|
|
- productTypeSn1: undefined, // 产品一级分类
|
|
|
|
- productTypeSn2: undefined, // 产品二级分类
|
|
|
|
- productTypeSn3: undefined, // 产品三级分类
|
|
|
|
- oeCode: undefined, // oe码
|
|
|
|
- queryBigCode: undefined, // 大厂码
|
|
|
|
- material: undefined// 主材料
|
|
|
|
- }
|
|
|
|
- this.productType = []
|
|
|
|
- this.$refs.table.refresh(true)
|
|
|
|
- },
|
|
|
|
- // 导出
|
|
|
|
- handleExport () {
|
|
|
|
- const _this = this
|
|
|
|
- const params = this.queryParam
|
|
|
|
- _this.spinning = true
|
|
|
|
- _this.exportLoading = true
|
|
|
|
- _this.showExport = true
|
|
|
|
- hdExportExcel(foreignProductListExport, params, '外贸产品', function () {
|
|
|
|
- _this.spinning = false
|
|
|
|
- _this.exportLoading = false
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- // 产品分类 change
|
|
|
|
- changeProductType (val, opt) {
|
|
|
|
- this.queryParam.productTypeSn1 = val[0] ? val[0] : undefined
|
|
|
|
- this.queryParam.productTypeSn2 = val[1] ? val[1] : undefined
|
|
|
|
- this.queryParam.productTypeSn3 = val[2] ? val[2] : undefined
|
|
|
|
- },
|
|
|
|
- pageInit () {
|
|
|
|
- const _this = this
|
|
|
|
- this.$nextTick(() => { // 页面渲染完成后的回调
|
|
|
|
- _this.setTableH()
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- setTableH () {
|
|
|
|
- const tableSearchH = this.$refs.tableSearch.offsetHeight
|
|
|
|
- this.tableHeight = window.innerHeight - tableSearchH - 205
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- watch: {
|
|
|
|
- advanced (newValue, oldValue) {
|
|
|
|
- const _this = this
|
|
|
|
- this.$nextTick(() => { // 页面渲染完成后的回调
|
|
|
|
- _this.setTableH()
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- '$store.state.app.winHeight' (newValue, oldValue) { // 窗口变更时,需同时更改表格高度
|
|
|
|
- this.setTableH()
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- mounted () {
|
|
|
|
- if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
|
|
|
|
- this.pageInit()
|
|
|
|
- this.resetSearchForm()
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- activated () {
|
|
|
|
- // 如果是新页签打开,则重置当前页面
|
|
|
|
- if (this.$store.state.app.isNewTab) {
|
|
|
|
- this.pageInit()
|
|
|
|
- this.resetSearchForm()
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- beforeRouteEnter (to, from, next) {
|
|
|
|
- next(vm => {
|
|
|
|
- vm.pageFromInfo = from
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-</script>
|
|
|