|
|
@@ -0,0 +1,209 @@
|
|
|
+<template>
|
|
|
+ <div v-loading="loading">
|
|
|
+ <div class="white-box">
|
|
|
+ <div class="filter-box">
|
|
|
+ <filter-user :filter-types="filterTypes" @select-value="handleFilterUser"></filter-user>
|
|
|
+ </div>
|
|
|
+ <el-table class="table-box" ref="multipleTable" :data="tableData" stripe style="width: 100%;" :height="tool.getTableHeight()">
|
|
|
+ <el-table-column v-for="(tableHeader, key) in tableHeaders" :key="key" :label="tableHeader.header" :width="tableHeader.other.width ? tableHeader.other.width : ''" :prop="tableHeader.other.prop ? tableHeader.other.prop : null">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <template v-if="scope.row[tableHeader.index].other.tag" >
|
|
|
+ <el-tag :type="scope.row[tableHeader.index].other.tag.type ? scope.row[tableHeader.index].other.tag.type : null" :size="scope.row[tableHeader.index].other.tag.size ? scope.row[tableHeader.index].other.tag.size : null">{{scope.row[tableHeader.index].value}}</el-tag>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <div v-html="scope.row[tableHeader.index].value"></div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div class="white-box-footer">
|
|
|
+ <el-button type="primary" size="small" @click="visible = true" v-show="permission.hasPermission(`shop/order-adjust-period`)">{{ $t('menu.shopOrderPeriodAdjust') }}</el-button>
|
|
|
+ <pagination :total="totalCount" :page_size="pageSize" @size-change="handleSizeChange" @current-change="handleCurrentChange"></pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-dialog :title="$t('menu.shopOrderPeriodAdjust')" :visible.sync="visible" :width="screenWidth" style="margin-top: -80px">
|
|
|
+ <el-form ref="form" :model="form" label-width="150px" :label-position="labelPosition">
|
|
|
+ <el-form-item :label="$t('shop.orderNumber')" required clearable>
|
|
|
+ <el-input v-model.trim="form.orderSn" @change="handleOrderSnChange"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('member.memberCode')" v-show="order.USER_NAME">
|
|
|
+ <el-input v-model="order.USER_NAME" disabled></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('shop.orderType')" v-show="order.ORDER_TYPE">
|
|
|
+ <el-input v-model="order.ORDER_TYPE" disabled></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="PV" v-show="order.PV">
|
|
|
+ <el-input v-model="order.PV" disabled></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('shop.orderAmount')" v-show="order.PAY_AMOUNT">
|
|
|
+ <el-input v-model="order.PAY_AMOUNT" disabled></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('Administrator.creatUser')" v-show="order.CREATE_USER">
|
|
|
+ <el-input v-model="order.CREATE_USER" disabled></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('bonus.periodNo')" v-show="order.PERIOD_NUM">
|
|
|
+ <el-input v-model="order.PERIOD_NUM" disabled></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('shop.afterAdjustmentPcNo')" required>
|
|
|
+ <el-select v-model="form.modernPeriod" :placeholder="$t('shop.pleaseSelectPcNo')" style="width: 100%;">
|
|
|
+ <el-option v-for="item in availablePeriod" :key="item.PERIOD_NUM" :label="item.PERIOD_NUM" :value="item.PERIOD_NUM" :disabled="item.disabled"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" @click="onSubmit" :loading="submitButtonStat">{{ $t('common.confirm') }}</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import tool from '@/utils/tool'
|
|
|
+ import FilterUser from '@/components/FilterUser'
|
|
|
+ import permission from '@/utils/permission'
|
|
|
+ import Pagination from '@/components/Pagination'
|
|
|
+ import filterHelper from '@/utils/filterHelper'
|
|
|
+ import {orderPeriodAdjustList, orderDetail, orderPeriodAdjust} from '@/api/shop'
|
|
|
+ import {getScreenWidth} from "@/utils";
|
|
|
+
|
|
|
+ export default {
|
|
|
+ name: 'shop_order-period-adjust',
|
|
|
+ components: {FilterUser, Pagination},
|
|
|
+ mounted () {
|
|
|
+ this.getData()
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ tableHeaders: null,
|
|
|
+ tableData: null,
|
|
|
+ tableHeight: window.innerHeight - 310,
|
|
|
+ loading: true,
|
|
|
+ currentPage: 1,
|
|
|
+ totalPages: 1,
|
|
|
+ totalCount: 1,
|
|
|
+ pageSize: 20,
|
|
|
+ tool: tool,
|
|
|
+ permission: permission,
|
|
|
+ filterTypes: null,
|
|
|
+ filterModel: {},
|
|
|
+ submitButtonStat: false,
|
|
|
+ visible: false,
|
|
|
+ form: {
|
|
|
+ orderSn: '',
|
|
|
+ modernPeriod: '',
|
|
|
+ },
|
|
|
+ order: {},
|
|
|
+ availablePeriod: null,
|
|
|
+ screenWidth: getScreenWidth() > 500 ? '500px' : getScreenWidth() + 'px',
|
|
|
+ labelPosition: getScreenWidth() >= 500 ? 'right' : 'top',
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ handleCurrentChange(page) {
|
|
|
+ this.getData(page, this.pageSize)
|
|
|
+ },
|
|
|
+ handleSizeChange(pageSize) {
|
|
|
+ this.getData(this.currentPage, pageSize)
|
|
|
+ },
|
|
|
+ handleFilterUser(filterData) {
|
|
|
+ filterHelper.handleFilterUser(this, filterData)
|
|
|
+ },
|
|
|
+ getData(page, pageSize) {
|
|
|
+ let filterData = this.filterModel
|
|
|
+ let vueObj=this
|
|
|
+ const paramsData = Object.assign({
|
|
|
+ page: (page === null || page == undefined) ? 1 : page,
|
|
|
+ pageSize: (pageSize === null || pageSize == undefined) ? vueObj.pageSize : pageSize
|
|
|
+ }, filterData)
|
|
|
+ orderPeriodAdjustList(paramsData).then( response => {
|
|
|
+ vueObj.tableHeaders = response.data.columnsShow ? response.data.columnsShow : []
|
|
|
+ vueObj.tableData = response.data.list
|
|
|
+ vueObj.filterTypes = response.data.filterTypes
|
|
|
+ vueObj.currentPage = page
|
|
|
+ vueObj.totalPages = parseInt(response.data.totalPages)
|
|
|
+ vueObj.totalCount = parseInt(response.data.totalCount)
|
|
|
+ vueObj.pageSize = pageSize
|
|
|
+ this.loading = false
|
|
|
+ }).catch( err => {
|
|
|
+ this.loading = false
|
|
|
+ this.$message({
|
|
|
+ message: err,
|
|
|
+ type: 'error'
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleOrderSnChange() {
|
|
|
+ if (this.form.orderSn) {
|
|
|
+ this.submitButtonStat = true
|
|
|
+
|
|
|
+ let getData = {
|
|
|
+ orderSn: this.form.orderSn
|
|
|
+ }
|
|
|
+ orderDetail(getData).then( response => {
|
|
|
+ this.order = response.data.order
|
|
|
+ this.availablePeriod = response.data.availablePeriod
|
|
|
+ if (response.data.availablePeriod && response.data.availablePeriod[0]) {
|
|
|
+ for (let period of response.data.availablePeriod) {
|
|
|
+ if (!period['disabled']) {
|
|
|
+ this.form.modernPeriod = period['PERIOD_NUM']
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.submitButtonStat = false
|
|
|
+ }).catch( error => {
|
|
|
+ this.$message({
|
|
|
+ message: error,
|
|
|
+ type: 'error'
|
|
|
+ })
|
|
|
+ this.submitButtonStat = false
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onSubmit() {
|
|
|
+ this.$confirm(this.$t('shop.modifyOrderPcNoHits'), this.$t('common.hint'), {
|
|
|
+ confirmButtonText: this.$t('common.confirm'),
|
|
|
+ cancelButtonText: this.$t('common.cancel'),
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this._handleSubmit()
|
|
|
+ }).catch(error => {
|
|
|
+ this.$message({
|
|
|
+ message: error,
|
|
|
+ type: 'error'
|
|
|
+ })
|
|
|
+ this.submitButtonStat = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ _handleSubmit() {
|
|
|
+ this.submitButtonStat = true
|
|
|
+ let paramsData = this.form
|
|
|
+ orderPeriodAdjust(paramsData).then( res => {
|
|
|
+ this.$message({
|
|
|
+ message: res.data,
|
|
|
+ type: 'success'
|
|
|
+ })
|
|
|
+ this.submitButtonStat = false
|
|
|
+ this._clearData()
|
|
|
+ }).catch( error => {
|
|
|
+ this.$message({
|
|
|
+ message: error,
|
|
|
+ type: 'error'
|
|
|
+ })
|
|
|
+ this.submitButtonStat = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ _clearData(){
|
|
|
+ this.form = {}
|
|
|
+ this.order = {}
|
|
|
+ this.visible = false
|
|
|
+ this.getData()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+
|
|
|
+</style>
|
tyler