|
|
<template> <div class="mod-config"> <div> <span @click="favoriteFunction()"> <icon-svg :name="favorite?'xiangqufill':'xiangqu'" class="sl-svg"></icon-svg> </span> </div> <el-button @click="searchList()" type="primary">{{ buttons.search }}</el-button> <el-button @click="saveColumnList()" type="primary" v-show="showDefault">{{ buttons.defaultTable }} </el-button> <el-button @click="userSetting" type="primary">{{ buttons.settingTable }}</el-button> <el-button @click="updateExpDate()" v-if="" type="primary">{{ buttons.updateExp }}</el-button> <el-form label-position="top" style="margin-top: 5px" v-show="searchShow" :inline="true" :model="queryData" @keyup.enter.native="getDataList()"> <el-form-item label="失效日期"> <el-date-picker style="width: 100px" v-model="queryData.startDate" type="date" placeholder="选择日期"> </el-date-picker> - <el-date-picker style="width: 100px" v-model="queryData.endDate" type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" placeholder="选择日期"> </el-date-picker> </el-form-item> <el-form-item label="超期天数"> <el-input style="width: 80px" oninput="value=value.replace(/[^\-\d]/g, '')" v-model="queryData.day1" clearable> </el-input> - <el-input style="width: 80px" oninput="value=value.replace(/[^\-\d]/g, '')" v-model="queryData.day2" clearable> </el-input> </el-form-item> <el-form-item label="卷号"> <el-input v-model="queryData.rollno" clearable> </el-input> </el-form-item> <el-form-item > <span slot="label" style="" @click="getBaseList(5)"><a herf="#">物料编码</a></span> <el-input v-model="queryData.partno" clearable> </el-input> </el-form-item> <el-form-item style="margin-top: 18px"> <el-button @click="getDataList()" type="primary">{{ buttons.search1 }}</el-button> </el-form-item> <el-form-item style="margin-top: 18px" > <el-checkbox label="修改之后刷新" name="type" v-model="getFlag"></el-checkbox> </el-form-item> </el-form> <el-table ref="rawRollInfo" :height="height" :data="dataList" border @selection-change="selectionChangeHandle" v-loading="dataListLoading" style="width: 100%;"> <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column> <el-table-column v-for="(item,index) in columnList" :key="index" :sortable="item.columnSortable" :prop="item.columnProp" :header-align="item.headerAlign" :show-overflow-tooltip="item.showOverflowTooltip" :align="item.align" :fixed="item.fixed" :min-width="item.columnWidth" :label="item.columnLabel"> <template slot-scope="scope"> <span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span> <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span> </template> </el-table-column>
</el-table>
<el-dialog :title="'修改失效日期'" :close-on-click-modal="false" width="200px" :visible.sync="updateExp"> <el-form ref="dataForm" style="margin-left: 15px;margin-top: -5px" label-position="top" label-width="80px"> <el-form-item label="失效日期" prop="expireddate"> <el-date-picker style="width: 150px" value-format="yyyy-MM-dd" v-model="expireddate" placeholder="失效日期"></el-date-picker> </el-form-item>
</el-form> <span slot="footer" class="dialog-footer"> <el-button type="primary" @click="updateExpSubmit()">确定</el-button> <el-button @click="updateExp = false">取消</el-button> </span> </el-dialog> <!-- 设置列 --> <column v-if="visible" ref="column" @refreshData="getTableUserColumn"></column> <Chooselist ref="baseList" @getBaseData="getBaseData"></Chooselist>
</div></template>
<script>import Chooselist from '@/views/modules/common/Chooselist'import { batchUpdateExpireddate,expiryList} from '@/api/crollinfo/crollinfo.js'import column from "../common/column";import search from "../common/search";import { searchSysLanguageParam, searchFunctionButtonList, saveButtonList,} from "@/api/sysLanguage.js"import { saveTableDefaultList, getTableDefaultListLanguage, getTableUserListLanguage, removerDefault, removerUser} from "@/api/table.js"import {userFavoriteList, saveUserFavorite, removeUserFavorite} from '@/api/userFavorite.js'
export default { data() { return { searchVisible: false, getFlag: true, visible: false, updateExp: false, searchShow: false, expireddate: '', addOrUpdateVisible: false, CRollInfo: {}, // table高度
height: 450, userId:this.$store.state.user.name, // 是否收藏
favorite: false, addLanguage: false, functionId: this.$route.meta.menuId, tableId: "105002002ETM", languageCode: this.$i18n.locale, showDefault: false, queryData: { day: '', rollno: '', partno: '', startDate: '', endDate: '' }, queryTable: { functionId: this.$route.meta.menuId, tableId: "105002002ETM", languageCode: this.$i18n.locale }, // 语言词典集合
sysLanguageParams: [], columnList: [ { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "rollno", "columnLabel": "卷号", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 100, "format": null, "sortLv": 10, "status": true, "fixed": true, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "partno", "columnLabel": "物料编号", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 100, "format": null, "sortLv": 11, "status": true, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name,
"tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "partDescription", "columnLabel": "物料描述", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 250, "format": null, "sortLv": 12, "status": true, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name,
"tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "site", "columnLabel": "工厂编号", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 13, "status": true, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "status", "columnLabel": "状态", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 14, "status": true, "fixed": false, "serialNumber": null, "columnType": "number", "align": null }, { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "rollqty", "columnLabel": "卷数量", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 15, "status": true, "fixed": false, "serialNumber": null, "columnType": "number", "align": null }, { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "supplierid", "columnLabel": "供应商编号", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 16, "status": false, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "suppliername", "columnLabel": "供应商名称", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 17, "status": false, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name,
"tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "overdueDays", "columnLabel": "超期天数", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 120, "format": null, "sortLv": 20, "status": true, "fixed": false, "serialNumber": null, "columnType": "date", "align": null }, { "userId": this.$store.state.user.name,
"tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "expireddate", "columnLabel": "失效日期", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 120, "format": null, "sortLv": 21, "status": true, "fixed": false, "serialNumber": null, "columnType": "date", "align": null }, { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "createdby", "columnLabel": "创建人", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 40, "status": true, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "createddate", "columnLabel": "创建时间", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 150, "format": null, "sortLv": 41, "status": true, "fixed": false, "serialNumber": null, "columnType": "date", "align": null }, { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "rolldate", "columnLabel": "卷创建日期", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 120, "format": null, "sortLv": 42, "status": true, "fixed": false, "serialNumber": null, "columnType": "date", "align": null }, { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "manufacturedate", "columnLabel": "制造日期", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 120, "format": null, "sortLv": 43, "status": true, "fixed": false, "serialNumber": null, "columnType": "string", "align": null },
{ "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "warehouseid", "columnLabel": "仓库编号", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 18, "status": false, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name,
"tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "orderref1", "columnLabel": "关联单号1", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 31, "status": false, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name,
"tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "orderref2", "columnLabel": "关联单号2", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 32, "status": false, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "orderref3", "columnLabel": "关联单号3", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 33, "status": false, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "orderref4", "columnLabel": "关联单号4", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 34, "status": false, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name,
"tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "orderref5", "columnLabel": "关联单号5", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 35, "status": false, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, { "userId": this.$store.state.user.name, "tableId": "105002002ETM", "tableName": "有效期管理", "columnProp": "remark", "columnLabel": "备注", "columnHidden": false, "columnImage": false, "columnSortable": false, "columnWidth": 80, "format": null, "sortLv": 99, "status": false, "fixed": false, "serialNumber": null, "columnType": "string", "align": null }, ], dataList: [], selectList: [], buttonList: [], buttons: { add: '添加', edit: '编辑', delete: '删除', deleteList: '批量删除', cz: '操作', search: '搜索', search1: '查询', download: '导出', settingTable: '设置列表', defaultTable: '设置默认配置', updateExp: '修改失效日期' }, dataListLoading: false, dataListSelections: [], pagination: { page: 1, pageSize: 200, total: 0, }, totalPage: 5, countTotal: 200, } }, components: { column, search, Chooselist }, mounted() { this.$nextTick(() => { this.height = window.innerHeight - 180; this.lazyLoading() })
}, activated() { // this.getDataList()
}, methods: { // 获取基础数据列表
getBaseList(val1){ this.tagNo = val1 this.$nextTick(() => { let strVal = ''; if (this.queryData.partno){ strVal = this.queryData.partno } this.$refs.baseList.init(val1,strVal) }) }, getBaseData(val){ this.queryData.partno = val.PartNo }, // 打开搜索页面
searchList() { if (this.searchShow) { this.searchShow = false return } else { this.searchShow = true } }, lazyLoading() { let dom = document.querySelector(".el-table__body-wrapper"); dom.addEventListener("scroll", (v) => { const scrollDistance = dom.scrollHeight - dom.scrollTop - dom.clientHeight; // console.log("鼠标滑动-scrollDistance", scrollDistance)
// if (scrollDistance <= 0) { //分辨率问题,如果设置 100% ,滑倒最底部,scrollDistance的值 可能为 0.201 到 -0.201
if (scrollDistance <= 1) { //等于0证明已经到底,可以请求接口
if (this.pagination.page >= this.totalPage) { //判断是否到达底部
// this.$message.warning("我~是有底线的 (~ ̄▽ ̄)~");
//console.log("我~是有底线的 (~ ̄▽ ̄)~")
} if (this.pagination.page < this.totalPage) { //当前页数小于总页数就请求
this.pagination.page++; //当前页数自增
//console.log("页面已经到达底部,可以请求接口,请求第 " + this.pagination.page + " 页数据");
this.pagination.pageSize = this.countTotal; this.getDataListAdd() } } }); }, // 获取数据列表
getDataList() { this.dataListLoading = true let query = { parttypeFlag: 'F', toexpiredays: this.queryData.day, rollno: this.queryData.rollno, partno: this.queryData.partno, startDate: this.queryData.startDate, endDate: this.queryData.endDate, day1: this.queryData.day1, day2: this.queryData.day2, limit: 200, page: 1 } expiryList(query).then(({data}) => { if (data && data.code === 0) { this.dataList = data.page.list this.totalPage = data.page.totalPage // this.countTotal = data.page.totalCount
this.pagination.page = data.page.currPage this.pagination.total = data.page.totalCount } this.dataListLoading = false }) // this.searchShow = false
}, // 滚动获取数据
getDataListAdd() { this.dataListLoading = true let query = { parttypeFlag: 'F', toexpiredays: this.queryData.day, rollno: this.queryData.rollno, partno: this.queryData.partno, limit: this.pagination.pageSize, startDate: this.queryData.startDate, endDate: this.queryData.endDate, page: this.pagination.page } expiryList(query).then(({data}) => { if (data && data.code === 0) { let voList = data.page.list this.dataList.push(...voList) } this.dataListLoading = false }) // this.searchShow = false
}, selectionChangeHandle(val){ this.selectList = val }, // 修改失效日期
updateExpDate() { let rollInfoList = this.selectList.map(item => { let rollInfo = { site: item.site, rollno: item.rollno, expireddate: this.expireddate } return rollInfo; }) if (rollInfoList.length==0){ this.$message.warning("请选择卷") return } this.updateExp = true }, // 表单提交
updateExpSubmit() { let rollInfoList = this.selectList.map(item => { let rollInfo = { site: item.site, rollno: item.rollno, expireddate: this.expireddate } return rollInfo; })
batchUpdateExpireddate(rollInfoList).then(({data}) => { if (data && data.code === 0) { this.$message.success('操作成功') this.updateExp = false this.expireddate = '' if (this.getFlag){ this.getDataList() } } else { this.$message.error(data.msg) } }) }, // 修改信息
update(val) { this.CRollInfo = val if (this.CRollInfo.expireDateControlFlag != 'Y') return this.$message.info('该物料未设置有效期'); this.addOrUpdateVisible = true this.$nextTick(() => { this.$refs.addOrUpdate.init(this.CRollInfo.rollno, this.CRollInfo.site) }) }, // 校验用户是否收藏
favoriteIsOk() { let userFavorite = { userId: this.$store.state.user.id, languageCode: this.$i18n.locale } userFavoriteList(userFavorite).then(({data}) => { let size = data.list.filter(item => item.menuId == this.$route.meta.menuId).length; if (size > 0) { this.favorite = true } else { this.favorite = false } }) }, // 收藏 OR 取消收藏
favoriteFunction() { let userFavorite = { userId: this.$store.state.user.id, functionId: this.$route.meta.menuId, } if (this.favorite) { // 取消收藏
this.$confirm(`确定取消收藏`, '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => { removeUserFavorite(userFavorite).then(({data}) => { this.$message.success(data.msg) this.favorite = false }) }) } else { // 收藏
saveUserFavorite(userFavorite).then(({data}) => { this.$message.success(data.msg) this.favorite = true }) }
}, // 获取button的词典
getFunctionButtonList() { let queryButton = { functionId: this.functionId, tableId: this.tableId, languageCode: this.languageCode, objectType: 'button' } searchFunctionButtonList(queryButton).then(({data}) => { if (data.data.length > 0) { this.buttons = data.data } }) }, // 获取语言词典
getSysLanguageParamList() { let querySysLanguageParam = { languageCode: this.$i18n.locale } searchSysLanguageParam(querySysLanguageParam).then(({data}) => { this.sysLanguageParams = data.rows }) }, // 打开页面设置
userSetting() { this.visible = true; let queryTable = { userId: this.userId, functionId: this.functionId, tableId: this.tableId, languageCode: this.languageCode } this.$nextTick(() => { this.$refs.column.init(queryTable); }); }, // 获取 用户保存的 格式列
getTableUserColumn() { let queryTableUser = { userId: this.userId, functionId: this.functionId, tableId: this.tableId, languageCode: this.languageCode, objectType: 'table', status: true, } getTableUserListLanguage(queryTableUser).then(({data}) => { if (data.rows.length > 0) { //this.columnList = []
this.columnList = data.rows } else { this.getColumnList() }
}) }, // 保存 默认配置 列
async saveColumnList() { // 删除所有的该页面下保存的数据
//删除 user自定义的数据
await removerUser(this.queryTable)
// 删除默认配置
await removerDefault(this.queryTable) // 保存页面 table属性
let sumColumnList = this.columnList; sumColumnList = sumColumnList.map(item => { return item = { tableId: item.tableId, tableName: item.tableName, columnProp: item.columnProp, columnLabel: item.columnLabel, columnHidden: false, columnImage: false, columnSortable: false, columnWidth: item.columnWidth, format: item.format, functionId: this.$route.meta.menuId, sortLv: item.sortLv, status: true, fixed: item.fixed, serialNumber: item.serialNumber, columnType: item.columnType, align: item.align } })
await saveTableDefaultList(sumColumnList) // 保存页面 button label title 属性
let buttons = this.buttonList.map(item => { return item = { functionId: this.$route.meta.menuId, languageValue: item.languageValue, objectId: item.objectId, objectType: item.objectType, tableId: item.tableId } }) await saveButtonList(buttons) this.getFunctionButtonList() this.getColumnList() }, // 获取 tableDefault 列
getColumnList() { let queryTable = { functionId: this.functionId, tableId: this.tableId, languageCode: this.languageCode } getTableDefaultListLanguage(queryTable).then(({data}) => { if (!data.rows.length == 0) { // this.showDefault = false
this.columnList = data.rows } else { // this.showDefault = true
} }) }, }, created() { //this.getTableUserColumn()
this.getSysLanguageParamList() this.getFunctionButtonList() this.favoriteIsOk() }}</script><style scoped>.sl-svg { overflow: hidden; float: right;}</style>
|