<template>
|
<div ref="container" class="page-list-container">
|
<!--数据Table-->
|
<yrt-data-list :ref="dataListRef" :editor-ref="editorRef" :data-options="dataOptions" :fields.sync="dataListOptions.fields" :buttons="dataListOptions.buttons" :button-click="buttonClick" :data-list-selections.sync="dataListSelections" :auth-nodes="authNodes">
|
<template slot="common-column-slot" slot-scope="{row, col}">
|
<template v-if="col.prop==dataOptions.linkColumn">
|
<el-link type="primary" @click.native="()=>{linkEditor(row[dataOptions.idField], row);}">
|
<template v-if="['date', 'datetime'].indexOf(col.dataType)>=0 && col.formatter">
|
{{ common.formatDate(row[col.prop], col.formatter) }}
|
</template>
|
<template v-else-if="['byte', 'int32', 'int64', 'decimal', 'double'].indexOf(col.dataType)>=0 && col.formatter">
|
{{ common.formatNumber(row[col.prop], col.formatter) }}
|
</template>
|
<template v-else>
|
{{ row[col.prop] }}
|
</template>
|
</el-link>
|
</template>
|
<!--复核状态-->
|
<template v-else-if="['voucherStatus','exchangeStatus'].indexOf(col.prop)>=0">
|
<template>
|
<el-tag v-if="['未兑换','新建'].indexOf(row[col.prop])>=0" color="#ffff33" style="color:black;border:0">
|
{{ row[col.prop] }}
|
</el-tag>
|
<el-tag v-else-if="row[col.prop]=='已兑换'" color="#00cc00" style="color:white;border:0">
|
{{ row[col.prop] }}
|
</el-tag>
|
<el-tag v-else-if="row[col.prop]=='已过期'" color="#ff6666" style="color:white;border:0">
|
{{ row[col.prop] }}
|
</el-tag>
|
<span v-else>
|
{{ row[col.prop] }}
|
</span>
|
</template>
|
</template>
|
<template v-else-if="col.dropdown_Id>0">
|
{{ $refs[dataListRef].translateText(col.prop, row[col.prop], col.dropdown_Id) }}
|
</template>
|
<template v-else>
|
<template v-if="['date', 'datetime'].indexOf(col.dataType)>=0 && col.formatter">
|
{{ common.formatDate(row[col.prop], col.formatter) }}
|
</template>
|
<template v-else-if="['byte', 'int32', 'int64', 'decimal', 'double'].indexOf(col.dataType)>=0 && col.formatter">
|
{{ common.formatNumber(row[col.prop], col.formatter) }}
|
</template>
|
<template v-else>
|
{{ row[col.prop] }}
|
</template>
|
</template>
|
</template>
|
</yrt-data-list>
|
|
<!--数据编辑器Editor-->
|
<yrt-editor :ref="editorRef" :data-list-ref="dataListRef" v-bind="editorOptions" :data-options="dataOptions" :action.sync="editorOptions.action" :visible.sync="editorOptions.config.visible" :detail-button-click="detailButtonClick" :auth-nodes="authNodes" :default-value="defaultValue" @on-edit-load-after="onEditLoadAfter"></yrt-editor>
|
|
<!--确认兑换对话框-->
|
<el-dialog :visible.sync="dialogVisible" title="确认兑换" width="30%">
|
<el-form ref="form" :model="formData" label-width="100px">
|
<el-form-item label="出货仓库" required>
|
<el-select v-model="formData.storage_Id" placeholder="请选择" class="w-300">
|
<el-option v-for="item in storageNames" :key="item.storage_Id" :label="item.storageName" :value="item.storage_Id" @click.native="formData.storageName=item.storageName">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="兑换人" required>
|
<el-input v-model="formData.exchangeUser" class="w-300"></el-input>
|
</el-form-item>
|
<el-form-item label="兑换手机" required>
|
<el-input v-model="formData.mobile" class="w-300"></el-input>
|
</el-form-item>
|
</el-form>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
<el-button type="primary" @click="exhange">确 定</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import baseLayout from "@/components/common/base-layout.vue";
|
|
export default {
|
name: "sys",
|
components: {},
|
mixins: [baseLayout],
|
data() {
|
return {
|
// 仓库下拉框
|
storageNames: [],
|
// 显示对话框
|
dialogVisible: false,
|
// 对话框表单数据
|
formData: {
|
exchangeUser: null,
|
mobile: null,
|
storage_Id: null
|
},
|
// 编辑新建时表单默认值
|
defaultValue: {
|
voucherStatus: "新建"
|
}
|
};
|
},
|
mounted() {
|
this.getStorageList();
|
},
|
methods: {
|
// 列表页面按钮点击事件
|
buttonClick(authNode) {
|
switch (authNode) {
|
case "exhange":
|
// 确认兑换对话框
|
this.showExchangeDialog();
|
return true;
|
}
|
},
|
// 获取仓库
|
getStorageList() {
|
const url = "/api/basicInfo/base/storage/getList";
|
const params = {
|
};
|
var callback = res => {
|
if (res.result) {
|
this.storageNames = res.data;
|
}
|
};
|
this.common.ajax(url, params, callback);
|
},
|
// 显示对话框
|
showExchangeDialog() {
|
var rows = this.dataListSelections;
|
if (!rows.length) {
|
this.$message.error("至少选择一项！");
|
return;
|
}
|
for (const row of rows) {
|
if (row.voucherStatus !== "新建") {
|
this.$message.error(row.voucherCode + "状态为新建，才允许操作");
|
return;
|
}
|
}
|
this.dialogVisible = true;
|
},
|
// 确认兑换
|
exhange() {
|
if (!this.formData.exchangeUser) {
|
this.$message.error("兑换人不能为空！");
|
return;
|
}
|
if (!this.formData.mobile) {
|
this.$message.error("兑换手机不能为空！");
|
return;
|
}
|
if (!this.formData.storage_Id) {
|
this.$message.error("仓库不能为空！");
|
return;
|
}
|
var rows = this.dataListSelections;
|
const ids = rows.map(item => item.voucher_Id);
|
const url = "/api/outbound/voucher/exhange";
|
const params = Object.assign({
|
ids: ids
|
}, this.formData);
|
this.common.ajax(url, params, res => {
|
this.common.showMsg(res);
|
if (res.result) {
|
this.dataList.reload();
|
this.dialogVisible = false;
|
}
|
}, true);
|
},
|
// 数据加载后，设置是否可编辑
|
onEditLoadAfter(formData) {
|
var exchangeStatus = formData.exchangeStatus;
|
if (exchangeStatus === "已兑换") {
|
this.btnReadOnly.save = true;
|
this.editorOptions.config.disabled = true; // 整个对话框不可编辑
|
} else {
|
this.btnReadOnly.save = false;
|
this.editorOptions.config.disabled = false; // 整个对话框可编辑
|
}
|
}
|
|
}
|
};
|
</script>
|
