如图显示，多选框获取不到另外一个value，能同时显示在多选框里吗
<template>
<div>
<div v-if="flag" class="app-container">
<el-card class="box-card">
<el-form :model="queryParams" ref="queryForm" label-width="120px" size="small">
<el-row :gutter="20">
<el-col :xs="12" :md="8" :lg="8">
<el-form-item label="状态" prop="configName">
<el-select style="width:100%" v-model="queryParams.status" placeholder="请选择" clearable size="small">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :xs="12" :md="8" :lg="8">
<el-form-item label="可查询企业编码" prop="configName" >
<el-select style="width:100%" v-model="queryParams.selTradeCode" placeholder="请选择" size="small">
<el-option v-for="item in etpsNoOptions" :key="item.codee" :label="item.label" :value="item.code" />
</el-select>
</el-form-item>
</el-col>
<el-col :xs="12" :md="8" :lg="8">
<el-form-item label="加工贸易手册号" prop="configName">
<el-input v-model="queryParams.emlNo" />
</el-form-item>
</el-col>
<el-col :md="24" :lg="8">
<el-form-item label="录入日期">
<el-date-picker v-model="queryParams.inputDateStart" value-format="yyyy-MM-dd" type="date" placeholder="开始日期" :picker-options="pickerOptions"></el-date-picker>
-
<el-date-picker v-model="queryParams.inputDateEnd" value-format="yyyy-MM-dd" type="date" placeholder="结束日期" :picker-options="pickerOptions"></el-date-picker>
</el-form-item>
</el-col>
<el-col :xs="12" :md="8" :lg="8">
<el-form-item label="报单统一编号" prop="configName">
<el-input v-model="queryParams.seqNo" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col style="text-align: center;">
<el-button type="primary" icon="el-icon-refresh" @click="handleQuery" :disabled="disabled">数据同步 </el-button>
</el-col>
</el-row>
</el-card>
<el-card class="box-card">
<el-row type="flex" justify="space-between" :gutter="10" class="mb8">
<el-col :span="16">
<el-form :inline=!0 style="pad">
<el-form-item label="任务状态">
<el-select style="width:100%" v-model="form.status" placeholder="请选择" clearable size="small">
<el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="getList" :disabled="disabled">刷新</el-button>
</el-form-item>
</el-form>
</el-col>
</el-row>
<el-table border stripe v-loading="loading"
:data="configList"
@selection-change="handleSelectionChange"
@row-dblclick="handleDblclick"
@sort-change="sortChange"
highlight-current-row>
<el-table-column width="55" type="selection" align="center" fixed="left"/>
<el-table-column width="55" label="序号" align="center" type="index" fixed="left"/>
<template v-for="(col,ck) in tableColumn">
<el-table-column :key="ck" v-if=col.isShow
:label=col.label :prop=col.prop :width=col.width :type=col.type
:align=col.align :fixed=col.fixed?col.fixed:false sortable="custom"
:show-overflow-tooltip=col.showOverflowTooltip
:formatter=col.formatter>
</el-table-column>
</template>
<el-table-column label="任务参数" align="center" prop="cnParam" :show-overflow-tooltip="true"/>
<el-table-column width="150" label="操作" align="center" fixed="right">
<template slot-scope="scope">
<el-button v-if="scope.row.status != 2" size="mini" type="text" icon="el-icon-delete"
@click="handleDelete(scope.row)">删除</el-button>
<el-button v-if=" scope.row.status != 4 && scope.row.status != 1 && scope.row.status != 5 "
size="mini" type="text" icon="el-icon-delete" @click="handleStop(scope.row)">终止</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="form.pageNum" :limit.sync="form.pageSize" @pagination="getList"/>
</el-card>
<el-card class="box-card">
<el-row type="flex" justify="space-between" :gutter="10" class="mb8">
<el-col :span="16">
<el-form :inline=!0 style="pad">
<el-form-item label="子任务详情">
<el-select style="width:100%" v-model="form.status" placeholder="" clearable size="small">
<el-option v-for="item in statusOptions1" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="getSubDcrDetail" :disabled="disabled">刷新</el-button>
</el-form>
</el-col>
</el-row>
<el-table border stripe v-loading="loading"
:data="configList"
@selection-change="handleSelectionChange"
@row-dblclick="handleDblclick"
@sort-change="sortChange"
highlight-current-row>
<template v-for="(col,ck) in tableColumn1">
<el-table-column :key="ck" v-if=col.isShow
:label=col.label :prop=col.prop :width=col.width :type=col.type
:align=col.align :fixed=col.fixed?col.fixed:false sortable="custom"
:show-overflow-tooltip=col.showOverflowTooltip>
</el-table-column>
</template>
<el-table-column width="120" label="操作" align="center">
<template slot-scope="scope">
<el-button v-if="scope.row.isRetry != 1 && scope.row.status == 4" size="mini" type="text" icon="el-icon-refresh" @click="handleRetry(scope.row)" >重启</el-button>
<el-button v-if="scope.row.status != 2" size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" >删除</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
</div>
</div>
</template>
<script>
import { queryUserconfig,saveUserconfig } from "@/api/ltd";
import { syncDcrData, getList, deldec,updateStatus,getEmlList } from "@/api/sync/sync";
import { getUserProfile } from "@/api/system/user";
import { getSubList } from "@/api/sub/sub"
import { parseTime } from "@/utils/common";
export default {
name: "SyncDcr",
data() {
return {
activeName: "0",
// 遮罩层
loading: true,
// 选中数组
ids: [],
emsNo: "",
emsNos: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: false,
// 总条数
total: 0,
// 参数表格数据
configList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
disabled: false,
// 类型数据字典
typeOptions: [],
etpsNoOptions: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
seqNo: undefined,
emlNo: undefined,
selTradeCode: undefined,
status: " ",
inputDateEnd: parseTime(
new Date(
new Date().getFullYear(),
new Date().getMonth(),
new Date().getDate()
)
),
inputDateStart:"2018-01-01"
},
options: this.ENUM_DATA.DATA_STATUS,
statusOptions: [
{ label: "全部", value: "" },
{ label: "新建", value: "0" },
{ label: "任务完成", value: "1" },
{ label: "执行中", value: "2" },
{ label: "执行失败", value: "4" },
{ label: "执行终止", value: "5" }
],
statusOptions1:[
{ label: "所有", value: "" },
{ label: "待处理", value: "0" },
{ label: "已发送", value: "1" },
{ label: "处理成功", value: "2" },
{ label: "终止", value: "4" },
{ label: "异常", value: "5" }
],
form: {
type: 2,
pageNum: 1,
pageSize: 10,
status:""
},
flag: true,
pickerOptions: {disabledDate(time) {
return time.getTime() > Date.now();}},
value1: "",
value2: "",
user: { dept: {} },
isVrfdedMarkcd: false,
isStatus: false,
visiblePopover:false,
tableColumn:[
{isShow:true,width:"150",label:"企业编码",align:"center",prop:"orgCusCode",fixed:"left",},
{isShow:true,width:"100",label:"任务状态",align:"center",prop:"status",fixed:"left",},
//{isShow:true,width:"200",label:"任务信息",align:"center",prop:"resultInfo",fixed:"left",showOverflowTooltio:true},
//{isShow:true,width:"200",label:"任务参数",align:"center",prop:"cnParam",showOverflowTooltio:true},
{isShow:true,width:"150",label:"创建时间",align:"center",prop:"createTime",},
{isShow:true,width:"150",label:"完成时间",align:"center",prop:"completeTime",showOverflowTooltio:true,fixed:"right"},
{isShow:true,width:"150",label:"操作人",align:"center",prop:"createUser",fixed:"right"},
],
tableColumn1:[
{isShow:true,width:"220",label:"任务编号",align:"center",prop:"id",},
{isShow:true,width:"220",label:"统一编号",align:"center",prop:"",},
{isShow:true,width:"220",label:"数据状态",align:"center",prop:"dataStatus"},
{isShow:true,width:"220",label:"操作类型",align:"center",prop:""},
{isShow:true,width:"150",label:"任务状态",align:"center",prop:""},
{isShow:true,width:"200",label:"任务信息",align:"center",prop:""},
{isShow:true,width:"200",label:"完成时间",align:"center",prop:""},
]
};
},
created() {
this.getUser();
this.getList();
this.getEmlNoList();
},
components: {
parseTime
},
methods: {
getList() {
this.loading = true;
getList(this.form).then(res => {
if(res.rows.length > 0){
this.configList = res.rows.map((v,i,a)=>{
v.status = this.statusFormat(v)
return v;
});
this.total = res.total;
}
this.loading = false;
}).catch((err)=>{this.loading = false;});
},
sortChange(e){//触发排序事件e
let order = {
"ascending":"asc",
"descending":"desc"
}[e.order]
if(e.order){
this.form.orderByColumn = e.prop + ' ' + order;
this.getList();
}else{
this.form.orderByColumn = '';
this.getList();
}
//目前仅考虑单序列，不过也不一定有用
},
saveTableConfig(){
let json = {
cfgKey:this.$route.meta.title,
cfgVal:JSON.stringify(this.tableColumn)
}
saveUserconfig(json).then((res)=>{
if(res.code==200){
this.$message(res.msg);
this.visiblePopover = false;
}
})
},//保存用户配置
moveUp(idx){
if(idx == 0){return}
let index2 = idx;
let index1 = idx - 1;
let array = this.tableColumn;
array.splice(index2,1,...array.splice(index1, 1 , array[index2]));
},/** 某popover需要的调序功能 */
getEmlNoList() {
queryUserconfig({//读取用户配置
cfgKey:this.$route.meta.title
}).then(res=>{
if(res.data.cfgVal){
this.tableColumn = JSON.parse(res.data.cfgVal)
}
}).catch((err)=>{
})
this.loading = false;
},
/** 查询参数列表 */
syncMessage() {
this.loading = true;
syncDcrData(this.queryParams)
.then(res => {
this.disabled = true;
this.loading = true;
this.msgSuccess(res.msg);
this.loading = false;
this.getList();
this.disabled = false;
})
.catch(function() {
this.msgError(res.msg);
});
},
// 岗位状态字典翻译
statusFormat(row, column) {
return this.selectLabel(this.statusOptions, row.status);
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
configId: undefined,
configName: undefined,
configKey: undefined,
configValue: undefined,
configType: "Y",
remark: undefined
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.loading = false;
this.queryParams.pageNum = 1;
this.syncMessage();
this.getList();
this.loading = true;
},
/** 重置按钮操作 */
resetQuery() {
this.dateRange = [];
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.configId);
this.emsNo = selection.map(item => item.emsno);
this.single = selection.length != 1;
this.multiple = !selection.length;
},
/** 行双击**/
// handleDblclick(row) {
// this.flag = false;
// this.$refs.detail.show(row.id, row.emsno);
// },
handleClick(row) {
this.queryParams.status = row.name;
this.getList();
},
/** 返回 **/
goBack() {
this.flag = true;
},
getUser() {
getUserProfile().then(response => {
this.user = response.data;
this.roleGroup = response.roleGroup;
this.postGroup = response.postGroup;
// this.queryParams.selTradeCode = this.user.dept.orgCusCode;
});
},
handleStop(row) {
this.loading = false;
this.$confirm("是否确认终止操作吗?", "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(function() {
row.status = 5;
return updateStatus(row);
})
.then(() => {
this.getList();
this.msgSuccess("操作成功");
})
.catch(function() {});
},
handleDelete(row) {
//this.loading = false;
this.$confirm("是否确认删除操作吗?", "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(function() {
row.deleted = 1;
return deldec(row.id);
})
.then(() => {
this.getList();
this.msgSuccess("删除成功");
})
.catch(function() {});
},
getEmlNoList() {
this.loading = false;
getEmlList().then(res => {
this.etpsNoOptions = res.data;
});
},
}
};
</script>
