emis-frontend/src/views/emis/emisGoods/index.vue
2024-08-18 21:49:24 +08:00

454 lines
19 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<XdPageContainer class="app-container">
<SearchForm slot="pageHeader" :model="queryParams" ref="queryForm" size="small" :maxShow="3" label-width="68px" v-show="showSearch" @search="handleQuery" @reset="resetQuery">
<el-form-item label="" prop="goodsSn">
<el-input
v-model="queryParams.goodsSn"
:placeholder="$t('货物编号')"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="goodsName">
<el-input
v-model="queryParams.goodsName"
:placeholder="$t('货物名称')"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="goodsNameEn">
<el-input
v-model="queryParams.goodsNameEn"
:placeholder="$t('英文名称')"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
</SearchForm>
<XdTable
slot="pageContent"
slot-scope="slotProps"
:height="(slotProps.contentHeight)+'px'"
v-loading="loading"
border
size="small"
:data="emisGoodsList"
:showSearch.sync="showSearch"
:queryParams="queryParams"
:total="total"
@queryTable="getList"
@selection-change="handleSelectionChange"
@sort-change="handleSortChange"
>
<div slot="toolbar">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['emis:emisGoods:add']"
>新增</el-button>
</el-col>
<!--
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['emis:emisGoods:edit']"
>修改</el-button>
</el-col> -->
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['emis:emisGoods:remove']"
>删除</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['emis:emisGoods:export']"
>导出</el-button>
</el-col> -->
</el-row>
</div>
<el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column :label="$t('货号')" align="center" prop="goodsSn" width="80" >
<template slot-scope="scope">
<div class="link-type" @click="handleUpdate(scope.row)">{{scope.row.goodsSn}}</div>
</template>
</el-table-column> -->
<el-table-column :label="$t('货物名称')" align="left" prop="goodsName" width="120" >
<template slot-scope="scope">
<div class="link-type" @click="handleUpdate(scope.row)">{{scope.row.goodsName}}</div>
</template>
</el-table-column>
<el-table-column :label="$t('英文名称')" align="left" prop="goodsNameEn" min-width="100" />
<el-table-column :label="$t('单价')" align="center" prop="price" width="60" />
<el-table-column :label="$t('净重')" align="center" prop="netWeight" width="60" />
<el-table-column :label="$t('毛重')" align="center" prop="grossWeight" width="60" />
<el-table-column :label="$t('海关编码')" align="center" prop="hsCode" width="100" />
<el-table-column :label="$t('规格')" align="center" prop="goodsModel" width="100" />
<el-table-column :label="$t('排序')" align="center" prop="orderNum" width="80" />
<!--
<el-table-column :label="$t('货物类别')" align="center" prop="goodsCat" min-width="100" />
<el-table-column :label="$t('型号')" align="center" prop="goodsType" min-width="100" />
<el-table-column :label="$t('条码')" align="center" prop="barcode" min-width="100" />
<el-table-column :label="$t('原产国')" align="center" prop="orginalNation" min-width="100" />
<el-table-column :label="$t('图片地址')" align="center" prop="picUrl" min-width="100" />
<el-table-column :label="$t('是否实物')" align="center" prop="isRealGoods" min-width="100" />
<el-table-column :label="$t('是否大类')" align="center" prop="isBigCat" min-width="100" />
<el-table-column :label="$t('品牌名称')" align="center" prop="brand" min-width="100" />
<el-table-column :label="$t('单净重')" align="center" prop="netWeight" min-width="100" />
<el-table-column :label="$t('单毛重')" align="center" prop="grossWeight" min-width="100" />
<el-table-column :label="$t('单件体积')" align="center" prop="singleVolume" min-width="100" />
<el-table-column :label="$t('单件长')" align="center" prop="singleLength" min-width="100" />
<el-table-column :label="$t('单件高')" align="center" prop="singleHeight" min-width="100" />
<el-table-column :label="$t('箱件数')" align="center" prop="pkgPcs" min-width="100" />
<el-table-column :label="$t('箱体积')" align="center" prop="pkgVolume" min-width="100" />
<el-table-column :label="$t('箱长')" align="center" prop="pkgLength" min-width="100" />
<el-table-column :label="$t('箱高')" align="center" prop="pkgHeight" min-width="100" />
<el-table-column :label="$t('商检编号')" align="center" prop="isCode" min-width="100" />
<el-table-column :label="$t('计量单位')" align="center" prop="unit" min-width="100" />
<el-table-column :label="$t('法1')" align="center" prop="unit1" min-width="100" />
<el-table-column :label="$t('法2')" align="center" prop="unit2" min-width="100" />
<el-table-column :label="$t('价格')" align="center" prop="price" min-width="100" />
<el-table-column :label="$t('币种')" align="center" prop="currencyType" min-width="100" />
<el-table-column :label="$t('适用标准国别')" align="center" prop="ruleNation" min-width="100" />
<el-table-column :label="$t('生产企业')" align="center" prop="manufEnterprise" min-width="100" />
<el-table-column :label="$t('电商企业海关编码')" align="center" prop="ebcCode" min-width="100" />
<el-table-column :label="$t('电商企业商检编码')" align="center" prop="ciqCode" min-width="100" />
<el-table-column :label="$t('功能')" align="center" prop="function" min-width="100" />
<el-table-column :label="$t('主要成分')" align="center" prop="ingredients" min-width="100" />
<el-table-column :label="$t('用途')" align="center" prop="purpose" min-width="100" />
<el-table-column :label="$t('进口模式')" align="center" prop="cebpMode" min-width="100" />
<el-table-column :label="$t('供应商')" align="center" prop="supplier" min-width="100" />
<el-table-column :label="$t('申报序列号')" align="center" prop="serialNumber" min-width="100" />
<el-table-column :label="$t('状态')" align="center" prop="status" min-width="100" />
<el-table-column :label="$t('海关回执信息')" align="center" prop="statusMessage" min-width="100" />
<el-table-column :label="$t('原货物备件号')" align="center" prop="goodsSn2" min-width="100" />
<el-table-column :label="$t('物资序号')" align="center" prop="goodsNo2" min-width="100" />
<el-table-column :label="$t('许可证号')" align="center" prop="licNo" min-width="100" />
<el-table-column :label="$t('材料地址')" align="center" prop="materialPath" min-width="100" />
<el-table-column :label="$t('出厂日期')" align="center" prop="pd" min-width="100" />
<el-table-column :label="$t('销售链接地址')" align="center" prop="saleUrl" min-width="100" />
<el-table-column :label="$t('口岸编码')" align="center" prop="portCode" min-width="100" />
<el-table-column :label="$t('备注')" align="center" prop="remark" min-width="100" />
<el-table-column :label="$t('删除标志(0代表存在')" align="center" prop="delFlag" min-width="100" /> -->
<el-table-column label="创建人" align="center" prop="createByName" width="80" :show-overflow-tooltip="true"/>
<el-table-column label="创建网点" align="center" prop="createSiteName" width="80" :show-overflow-tooltip="true"/>
<el-table-column label="创建时间" align="center" prop="createTime" width="170"/>
<el-table-column label="修改人" align="center" prop="updateByName" width="80" :show-overflow-tooltip="true"/>
<el-table-column label="修改网点" align="center" prop="updateSiteName" width="80" :show-overflow-tooltip="true"/>
<el-table-column label="修改时间" align="center" prop="updateTime" width="170"/>
<el-table-column :label="$t('操作')" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['emis:emisGoods:edit']"
>修改</el-button>
<!--
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['emis:emisGoods:remove']"
>删除</el-button> -->
</template>
</el-table-column>
</XdTable>
<el-dialog :title="titleForm" :visible.sync="openForm" width="50%" :destroy-on-close="true" v-dialogDrag append-to-body>
<emisGoodsForm :id="currentId" @on-changed="handleFormChanged" @on-cancel="cancelForm"></EmisGoodsForm>
</el-dialog>
</XdPageContainer>
</template>
<script>
import { listEmisGoods, getEmisGoods, delEmisGoods, addEmisGoods, updateEmisGoods } from "@/api/emis/emisGoods";
import elDateSimplePicker from '@/components/DatePickerAdv/elDateSimplePicker';
// import emisGoodsView from '@/views/emis/emisGoods/emisGoodsView';
import emisGoodsForm from '@/views/emis/emisGoods/emisGoodsForm';
export default {
name: "EmisGoods",
components: { elDateSimplePicker,emisGoodsForm },
dicts: [
'sys_normal_disable',
],
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 创建时间搜索
dateTimeRange:[],
// 总条数
total: 0,
// 货物信息表格数据
emisGoodsList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
openForm: false,
titleForm: "",
// 弹出展示层
currentId:null,
id:null,
titleView:"",
openView: false,
// 更新时间时间范围
daterangeCreateTime: [],
// 更新时间时间范围
daterangeUpdateTime: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 20,
goodsSn: null,
goodsName: null,
goodsNameEn: null,
goodsCat: null,
goodsType: null,
goodsModel: null,
barcode: null,
orginalNation: null,
picUrl: null,
isRealGoods: null,
isBigCat: null,
brand: null,
netWeight: null,
grossWeight: null,
singleVolume: null,
singleLength: null,
singleHeight: null,
pkgPcs: null,
pkgVolume: null,
pkgLength: null,
pkgHeight: null,
hsCode: null,
isCode: null,
unit: null,
unit1: null,
unit2: null,
price: null,
currencyType: null,
ruleNation: null,
manufEnterprise: null,
ebcCode: null,
ciqCode: null,
function: null,
ingredients: null,
purpose: null,
cebpMode: null,
supplier: null,
serialNumber: null,
status: null,
statusMessage: null,
goodsSn2: null,
goodsNo2: null,
licNo: null,
materialPath: null,
pd: null,
saleUrl: null,
portCode: null,
remark: null,
delFlag: null,
},
};
},
created() {
this.getList();
},
methods: {
/** 查询货物信息列表 */
getList() {
this.loading = true;
this.queryParams.params = {};
if (null != this.daterangeCreateTime && '' != this.daterangeCreateTime) {
this.queryParams.params["beginCreateTime"] = this.daterangeCreateTime[0];
this.queryParams.params["endCreateTime"] = this.daterangeCreateTime[1];
}
if (null != this.daterangeUpdateTime && '' != this.daterangeUpdateTime) {
this.queryParams.params["beginUpdateTime"] = this.daterangeUpdateTime[0];
this.queryParams.params["endUpdateTime"] = this.daterangeUpdateTime[1];
}
listEmisGoods(this.addDateRange(this.queryParams, this.dateTimeRange)).then(response => {
this.emisGoodsList = response.rows;
this.total = response.total;
this.loading = false;
});
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
// 排序 查询字段是表格中字段名字 动态取值排序顺序
handleSortChange(column) {
this.queryParams.orderByColumn = column.prop;
this.queryParams.isAsc = column.order;
this.getList();
},
/** 新增按钮操作 */
handleAdd(row) {
this.currentId=null;
this.openForm= true;
this.titleForm = "新增";
},
handleShowMoreInput(){
this.moreInputVisible = !this.moreInputVisible;
},
/** 修改按钮操作 */
handleUpdate(row) {
this.currentId= row.id;
this.openForm = true;
this.titleForm = "修改";
},
handleView(row) {
this.id=row.id;
this.titleView="查看";
this.openView=true;
// this.router.push({ path: '/emis/emisGoods/viewDetail', query: { id: row.id }})
},
handleFormChanged(){
this.openForm = false;
this.getList();
},
cancelForm(){
this.openForm = false;
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal.confirm('是否确认删除').then(function() {
return delEmisGoods(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
// this.download('emis/emisGoods/export', {
// ...this.queryParams
// }, `emisGoods_${new Date().getTime()}.xlsx`)
const loadingInstance = this.$loading({
text: '正在导出...'
})
var qParam = {...this.queryParams};
qParam.pageNum=1;
qParam.pageSize=5000;
listEmisGoods(this.addDateRange(qParam, this.dateTimeRange)).then(response => {
this.downloadLoading = false
if (response.code === 200) {
const curList = response.rows
import('@/vendor/Export2Excel').then(excel => {
const tHeader = ['序号','货物编号','货物名称','货物英文名称','货物类别','型号','规格','条码','原产国','图片地址','归属客户','是否实物','是否大类','品牌编号','品牌名称','单净重','单毛重','单件体积','单件长','单件宽','单件高','箱件数','箱体积','箱长','箱宽','箱高','海关编码','商检编号','计量单位','法1','法2','价格','币种','适用标准国别','生产企业','电商企业海关编码','电商企业商检编码','功能','主要成分','用途','产品有效期','进口模式','供应商','申报序列号','状态','海关回执信息','原货物备件号','物资序号','许可证号','材料地址','出厂日期','销售链接地址','口岸编码','备注','租户ID','删除标志(0代表存在','创建者','创建时间','更新者','更新时间',];
const filterVal = ['id','goodsSn','goodsName','goodsNameEn','goodsCat','goodsType','goodsModel','barcode','orginalNation','picUrl','ownerId','isRealGoods','isBigCat','brandId','brand','netWeight','grossWeight','singleVolume','singleLength','singleWidth','singleHeight','pkgPcs','pkgVolume','pkgLength','pkgWidth','pkgHeight','hsCode','isCode','unit','unit1','unit2','price','currencyType','ruleNation','manufEnterprise','ebcCode','ciqCode','function','ingredients','purpose','productValidity','cebpMode','supplier','serialNumber','status','statusMessage','goodsSn2','goodsNo2','licNo','materialPath','pd','saleUrl','portCode','remark','tenantId','delFlag','createBy','createTime','updateBy','updateTime',];
const data = this.formatJson(filterVal, curList, response.rows)
excel.export_json_to_excel({
header: tHeader,
data,
filename: '货物信息',
autoWidth: true
})
loadingInstance.close()
})
}
});
},
formatJson(filterVal, jsonData, resData) {
let index = 0
return jsonData.map(v => filterVal.map(j => {
if (j === 'index') {
return ++index
}
if (j === 'status') {
var statusStr='xxx'
if(v[j] == 10){
statusStr='xxx'
}
return statusStr;
}
return v[j]
}))
},
/** 列索引函数 */
getIndex($index) {
return (this.queryParams.pageNum - 1) * this.queryParams.pageSize + $index + 1
},
/** 时间搜索响应函数 */
dateTimeChange(value){
this.dateTimeRange=value;
},
}
};
</script>
<style scoped>
.el-divider{
margin-top: 0px;
background: 0 0;
border-top: 1px solid #E6EBF5;
}
.el-divider__text {
color: #0955ee;
cursor: pointer;
}
</style>