<template>
|
<div class="list_main">
|
<SearchCondition
|
:info="formItems"
|
ref="condRef"
|
:conForm="conForm"
|
:isShowDetail="isShowDetail"
|
:screenWidth="screenWidth"
|
@handleOnSeach="handleOnSeach"
|
@handleOnRest="handleOnRest"
|
@handleClick="isShowDetail = !isShowDetail"
|
/>
|
<div />
|
<el-row class="add-button">
|
<el-col :span="24">
|
<el-button
|
type="primary"
|
size="small"
|
icon="el-icon-circle-plus-outline"
|
@click="handleAddPage"
|
class="add-btn"
|
>新增产品</el-button
|
>
|
</el-col>
|
</el-row>
|
<ProTable
|
:pageInfo="pageInfo"
|
@doAction="doAction"
|
@handleCurrentChange="handleCurrentChange"
|
@handleSizeChange="handleSizeChange"
|
:isAutoIndex="true"
|
:list="records"
|
:header="tableHeader"
|
:loading="loading"
|
/>
|
<el-dialog
|
:title="cancelTitle"
|
:visible.sync="cancelDialogVisible"
|
:close-on-click-modal="false"
|
:close-on-press-escape="false"
|
:destroy-on-close="true"
|
width="500"
|
center
|
custom-class="pricing_dialog del_dialog"
|
>
|
<div>{{ cancelDialogContent }}</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="cancelDialogVisible = false">取 消</el-button>
|
<el-button type="primary" @click="handleSure">确 定</el-button>
|
</span>
|
</el-dialog>
|
<el-dialog
|
title="复制产品确认"
|
:visible.sync="copyDialogVisible"
|
:close-on-click-modal="false"
|
:close-on-press-escape="false"
|
:destroy-on-close="true"
|
:show-close="false"
|
width="500"
|
center
|
custom-class="pricing_dialog copy_dialog"
|
>
|
<CreateForms
|
ref="copyPro"
|
v-if="copyDialogVisible"
|
:screenWidth="1280"
|
:formItems="copyFormItems"
|
:defValues="copyDefValues"
|
:formRules="copyFormRules"
|
/>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="copyDialogVisible = false" :disabled="btnLoading"
|
>取 消</el-button
|
>
|
<el-button
|
type="primary"
|
:loading="btnLoading"
|
@click="copyDialogSubmit"
|
>确 定</el-button
|
>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import { PRODUCTLISTITEMS, PRODUCTLISTDEF } from "../utils/condtionConfig";
|
import { PRODUCTMANAGECOLUMN } from "../utils/columnConfig";
|
import { COPYPROFORM } from "../utils/formsConfig";
|
import { COPYPRODEFVALUE } from "../utils/defValueConfig";
|
import { COPYPRORULES } from "../utils/formRulesConfig";
|
import {
|
qryProductListInManager,
|
qryCondition,
|
qryQryProductDetailParams,
|
cancelProductApply,
|
productFlowReset,
|
productChangeApply,
|
productReapply,
|
copyProduct
|
} from "../api/productManage.api";
|
import ProTable from "../components/ProTable.vue";
|
import CreateForms from "../components/CreateForms.vue";
|
import SearchCondition from "../components/SearchCondition.vue";
|
|
export default {
|
data() {
|
return {
|
formItems: [...PRODUCTLISTITEMS],
|
copyFormItems: [...COPYPROFORM],
|
copyDefValues: { ...COPYPRODEFVALUE },
|
copyFormRules: { ...COPYPRORULES },
|
restFormItems: [...PRODUCTLISTITEMS],
|
tableHeader: [...PRODUCTMANAGECOLUMN],
|
conForm: { ...PRODUCTLISTDEF },
|
pageInfo: {
|
currentPage: 1,
|
pageSize: 10,
|
total: 0
|
},
|
records: [],
|
newTypeno: "",
|
screenWidth: document.body.offsetWidth,
|
cancelTitle: "取消申请确认",
|
condtionValue: {}, // 表单value集合
|
isShowDetail: false, // 是否显示所有表单项
|
loading: false,
|
btnLoading: false,
|
copyDialogVisible: false,
|
cancelDialogVisible: false,
|
cancelDialogContent: "",
|
openAddPage: false // 打开新增产品管理页面
|
};
|
},
|
components: {
|
SearchCondition,
|
ProTable,
|
CreateForms
|
},
|
created() {
|
// 当前阶段：phaseNo
|
// 产品类型：ProductCode
|
// 产品状态：EffStatus
|
const opyionItems = [
|
{ name: "currentphasename", code: "phaseNo" },
|
{ name: "producttype", code: "ProductCode" },
|
{ name: "productstatus", code: "EffStatus" }
|
];
|
opyionItems.forEach(item => {
|
this.getCondition(item.name, item.code);
|
});
|
},
|
mounted() {
|
window.addEventListener("resize", this.getScreenWidth);
|
this.$router.afterEach((to, from, next) => {
|
window.scrollTo(0, 0);
|
});
|
this.getProductList();
|
},
|
destroyed() {
|
window.removeEventListener("resize", this.getScreenWidth);
|
},
|
methods: {
|
/**
|
* 获取下拉选择项
|
*/
|
async getCondition(name, conditionName) {
|
const params = { conditionName };
|
const re = await qryCondition(params);
|
if (re.code && re.code === "00") {
|
const options = re.result;
|
this.setOrGetFormInfo(name, { options }, "settingDef");
|
}
|
},
|
getScreenWidth() {
|
this.$set(this, "screenWidth", document.body.offsetWidth);
|
},
|
// 弹框确认事件
|
handleSure() {
|
const clickAll = {
|
取消申请确认: this.cancelProductApply,
|
撤回申请确认: this.recallProductFlow,
|
变更申请确认: this.changeProductApply,
|
重新申请确认: this.reapplyProduct
|
};
|
clickAll[this.cancelTitle]();
|
},
|
// 获取产品列表
|
async getProductList() {
|
const { currentPage, pageSize } = this.pageInfo;
|
const {
|
currentphasename,
|
endEffecttime,
|
endFailuretime,
|
productstatus,
|
producttype,
|
startFailuretime,
|
starteEffecttime,
|
typename,
|
typeno
|
} = this.condtionValue;
|
const loading = this.$loading({
|
lock: true,
|
text: "",
|
background: "hsla(0,0%,100%,.9)"
|
});
|
setTimeout(() => {
|
loading.close();
|
}, 1500);
|
const params = {
|
currentPage,
|
pageSize,
|
currentphaseno: currentphasename,
|
effectTimeSearch: {
|
begintime: starteEffecttime,
|
endtime: endEffecttime
|
},
|
failureTimeSearch: {
|
begintime: startFailuretime,
|
endtime: endFailuretime
|
},
|
productstatus,
|
producttype,
|
typename,
|
typeno
|
};
|
const res = await qryProductListInManager(params);
|
loading.close();
|
if (res.code && res.code === "00") {
|
this.$set(this, "records", res.result && res.result.records);
|
this.$set(this.pageInfo, "total", res.result && res.result.total);
|
}
|
},
|
// 更新表单数据或查找某项数据
|
setOrGetFormInfo(nameKey, newInfo, def) {
|
const { formItems, restFormItems } = this;
|
const index = formItems.findIndex(({ name }) => name === nameKey);
|
let result = {};
|
if (!isNaN(index)) {
|
this.$set(this.formItems, index, { ...formItems[index], ...newInfo });
|
if (def) {
|
this.$set(this.restFormItems, index, {
|
...restFormItems[index],
|
...newInfo
|
});
|
}
|
result = this.formItems[index];
|
}
|
if (typeof newInfo === "undefined") {
|
return result;
|
}
|
},
|
|
// 搜索列表
|
handleOnSeach() {
|
const conRef = this.$refs.condRef;
|
this.$set(this, "condtionValue", conRef.$refs["conform"].model);
|
this.$set(this, "pageInfo", { currentPage: 1, pageSize: 10, total: 0 });
|
this.getProductList();
|
},
|
|
// 获取筛选条件value
|
setValueInfo(condtions) {
|
this.$set(this, "condtionValue", condtions);
|
},
|
|
// 重置
|
handleOnRest(proListForm) {
|
this.$set(this, "condtionValue", {});
|
// this.$set(this, 'pageInfo', { currentPage: 1, pageSize: 10, total: 0 })
|
// this.getProductList()
|
},
|
// 产品复制
|
async copyDialogSubmit() {
|
const copyProForm = this.$refs.copyPro;
|
copyProForm.$refs["createForm"].validate(async valid => {
|
if (valid) {
|
const { newtypeno, typename } = copyProForm.formValues;
|
const params = {
|
newtypeno,
|
oldtypeno: this.newTypeno,
|
typename
|
};
|
this.btnLoading = true;
|
const loading = this.$loading({
|
lock: true,
|
text: "正在复制，请耐心等待！",
|
background: "hsla(0,0%,100%,.9)"
|
});
|
this.cancelDialogVisible = false;
|
setTimeout(() => {
|
loading.close();
|
}, 30000);
|
const copyRes = await copyProduct(params);
|
loading.close();
|
this.copyDialogVisible = false;
|
this.btnLoading = false;
|
if (!copyRes || copyRes.code !== "00") {
|
return false;
|
}
|
this.$router.push({
|
name: "editProduct",
|
query: {
|
type: "edit",
|
serialno: copyRes.result.serialno,
|
objecttype: copyRes.result.objecttype,
|
productid: copyRes.result.typeno
|
}
|
});
|
// this.getProductList()
|
} else {
|
this.$message.error("请输入产品信息！");
|
return false;
|
}
|
});
|
},
|
// 产品变更
|
async changeProductApply() {
|
const params = { typeNo: this.newTypeno };
|
const loading = this.$loading({
|
lock: true,
|
text: "正在变更，请耐心等待！",
|
background: "hsla(0,0%,100%,.9)"
|
});
|
this.cancelDialogVisible = false;
|
setTimeout(() => {
|
loading.close();
|
}, 30000);
|
const changeRes = await productChangeApply(params);
|
loading && loading.close();
|
if (!changeRes || changeRes.code !== "00") {
|
return false;
|
}
|
this.getProductList();
|
this.cancelDialogVisible = false;
|
this.$router.push({
|
name: "editProduct",
|
query: {
|
type: "edit",
|
serialno: changeRes.result.serialno,
|
objecttype: changeRes.result.objecttype,
|
productid: changeRes.result.typeno
|
}
|
});
|
},
|
// 取消申请
|
async cancelProductApply() {
|
const params = { typeno: this.newTypeno };
|
const cancelRes = await cancelProductApply(params);
|
if (!cancelRes || cancelRes.code !== "00") {
|
return false;
|
}
|
this.getProductList();
|
this.cancelDialogVisible = false;
|
},
|
// 重新申请
|
async reapplyProduct() {
|
const params = { typeNo: this.newTypeno };
|
const reapplyRes = await productReapply(params);
|
if (!reapplyRes || reapplyRes.code !== "00") {
|
return false;
|
}
|
this.cancelDialogVisible = false;
|
this.getProductList();
|
this.$router.push({
|
name: "editProduct",
|
query: {
|
type: "edit",
|
serialno: reapplyRes.result.serialno,
|
objecttype: reapplyRes.result.objecttype,
|
productid: reapplyRes.result.typeno
|
}
|
});
|
},
|
// 撤回申请
|
async recallProductFlow() {
|
const params = { typeno: this.newTypeno };
|
const cancelRes = await productFlowReset(params);
|
if (!cancelRes && cancelRes.code !== "00") {
|
return false;
|
}
|
this.getProductList();
|
this.cancelDialogVisible = false;
|
},
|
// 表单事件回调
|
async doAction(name, item, { key, label }) {
|
if (key === "details") {
|
const param = {
|
clicktype: "1",
|
searchtype: "1",
|
serialno: "",
|
typeno: item.typeno
|
};
|
const listPam = await this.qryQryProductDetailParams(param);
|
this.$router.push({
|
name: "productDetail",
|
query: {
|
serialno: listPam.serialno,
|
productid: listPam.typeno,
|
objecttype: listPam.objecttype
|
}
|
});
|
return false;
|
}
|
if (key === "cancel") {
|
this.newTypeno = item.typeno;
|
this.cancelTitle = "取消申请确认";
|
this.cancelDialogVisible = true;
|
const applyType = {
|
"jbo.app.BUSINESS_TYPE": "准入",
|
"jbo.app.BUSINESS_TYPE_CHANGE": "变更"
|
};
|
this.cancelDialogContent = `请确认是否需要取消${item.typeno}${
|
item.typename
|
}的${applyType[item.objecttype]}申请`;
|
return false;
|
}
|
if (key === "withdraw") {
|
this.cancelTitle = "撤回申请确认";
|
this.newTypeno = item.typeno;
|
this.cancelDialogVisible = true;
|
const applyType = {
|
"jbo.app.BUSINESS_TYPE": "准入",
|
"jbo.app.BUSINESS_TYPE_CHANGE": "变更"
|
};
|
this.cancelDialogContent = `请确认是否需要撤回${item.typeno}${
|
item.typename
|
}的${applyType[item.objecttype]}申请`;
|
return false;
|
}
|
if (key === "change") {
|
this.cancelTitle = "变更申请确认";
|
this.newTypeno = item.typeno;
|
this.cancelDialogVisible = true;
|
this.cancelDialogContent = `请确认是否需要变更${item.typeno}${item.typename}的申请`;
|
return false;
|
}
|
if (key === "reset") {
|
this.cancelTitle = "重新申请确认";
|
this.newTypeno = item.typeno;
|
this.cancelDialogVisible = true;
|
const applyType = {
|
"jbo.app.BUSINESS_TYPE": "准入",
|
"jbo.app.BUSINESS_TYPE_CHANGE": "变更"
|
};
|
this.cancelDialogContent = `请确认是否需要重新申请${item.typeno}${
|
item.typename
|
}的${applyType[item.objecttype]}申请`;
|
return false;
|
}
|
if (key === "copy") {
|
this.newTypeno = item.typeno;
|
this.copyDefValues = { ...COPYPRODEFVALUE };
|
this.copyDialogVisible = true;
|
return false;
|
}
|
if (key === "modify") {
|
const param = {
|
clicktype: "0",
|
searchtype: "1",
|
serialno: "",
|
typeno: item.typeno
|
};
|
const listPam = await this.qryQryProductDetailParams(param);
|
this.$router.push({
|
name: "editProduct",
|
query: {
|
type: "edit",
|
serialno: listPam.serialno,
|
objecttype: listPam.objecttype,
|
productid: listPam.typeno
|
}
|
});
|
}
|
},
|
// 获取产品详情参数
|
async qryQryProductDetailParams(param) {
|
const res = await qryQryProductDetailParams(param);
|
if (!res || res.code !== "00") {
|
return "";
|
}
|
return res.result;
|
},
|
// 新增产品管理
|
handleAddPage() {
|
this.$router.push({ name: "NewProduct", query: { isNew: "new" } });
|
},
|
// 修改翻页条数
|
handleSizeChange(val) {
|
this.pageInfo.pageSize = val;
|
this.getProductList();
|
},
|
|
// 修改翻页数
|
handleCurrentChange(val) {
|
this.pageInfo.currentPage = val;
|
this.getProductList();
|
}
|
}
|
};
|
</script>
|
|
<style lang="stylus" scoped>
|
.list_main {
|
padding: 16px 0px 0 20px;
|
& >>> .pricing_dialog {
|
width: 500px;
|
& .el-dialog__footer {
|
& .dialog-footer {
|
& .el-button--default {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
border-radius: 4px;
|
border: 1px solid rgba(204, 204, 204, 1);
|
}
|
& .el-button--primary {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
background: #0081f0;
|
border-color: #0081f0;
|
border-radius: 4px;
|
margin-left: 40px;
|
}
|
}
|
}
|
}
|
& >>> .copy_dialog {
|
width: 950px;
|
}
|
& >>> .del_dialog {
|
width: 450px;
|
& .el-dialog__body {
|
text-align: center;
|
}
|
}
|
& .add-button {
|
padding: 2px 0 30px 0;
|
}
|
}
|
</style>
|
