115 行
4.4 KiB
JavaScript
可执行文件
115 行
4.4 KiB
JavaScript
可执行文件
/**
|
||
* @description 串号修改记录组件
|
||
*/
|
||
Vue.component('component-serial-modify-record', {
|
||
template: `
|
||
<div id="component-serial-modify-record">
|
||
<el-dialog title="串号修改记录" :modal-append-to-body="false" :visible.sync="dialogVisible" @closed="dialogClose">
|
||
<el-table :data="tableData" border style="width: 100%">
|
||
<el-table-column label="序号" width="60">
|
||
<template slot-scope="scope">
|
||
<span>{{scope.$index + 1}}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="add_time" label="修改时间" width="170">
|
||
</el-table-column>
|
||
<el-table-column prop="operator_type" label="修改来源" width="80">
|
||
</el-table-column>
|
||
<el-table-column prop="operator_name" label="修改人">
|
||
</el-table-column>
|
||
<el-table-column align="left" label="原串号" class="serial" width="290">
|
||
<template slot-scope="scope">
|
||
<p><span>主串号：</span>{{scope.row.old_main_serial_number}}</p>
|
||
<p><span>辅助串号1：</span>{{scope.row.old_auxiliary_serial_number_one || '---'}}</p>
|
||
<p><span>辅助串号2：</span>{{scope.row.old_auxiliary_serial_number_two || '---'}}</p>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column align="left" label="新串号" class="serial" width="290">
|
||
<template slot-scope="scope">
|
||
<p><span>主串号：</span>{{scope.row.main_serial_number}}</p>
|
||
<p><span>辅助串号1：</span>{{scope.row.auxiliary_serial_number_one || '---'}}</p>
|
||
<p><span>辅助串号2：</span>{{scope.row.auxiliary_serial_number_two || '---'}}</p>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
<el-pagination
|
||
background
|
||
layout="prev, pager, next"
|
||
:page-size="limit"
|
||
:current-page="page"
|
||
:total="total"
|
||
:hide-on-single-page="true"
|
||
@current-change="currentChange">
|
||
</el-pagination>
|
||
</el-dialog>
|
||
</div>
|
||
`,
|
||
data() {
|
||
return {
|
||
page: 1, //页数
|
||
limit: 6, //每页行数
|
||
total: 0, //数据总数
|
||
tableData: [], //当前页数据
|
||
dialogVisible: false //窗口显示控制
|
||
}
|
||
},
|
||
methods: {
|
||
/**
|
||
* @description 弹出关闭
|
||
*/
|
||
dialogClose() {
|
||
this.page = 1
|
||
this.total = 0
|
||
this.tableData = []
|
||
},
|
||
/**
|
||
* @description 分页组件切换事件
|
||
* @param {Number} currentPage 当前分页数
|
||
*/
|
||
currentChange(currentPage) {
|
||
this.page = currentPage
|
||
this._getTableData()
|
||
},
|
||
/**
|
||
* @description 获取列表数据
|
||
* @private
|
||
*/
|
||
_getTableData() {
|
||
this.sendRequest('Retail/Customer/serialModifyRecord', {
|
||
data: {
|
||
id: this.id,
|
||
page: this.page,
|
||
limit: this.limit
|
||
},
|
||
success: (response) => {
|
||
if (response.status == 1) {
|
||
const data = response.data
|
||
this.tableData = data.list
|
||
this.total = data.count
|
||
} else {
|
||
this.$message.error(response.message)
|
||
}
|
||
}
|
||
})
|
||
}
|
||
},
|
||
watch: {
|
||
/**
|
||
* @description 监听父组件显示控制变量的变化
|
||
*/
|
||
visible() {
|
||
this.dialogVisible = this.visible
|
||
this._getTableData()
|
||
},
|
||
/**
|
||
* @description 监听当前组件的显示控制变量的变化
|
||
*/
|
||
dialogVisible() {
|
||
this.$emit('update:visible', this.dialogVisible)
|
||
}
|
||
},
|
||
props: [
|
||
'visible', //父组件的显示控制
|
||
'id' //修改记录ID
|
||
]
|
||
}) |