auto-complete="off" | auto-complete="off" | ||||
placeholder="账号" | placeholder="账号" | ||||
> | > | ||||
<i | |||||
slot="prefix" | |||||
class="el-input__icon input-icon el-icon-user" | |||||
/> | |||||
<i slot="prefix" class="el-input__icon input-icon el-icon-user" /> | |||||
</el-input> | </el-input> | ||||
</el-form-item> | </el-form-item> | ||||
<el-form-item prop="password"> | <el-form-item prop="password"> | ||||
placeholder="密码" | placeholder="密码" | ||||
@keyup.enter.native="handleLogin" | @keyup.enter.native="handleLogin" | ||||
> | > | ||||
<i | |||||
slot="prefix" | |||||
class="el-input__icon input-icon el-icon-lock" | |||||
/> | |||||
<i slot="prefix" class="el-input__icon input-icon el-icon-lock" /> | |||||
</el-input> | </el-input> | ||||
</el-form-item> | </el-form-item> | ||||
<el-form-item v-if="captchaEnabled" prop="code"> | <el-form-item v-if="captchaEnabled" prop="code"> | ||||
</div> | </div> | ||||
</el-form-item> | </el-form-item> | ||||
</el-form> | </el-form> | ||||
<!-- 底部 --> | |||||
<div class="el-login-footer"> | |||||
<span>Copyright © 2024 zhushi All Rights Reserved.</span> | |||||
</div> | |||||
</div> | </div> | ||||
</template> | </template> | ||||
return { | return { | ||||
codeUrl: '', | codeUrl: '', | ||||
loginForm: { | loginForm: { | ||||
username: 'admin', | |||||
password: 'admin123', | |||||
username: '', // admin | |||||
password: '', // admin123 | |||||
rememberMe: false, | rememberMe: false, | ||||
code: '', | code: '', | ||||
uuid: '' | uuid: '' |
<template> | <template> | ||||
<div class="app-container"> | <div class="app-container"> | ||||
<el-form | <el-form | ||||
:model="queryParams" | |||||
ref="queryForm" | |||||
v-show="showSearch" | v-show="showSearch" | ||||
ref="queryForm" | |||||
:model="queryParams" | |||||
size="small" | size="small" | ||||
:inline="true" | :inline="true" | ||||
class="app-container--search" | class="app-container--search" | ||||
icon="el-icon-search" | icon="el-icon-search" | ||||
size="mini" | size="mini" | ||||
@click="handleQuery" | @click="handleQuery" | ||||
>搜索</el-button | |||||
> | |||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery" | |||||
>重置</el-button | |||||
> | |||||
>搜索</el-button> | |||||
<el-button | |||||
icon="el-icon-refresh" | |||||
size="mini" | |||||
@click="resetQuery" | |||||
>重置</el-button> | |||||
</el-form-item> | </el-form-item> | ||||
</el-form> | </el-form> | ||||
<el-row :gutter="10" class="mb8"> | <el-row :gutter="10" class="mb8"> | ||||
<el-col :span="1.5"> | <el-col :span="1.5"> | ||||
<el-button | <el-button | ||||
v-hasPermi="['system:operationGoods:add']" | |||||
type="primary" | type="primary" | ||||
plain | plain | ||||
icon="el-icon-plus" | icon="el-icon-plus" | ||||
size="mini" | size="mini" | ||||
@click="handleAdd" | @click="handleAdd" | ||||
v-hasPermi="['system:operationGoods:add']" | |||||
>新增</el-button | |||||
> | |||||
>新增</el-button> | |||||
</el-col> | |||||
<el-col :span="1.5"> | |||||
<el-button | |||||
v-hasPermi="['system:operationGoods:edit']" | |||||
type="success" | |||||
plain | |||||
icon="el-icon-edit" | |||||
size="mini" | |||||
:disabled="single" | |||||
@click="handleUpdate" | |||||
>修改</el-button> | |||||
</el-col> | </el-col> | ||||
<el-col :span="1.5"> </el-col> | |||||
<el-col :span="1.5"> | <el-col :span="1.5"> | ||||
<el-button | <el-button | ||||
v-hasPermi="['system:operationGoods:remove']" | |||||
type="danger" | type="danger" | ||||
plain | plain | ||||
icon="el-icon-delete" | icon="el-icon-delete" | ||||
size="mini" | size="mini" | ||||
:disabled="multiple" | :disabled="multiple" | ||||
@click="handleDelete" | @click="handleDelete" | ||||
v-hasPermi="['system:operationGoods:remove']" | |||||
>删除</el-button | |||||
> | |||||
>删除</el-button> | |||||
</el-col> | </el-col> | ||||
<el-col :span="1.5"> | <el-col :span="1.5"> | ||||
<el-button | <el-button | ||||
v-hasPermi="['system:operationGoods:export']" | |||||
type="warning" | type="warning" | ||||
plain | plain | ||||
icon="el-icon-download" | icon="el-icon-download" | ||||
size="mini" | size="mini" | ||||
@click="handleExport" | @click="handleExport" | ||||
v-hasPermi="['system:operationGoods:export']" | |||||
>导出</el-button | |||||
> | |||||
>导出</el-button> | |||||
</el-col> | </el-col> | ||||
<right-toolbar | |||||
:showSearch.sync="showSearch" | |||||
@queryTable="getList" | |||||
></right-toolbar> | |||||
<right-toolbar :show-search.sync="showSearch" @queryTable="getList" /> | |||||
</el-row> | </el-row> | ||||
<el-table | <el-table | ||||
@selection-change="handleSelectionChange" | @selection-change="handleSelectionChange" | ||||
> | > | ||||
<el-table-column type="selection" width="55" align="center" /> | <el-table-column type="selection" width="55" align="center" /> | ||||
<el-table-column label="主键ID" align="center" prop="id" v-if="false" /> | |||||
<el-table-column v-if="false" label="主键ID" align="center" prop="id" /> | |||||
<el-table-column label="商品" align="center"> | <el-table-column label="商品" align="center"> | ||||
<template slot-scope="scope"> | <template slot-scope="scope"> | ||||
<div class="goods--info"> | <div class="goods--info"> | ||||
align="center" | align="center" | ||||
prop="initPrice" | prop="initPrice" | ||||
/> | /> | ||||
<el-table-column width="300" label="备注" align="center" prop="remark" /> | |||||
<el-table-column | <el-table-column | ||||
width="320" | |||||
label="备注" | |||||
width="120" | |||||
label="创建时间" | |||||
align="center" | align="center" | ||||
prop="remark" | |||||
show-overflow-tooltip | |||||
/> | |||||
prop="createDate" | |||||
> | |||||
<template slot-scope="scope"> | |||||
<span>{{ | |||||
parseTime(scope.row.createDate, '{y}-{m}-{d} {h}:{i}:{s}') | |||||
}}</span> | |||||
</template> | |||||
</el-table-column> | |||||
<el-table-column | <el-table-column | ||||
width="120" | width="120" | ||||
label="是否启用" | label="是否启用" | ||||
> | > | ||||
<template slot-scope="scope"> | <template slot-scope="scope"> | ||||
<el-button | <el-button | ||||
v-hasPermi="['system:operationGoods:edit']" | |||||
size="mini" | |||||
type="text" | |||||
icon="el-icon-edit" | |||||
@click="handleUpdate(scope.row)" | |||||
>修改</el-button> | |||||
<el-button | |||||
v-hasPermi="['system:operationGoods:remove']" | |||||
size="mini" | size="mini" | ||||
type="text" | type="text" | ||||
icon="el-icon-delete" | icon="el-icon-delete" | ||||
@click="handleDelete(scope.row)" | @click="handleDelete(scope.row)" | ||||
v-hasPermi="['system:operationGoods:remove']" | |||||
>删除</el-button | |||||
> | |||||
>删除</el-button> | |||||
</template> | </template> | ||||
</el-table-column> | </el-table-column> | ||||
</el-table> | </el-table> | ||||
label-width="80px" | label-width="80px" | ||||
label-position="top" | label-position="top" | ||||
> | > | ||||
<el-form-item label="商品名称" prop="goodsSkuName" v-show="isEdit"> | |||||
<el-input v-model="form.goodsSkuName" /> | |||||
<el-form-item v-show="isEdit" label="商品名称" prop="goodsSkuName"> | |||||
<el-input v-model="form.goodsSkuName" type="textarea" rows="4" /> | |||||
</el-form-item> | </el-form-item> | ||||
<el-form-item label="商品编号" prop="goodsSkuSn" v-show="isEdit"> | |||||
<el-input v-model="form.goodsSkuSn" /> | |||||
<el-form-item v-show="isEdit" label="商品编号" prop="goodsSkuSn"> | |||||
<el-input | |||||
v-model="form.goodsSkuSn" | |||||
type="textarea" | |||||
:disabled="isEdit" | |||||
/> | |||||
</el-form-item> | </el-form-item> | ||||
<el-form-item label="商品URL" prop="goodsSkuUrl"> | <el-form-item label="商品URL" prop="goodsSkuUrl"> | ||||
<el-input | <el-input | ||||
type="textarea" | type="textarea" | ||||
rows="4" | rows="4" | ||||
placeholder="请输入商品URL" | placeholder="请输入商品URL" | ||||
:disabled="isEdit" | |||||
/> | /> | ||||
<p class="tips"> | <p class="tips"> | ||||
系统会根据商品URL,自动获取商品名称、编号、基准价格、备注信息, | 系统会根据商品URL,自动获取商品名称、编号、基准价格、备注信息, | ||||
<el-row> | <el-row> | ||||
<el-col :span="12"> | <el-col :span="12"> | ||||
<el-form-item label="平台" prop="platform"> | <el-form-item label="平台" prop="platform"> | ||||
<el-select v-model="form.platform" placeholder="请选择平台"> | |||||
<el-select | |||||
v-model="form.platform" | |||||
placeholder="请选择平台" | |||||
:disabled="isEdit" | |||||
> | |||||
<el-option | <el-option | ||||
v-for="dict in dict.type.zs_operation_platform" | v-for="dict in dict.type.zs_operation_platform" | ||||
:key="dict.value" | :key="dict.value" | ||||
:label="dict.label" | :label="dict.label" | ||||
:value="dict.value" | :value="dict.value" | ||||
></el-option> | |||||
/> | |||||
</el-select> | </el-select> | ||||
</el-form-item> | </el-form-item> | ||||
</el-col> | </el-col> | ||||
:key="dict.value" | :key="dict.value" | ||||
:label="dict.label" | :label="dict.label" | ||||
:value="dict.value" | :value="dict.value" | ||||
></el-option> | |||||
/> | |||||
</el-select> | </el-select> | ||||
</el-form-item> | </el-form-item> | ||||
</el-col> | </el-col> | ||||
</el-row> | </el-row> | ||||
<el-form-item label="基准价格" prop="initPrice" v-show="isEdit"> | |||||
<el-input v-model="form.initPrice" placeholder="请输入基准价格" /> | |||||
<el-form-item v-show="isEdit" label="基准价格" prop="initPrice"> | |||||
<el-input | |||||
v-model="form.initPrice" | |||||
placeholder="请输入基准价格" | |||||
:disabled="isEdit" | |||||
/> | |||||
</el-form-item> | </el-form-item> | ||||
<el-form-item label="备注" prop="remark" v-show="isEdit"> | |||||
<el-form-item v-show="isEdit" label="备注" prop="remark"> | |||||
<el-input | <el-input | ||||
v-model="form.remark" | v-model="form.remark" | ||||
type="textarea" | type="textarea" | ||||
</el-form> | </el-form> | ||||
<div slot="footer" class="dialog-footer"> | <div slot="footer" class="dialog-footer"> | ||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm" | |||||
>确 定</el-button | |||||
> | |||||
<span | |||||
v-if="errorMsg" | |||||
class="error-msg" | |||||
style="color: red; margin-right: 10px" | |||||
>{{ errorMsg }}</span> | |||||
<el-button | |||||
:loading="buttonLoading" | |||||
type="primary" | |||||
@click="submitForm" | |||||
>{{ errorMsg ? '重 试' : '确 定' }}</el-button> | |||||
<el-button @click="cancel">取 消</el-button> | <el-button @click="cancel">取 消</el-button> | ||||
</div> | </div> | ||||
</el-dialog> | </el-dialog> | ||||
getOperationGoods, | getOperationGoods, | ||||
delOperationGoods, | delOperationGoods, | ||||
addOperationGoods, | addOperationGoods, | ||||
updateOperationGoods, | |||||
} from "@/api/system/operationGoods"; | |||||
updateOperationGoods | |||||
} from '@/api/system/operationGoods' | |||||
export default { | export default { | ||||
name: "OperationGoods", | |||||
dicts: ["zs_is_disabled", "zs_operation_platform"], | |||||
name: 'OperationGoods', | |||||
dicts: ['zs_is_disabled', 'zs_operation_platform'], | |||||
data() { | data() { | ||||
return { | return { | ||||
// 按钮loading | // 按钮loading | ||||
// 商品配置表格数据 | // 商品配置表格数据 | ||||
operationGoodsList: [], | operationGoodsList: [], | ||||
// 弹出层标题 | // 弹出层标题 | ||||
title: "", | |||||
title: '', | |||||
// 是否显示弹出层 | // 是否显示弹出层 | ||||
open: false, | open: false, | ||||
// 是否编辑 | // 是否编辑 | ||||
isEdit: false, | isEdit: false, | ||||
// 错误信息 | |||||
errorMsg: '', | |||||
// 查询参数 | // 查询参数 | ||||
queryParams: { | queryParams: { | ||||
pageNum: 1, | pageNum: 1, | ||||
goodsSkuName: undefined, | goodsSkuName: undefined, | ||||
goodsSkuSn: undefined, | goodsSkuSn: undefined, | ||||
platform: undefined, | platform: undefined, | ||||
isDisabled: undefined, | |||||
isDisabled: undefined | |||||
}, | }, | ||||
// 表单参数 | // 表单参数 | ||||
form: {}, | form: {}, | ||||
// 表单校验 | // 表单校验 | ||||
rules: { | rules: { | ||||
id: [{ required: true, message: "主键ID不能为空", trigger: "blur" }], | |||||
id: [{ required: true, message: '主键ID不能为空', trigger: 'blur' }], | |||||
goodsSkuUrl: [ | goodsSkuUrl: [ | ||||
{ required: true, message: "商品URL不能为空", trigger: "blur" }, | |||||
{ required: true, message: '商品URL不能为空', trigger: 'blur' } | |||||
], | ], | ||||
platform: [ | platform: [ | ||||
{ required: true, message: "平台不能为空", trigger: "blur" }, | |||||
{ required: true, message: '平台不能为空', trigger: 'blur' } | |||||
], | ], | ||||
isDisabled: [ | isDisabled: [ | ||||
{ required: true, message: "是否启用不能为空", trigger: "blur" }, | |||||
], | |||||
}, | |||||
}; | |||||
{ required: true, message: '是否启用不能为空', trigger: 'blur' } | |||||
] | |||||
} | |||||
} | |||||
}, | }, | ||||
created() { | created() { | ||||
this.getList(); | |||||
this.getList() | |||||
}, | }, | ||||
methods: { | methods: { | ||||
/** 查询商品配置列表 */ | /** 查询商品配置列表 */ | ||||
getList() { | getList() { | ||||
this.loading = true; | |||||
this.loading = true | |||||
listOperationGoods(this.queryParams).then((response) => { | listOperationGoods(this.queryParams).then((response) => { | ||||
this.operationGoodsList = response.rows; | |||||
this.total = response.total; | |||||
this.loading = false; | |||||
}); | |||||
this.operationGoodsList = response.rows | |||||
this.total = response.total | |||||
this.loading = false | |||||
}) | |||||
}, | }, | ||||
// 取消按钮 | // 取消按钮 | ||||
cancel() { | cancel() { | ||||
this.open = false; | |||||
this.reset(); | |||||
this.open = false | |||||
this.reset() | |||||
}, | }, | ||||
// 表单重置 | // 表单重置 | ||||
reset() { | reset() { | ||||
platform: undefined, | platform: undefined, | ||||
initPrice: undefined, | initPrice: undefined, | ||||
remark: undefined, | remark: undefined, | ||||
isDisabled: undefined, | |||||
}; | |||||
this.resetForm("form"); | |||||
isDisabled: undefined | |||||
} | |||||
this.resetForm('form') | |||||
}, | }, | ||||
/** 开关切换 */ | /** 开关切换 */ | ||||
handleSwitch(row) { | handleSwitch(row) { | ||||
updateOperationGoods(row).then((response) => { | updateOperationGoods(row).then((response) => { | ||||
this.getList(); | |||||
}); | |||||
this.getList() | |||||
}) | |||||
}, | }, | ||||
/** 搜索按钮操作 */ | /** 搜索按钮操作 */ | ||||
handleQuery() { | handleQuery() { | ||||
this.queryParams.pageNum = 1; | |||||
this.getList(); | |||||
this.queryParams.pageNum = 1 | |||||
this.getList() | |||||
}, | }, | ||||
/** 重置按钮操作 */ | /** 重置按钮操作 */ | ||||
resetQuery() { | resetQuery() { | ||||
this.resetForm("queryForm"); | |||||
this.handleQuery(); | |||||
this.resetForm('queryForm') | |||||
this.handleQuery() | |||||
}, | }, | ||||
// 多选框选中数据 | // 多选框选中数据 | ||||
handleSelectionChange(selection) { | handleSelectionChange(selection) { | ||||
this.ids = selection.map((item) => item.id); | |||||
this.single = selection.length !== 1; | |||||
this.multiple = !selection.length; | |||||
this.ids = selection.map((item) => item.id) | |||||
this.single = selection.length !== 1 | |||||
this.multiple = !selection.length | |||||
}, | }, | ||||
/** 新增按钮操作 */ | /** 新增按钮操作 */ | ||||
handleAdd() { | handleAdd() { | ||||
this.reset(); | |||||
this.open = true; | |||||
this.title = "添加商品配置"; | |||||
this.isEdit = false; | |||||
this.reset() | |||||
this.open = true | |||||
this.title = '添加商品配置' | |||||
this.isEdit = false | |||||
}, | }, | ||||
/** 修改按钮操作 */ | /** 修改按钮操作 */ | ||||
handleUpdate(row) { | handleUpdate(row) { | ||||
this.loading = true; | |||||
this.reset(); | |||||
const id = row.id || this.ids; | |||||
this.loading = true | |||||
this.reset() | |||||
const id = row.id || this.ids | |||||
getOperationGoods(id).then((response) => { | getOperationGoods(id).then((response) => { | ||||
this.loading = false; | |||||
this.form = response.data; | |||||
this.open = true; | |||||
this.title = "修改商品配置"; | |||||
this.isEdit = true; | |||||
}); | |||||
this.loading = false | |||||
this.form = response.data | |||||
this.open = true | |||||
this.title = '修改商品配置' | |||||
this.isEdit = true | |||||
}) | |||||
}, | }, | ||||
/** 提交按钮 */ | /** 提交按钮 */ | ||||
submitForm() { | submitForm() { | ||||
this.$refs["form"].validate((valid) => { | |||||
this.$refs['form'].validate((valid) => { | |||||
if (valid) { | if (valid) { | ||||
this.buttonLoading = true; | |||||
this.buttonLoading = true | |||||
if (this.form.id != null) { | if (this.form.id != null) { | ||||
updateOperationGoods(this.form) | updateOperationGoods(this.form) | ||||
.then((response) => { | .then((response) => { | ||||
this.$modal.msgSuccess("修改成功"); | |||||
this.open = false; | |||||
this.getList(); | |||||
this.$modal.msgSuccess('修改成功') | |||||
this.open = false | |||||
this.getList() | |||||
}) | }) | ||||
.finally(() => { | .finally(() => { | ||||
this.buttonLoading = false; | |||||
}); | |||||
this.buttonLoading = false | |||||
}) | |||||
} else { | } else { | ||||
addOperationGoods(this.form) | addOperationGoods(this.form) | ||||
.then((response) => { | .then((response) => { | ||||
this.$modal.msgSuccess("新增成功"); | |||||
this.open = false; | |||||
this.getList(); | |||||
this.$modal.msgSuccess('新增成功') | |||||
this.open = false | |||||
this.getList() | |||||
this.errorMsg = '' | |||||
}) | |||||
.catch((error) => { | |||||
this.errorMsg = error.message + ',请重试。' | |||||
}) | }) | ||||
.finally(() => { | .finally(() => { | ||||
this.buttonLoading = false; | |||||
}); | |||||
this.buttonLoading = false | |||||
}) | |||||
} | } | ||||
} | } | ||||
}); | |||||
}) | |||||
}, | }, | ||||
/** 删除按钮操作 */ | /** 删除按钮操作 */ | ||||
handleDelete(row) { | handleDelete(row) { | ||||
const ids = row.id || this.ids; | |||||
const ids = row.id || this.ids | |||||
this.$modal | this.$modal | ||||
.confirm('是否确认删除商品配置编号为"' + ids + '"的数据项?') | .confirm('是否确认删除商品配置编号为"' + ids + '"的数据项?') | ||||
.then(() => { | .then(() => { | ||||
this.loading = true; | |||||
return delOperationGoods(ids); | |||||
this.loading = true | |||||
return delOperationGoods(ids) | |||||
}) | }) | ||||
.then(() => { | .then(() => { | ||||
this.loading = false; | |||||
this.getList(); | |||||
this.$modal.msgSuccess("删除成功"); | |||||
this.loading = false | |||||
this.getList() | |||||
this.$modal.msgSuccess('删除成功') | |||||
}) | }) | ||||
.catch(() => {}) | .catch(() => {}) | ||||
.finally(() => { | .finally(() => { | ||||
this.loading = false; | |||||
}); | |||||
this.loading = false | |||||
}) | |||||
}, | }, | ||||
/** 导出按钮操作 */ | /** 导出按钮操作 */ | ||||
handleExport() { | handleExport() { | ||||
this.download( | this.download( | ||||
"system/operationGoods/export", | |||||
'system/operationGoods/export', | |||||
{ | { | ||||
...this.queryParams, | |||||
...this.queryParams | |||||
}, | }, | ||||
`operationGoods_${new Date().getTime()}.xlsx` | `operationGoods_${new Date().getTime()}.xlsx` | ||||
); | |||||
}, | |||||
}, | |||||
}; | |||||
) | |||||
} | |||||
} | |||||
} | |||||
</script> | </script> | ||||
<style lang="scss" scoped> | <style lang="scss" scoped> |
<el-row :gutter="10" class="mb8"> | <el-row :gutter="10" class="mb8"> | ||||
<el-col :span="1.5"> | <el-col :span="1.5"> | ||||
<el-button | <el-button | ||||
v-hasPermi="['system:operationWarnconfig:add']" | |||||
type="primary" | type="primary" | ||||
plain | plain | ||||
icon="el-icon-plus" | icon="el-icon-plus" | ||||
size="mini" | size="mini" | ||||
@click="handleAdd" | @click="handleAdd" | ||||
v-hasPermi="['system:operationWarnconfig:add']" | |||||
>新增</el-button> | >新增</el-button> | ||||
</el-col> | </el-col> | ||||
<el-col :span="1.5"> | <el-col :span="1.5"> | ||||
<el-button | <el-button | ||||
v-hasPermi="['system:operationWarnconfig:edit']" | |||||
type="success" | type="success" | ||||
plain | plain | ||||
icon="el-icon-edit" | icon="el-icon-edit" | ||||
size="mini" | size="mini" | ||||
:disabled="single" | :disabled="single" | ||||
@click="handleUpdate" | @click="handleUpdate" | ||||
v-hasPermi="['system:operationWarnconfig:edit']" | |||||
>修改</el-button> | >修改</el-button> | ||||
</el-col> | </el-col> | ||||
<el-col :span="1.5"> | <el-col :span="1.5"> | ||||
<el-button | <el-button | ||||
v-hasPermi="['system:operationWarnconfig:remove']" | |||||
type="danger" | type="danger" | ||||
plain | plain | ||||
icon="el-icon-delete" | icon="el-icon-delete" | ||||
size="mini" | size="mini" | ||||
:disabled="multiple" | :disabled="multiple" | ||||
@click="handleDelete" | @click="handleDelete" | ||||
v-hasPermi="['system:operationWarnconfig:remove']" | |||||
>删除</el-button> | >删除</el-button> | ||||
</el-col> | </el-col> | ||||
<el-col :span="1.5"> | <el-col :span="1.5"> | ||||
<el-button | <el-button | ||||
v-hasPermi="['system:operationWarnconfig:export']" | |||||
type="warning" | type="warning" | ||||
plain | plain | ||||
icon="el-icon-download" | icon="el-icon-download" | ||||
size="mini" | size="mini" | ||||
@click="handleExport" | @click="handleExport" | ||||
v-hasPermi="['system:operationWarnconfig:export']" | |||||
>导出</el-button> | >导出</el-button> | ||||
</el-col> | </el-col> | ||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> | |||||
<right-toolbar | |||||
:show-search.sync="showSearch" | |||||
@queryTable="getList" | |||||
/> | |||||
</el-row> | </el-row> | ||||
<el-table v-loading="loading" :data="operationWarnconfigList" @selection-change="handleSelectionChange"> | |||||
<el-table | |||||
v-loading="loading" | |||||
:data="operationWarnconfigList" | |||||
@selection-change="handleSelectionChange" | |||||
> | |||||
<el-table-column type="selection" width="55" align="center" /> | <el-table-column type="selection" width="55" align="center" /> | ||||
<el-table-column label="主键ID" align="center" prop="id" v-if="false"/> | |||||
<el-table-column label="价格变化比例阈值" align="center" prop="priceChangeThreshold" /> | |||||
<el-table-column v-if="false" label="主键ID" align="center" prop="id" /> | |||||
<el-table-column | |||||
label="价格变化比例阈值" | |||||
align="center" | |||||
prop="priceChangeThreshold" | |||||
/> | |||||
<el-table-column label="监控频率" align="center" prop="monitorFrequency"> | <el-table-column label="监控频率" align="center" prop="monitorFrequency"> | ||||
<template slot-scope="scope"> | <template slot-scope="scope"> | ||||
<dict-tag :options="dict.type.zs_operation_monitor_frequency" :value="scope.row.monitorFrequency"/> | |||||
<dict-tag | |||||
:options="dict.type.zs_operation_monitor_frequency" | |||||
:value="scope.row.monitorFrequency" | |||||
/> | |||||
</template> | </template> | ||||
</el-table-column> | </el-table-column> | ||||
<el-table-column label="预警方式" align="center" prop="warnTypes"> | <el-table-column label="预警方式" align="center" prop="warnTypes"> | ||||
<template slot-scope="scope"> | <template slot-scope="scope"> | ||||
<dict-tag :options="dict.type.zs_operation_warn_types" :value="scope.row.warnTypes"/> | |||||
<dict-tag | |||||
:options="dict.type.zs_operation_warn_types" | |||||
:value="scope.row.warnTypes" | |||||
/> | |||||
</template> | </template> | ||||
</el-table-column> | </el-table-column> | ||||
<el-table-column label="预警时间段" align="center" prop="warnTimeRange"> | <el-table-column label="预警时间段" align="center" prop="warnTimeRange"> | ||||
<template slot-scope="scope"> | <template slot-scope="scope"> | ||||
<dict-tag :options="dict.type.zs_operation_warn_time_range" :value="scope.row.warnTimeRange"/> | |||||
<dict-tag | |||||
:options="dict.type.zs_operation_warn_time_range" | |||||
:value="scope.row.warnTimeRange" | |||||
/> | |||||
</template> | </template> | ||||
</el-table-column> | </el-table-column> | ||||
<el-table-column label="备注" align="center" prop="remark" /> | <el-table-column label="备注" align="center" prop="remark" /> | ||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> | |||||
<el-table-column | |||||
label="操作" | |||||
align="center" | |||||
class-name="small-padding fixed-width" | |||||
> | |||||
<template slot-scope="scope"> | <template slot-scope="scope"> | ||||
<el-button | <el-button | ||||
v-hasPermi="['system:operationWarnconfig:edit']" | |||||
size="mini" | size="mini" | ||||
type="text" | type="text" | ||||
icon="el-icon-edit" | icon="el-icon-edit" | ||||
@click="handleUpdate(scope.row)" | @click="handleUpdate(scope.row)" | ||||
v-hasPermi="['system:operationWarnconfig:edit']" | |||||
>修改</el-button> | >修改</el-button> | ||||
<el-button | <el-button | ||||
v-hasPermi="['system:operationWarnconfig:remove']" | |||||
size="mini" | size="mini" | ||||
type="text" | type="text" | ||||
icon="el-icon-delete" | icon="el-icon-delete" | ||||
@click="handleDelete(scope.row)" | @click="handleDelete(scope.row)" | ||||
v-hasPermi="['system:operationWarnconfig:remove']" | |||||
>删除</el-button> | >删除</el-button> | ||||
</template> | </template> | ||||
</el-table-column> | </el-table-column> | ||||
</el-table> | </el-table> | ||||
<pagination | <pagination | ||||
v-show="total>0" | |||||
v-show="total > 0" | |||||
:total="total" | :total="total" | ||||
:page.sync="queryParams.pageNum" | :page.sync="queryParams.pageNum" | ||||
:limit.sync="queryParams.pageSize" | :limit.sync="queryParams.pageSize" | ||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body> | <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body> | ||||
<el-form ref="form" :model="form" :rules="rules" label-width="100px"> | <el-form ref="form" :model="form" :rules="rules" label-width="100px"> | ||||
<el-form-item label="监控阈值" prop="priceChangeThreshold"> | <el-form-item label="监控阈值" prop="priceChangeThreshold"> | ||||
<el-input v-model="form.priceChangeThreshold" type="number" placeholder="请输入" style="width: 100px;" /> | |||||
<span style="margin-left: 10px;">单位:百分比</span> | |||||
<el-input | |||||
v-model="form.priceChangeThreshold" | |||||
type="number" | |||||
placeholder="请输入" | |||||
style="width: 100px" | |||||
/> | |||||
<span style="margin-left: 10px">单位:百分比</span> | |||||
</el-form-item> | </el-form-item> | ||||
<el-form-item label="监控频率" prop="monitorFrequency"> | <el-form-item label="监控频率" prop="monitorFrequency"> | ||||
<el-select v-model="form.monitorFrequency" placeholder="请选择监控频率"> | |||||
<el-select | |||||
v-model="form.monitorFrequency" | |||||
placeholder="请选择监控频率" | |||||
> | |||||
<el-option | <el-option | ||||
v-for="dict in dict.type.zs_operation_monitor_frequency" | v-for="dict in dict.type.zs_operation_monitor_frequency" | ||||
:key="dict.value" | :key="dict.value" | ||||
:label="dict.label" | :label="dict.label" | ||||
:value="dict.value" | :value="dict.value" | ||||
></el-option> | |||||
/> | |||||
</el-select> | </el-select> | ||||
</el-form-item> | </el-form-item> | ||||
<el-form-item label="预警方式" prop="warnTypes"> | <el-form-item label="预警方式" prop="warnTypes"> | ||||
:key="dict.value" | :key="dict.value" | ||||
:label="dict.label" | :label="dict.label" | ||||
:value="dict.value" | :value="dict.value" | ||||
></el-option> | |||||
/> | |||||
</el-select> | </el-select> | ||||
</el-form-item> | </el-form-item> | ||||
<el-form-item label="预警时间" prop="warnTimeRange"> | <el-form-item label="预警时间" prop="warnTimeRange"> | ||||
:key="dict.value" | :key="dict.value" | ||||
:label="dict.label" | :label="dict.label" | ||||
:value="dict.value" | :value="dict.value" | ||||
></el-option> | |||||
/> | |||||
</el-select> | </el-select> | ||||
</el-form-item> | </el-form-item> | ||||
<el-form-item label="备注" prop="remark"> | <el-form-item label="备注" prop="remark"> | ||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" /> | |||||
<el-input | |||||
v-model="form.remark" | |||||
type="textarea" | |||||
placeholder="请输入内容" | |||||
/> | |||||
</el-form-item> | </el-form-item> | ||||
</el-form> | </el-form> | ||||
<div slot="footer" class="dialog-footer"> | <div slot="footer" class="dialog-footer"> | ||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button> | |||||
<el-button | |||||
:loading="buttonLoading" | |||||
type="primary" | |||||
@click="submitForm" | |||||
>确 定</el-button> | |||||
<el-button @click="cancel">取 消</el-button> | <el-button @click="cancel">取 消</el-button> | ||||
</div> | </div> | ||||
</el-dialog> | </el-dialog> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
import { listOperationWarnconfig, getOperationWarnconfig, delOperationWarnconfig, addOperationWarnconfig, updateOperationWarnconfig } from "@/api/system/operationWarnconfig"; | |||||
import { | |||||
listOperationWarnconfig, | |||||
getOperationWarnconfig, | |||||
delOperationWarnconfig, | |||||
addOperationWarnconfig, | |||||
updateOperationWarnconfig | |||||
} from '@/api/system/operationWarnconfig' | |||||
export default { | export default { | ||||
name: "OperationWarnconfig", | |||||
dicts: ['zs_operation_monitor_frequency', 'zs_operation_warn_types', 'zs_operation_warn_time_range'], | |||||
name: 'OperationWarnconfig', | |||||
dicts: [ | |||||
'zs_operation_monitor_frequency', | |||||
'zs_operation_warn_types', | |||||
'zs_operation_warn_time_range' | |||||
], | |||||
data() { | data() { | ||||
return { | return { | ||||
// 按钮loading | // 按钮loading | ||||
// 预警配置表格数据 | // 预警配置表格数据 | ||||
operationWarnconfigList: [], | operationWarnconfigList: [], | ||||
// 弹出层标题 | // 弹出层标题 | ||||
title: "", | |||||
title: '', | |||||
// 是否显示弹出层 | // 是否显示弹出层 | ||||
open: false, | open: false, | ||||
// 查询参数 | // 查询参数 | ||||
queryParams: { | queryParams: { | ||||
pageNum: 1, | pageNum: 1, | ||||
pageSize: 10, | |||||
pageSize: 10 | |||||
}, | }, | ||||
// 表单参数 | // 表单参数 | ||||
form: {}, | form: {}, | ||||
// 表单校验 | // 表单校验 | ||||
rules: { | rules: { | ||||
id: [ | |||||
{ required: true, message: "主键ID不能为空", trigger: "blur" } | |||||
], | |||||
id: [{ required: true, message: '主键ID不能为空', trigger: 'blur' }] | |||||
} | } | ||||
}; | |||||
} | |||||
}, | }, | ||||
created() { | created() { | ||||
this.getList(); | |||||
this.getList() | |||||
}, | }, | ||||
methods: { | methods: { | ||||
/** 查询预警配置列表 */ | /** 查询预警配置列表 */ | ||||
getList() { | getList() { | ||||
this.loading = true; | |||||
listOperationWarnconfig(this.queryParams).then(response => { | |||||
this.operationWarnconfigList = response.rows; | |||||
this.total = response.total; | |||||
this.loading = false; | |||||
}); | |||||
this.loading = true | |||||
listOperationWarnconfig(this.queryParams).then((response) => { | |||||
this.operationWarnconfigList = response.rows | |||||
this.total = response.total | |||||
this.loading = false | |||||
}) | |||||
}, | }, | ||||
// 取消按钮 | // 取消按钮 | ||||
cancel() { | cancel() { | ||||
this.open = false; | |||||
this.reset(); | |||||
this.open = false | |||||
this.reset() | |||||
}, | }, | ||||
// 表单重置 | // 表单重置 | ||||
reset() { | reset() { | ||||
warnTypes: undefined, | warnTypes: undefined, | ||||
warnTimeRange: undefined, | warnTimeRange: undefined, | ||||
remark: undefined | remark: undefined | ||||
}; | |||||
this.resetForm("form"); | |||||
} | |||||
this.resetForm('form') | |||||
}, | }, | ||||
/** 搜索按钮操作 */ | /** 搜索按钮操作 */ | ||||
handleQuery() { | handleQuery() { | ||||
this.queryParams.pageNum = 1; | |||||
this.getList(); | |||||
this.queryParams.pageNum = 1 | |||||
this.getList() | |||||
}, | }, | ||||
/** 重置按钮操作 */ | /** 重置按钮操作 */ | ||||
resetQuery() { | resetQuery() { | ||||
this.resetForm("queryForm"); | |||||
this.handleQuery(); | |||||
this.resetForm('queryForm') | |||||
this.handleQuery() | |||||
}, | }, | ||||
// 多选框选中数据 | // 多选框选中数据 | ||||
handleSelectionChange(selection) { | handleSelectionChange(selection) { | ||||
this.ids = selection.map(item => item.id) | |||||
this.single = selection.length!==1 | |||||
this.ids = selection.map((item) => item.id) | |||||
this.single = selection.length !== 1 | |||||
this.multiple = !selection.length | this.multiple = !selection.length | ||||
}, | }, | ||||
/** 新增按钮操作 */ | /** 新增按钮操作 */ | ||||
handleAdd() { | handleAdd() { | ||||
this.reset(); | |||||
this.open = true; | |||||
this.title = "添加预警配置"; | |||||
this.reset() | |||||
this.open = true | |||||
this.title = '添加预警配置' | |||||
}, | }, | ||||
/** 修改按钮操作 */ | /** 修改按钮操作 */ | ||||
handleUpdate(row) { | handleUpdate(row) { | ||||
this.loading = true; | |||||
this.reset(); | |||||
this.loading = true | |||||
this.reset() | |||||
const id = row.id || this.ids | const id = row.id || this.ids | ||||
getOperationWarnconfig(id).then(response => { | |||||
this.loading = false; | |||||
this.form = response.data; | |||||
this.open = true; | |||||
this.title = "修改预警配置"; | |||||
}); | |||||
getOperationWarnconfig(id).then((response) => { | |||||
this.loading = false | |||||
this.form = response.data | |||||
this.open = true | |||||
this.title = '修改预警配置' | |||||
}) | |||||
}, | }, | ||||
/** 提交按钮 */ | /** 提交按钮 */ | ||||
submitForm() { | submitForm() { | ||||
this.$refs["form"].validate(valid => { | |||||
this.$refs['form'].validate((valid) => { | |||||
if (valid) { | if (valid) { | ||||
this.buttonLoading = true; | |||||
this.buttonLoading = true | |||||
if (this.form.id != null) { | if (this.form.id != null) { | ||||
updateOperationWarnconfig(this.form).then(response => { | |||||
this.$modal.msgSuccess("修改成功"); | |||||
this.open = false; | |||||
this.getList(); | |||||
}).finally(() => { | |||||
this.buttonLoading = false; | |||||
}); | |||||
updateOperationWarnconfig(this.form) | |||||
.then((response) => { | |||||
this.$modal.msgSuccess('修改成功') | |||||
this.open = false | |||||
this.getList() | |||||
}) | |||||
.finally(() => { | |||||
this.buttonLoading = false | |||||
}) | |||||
} else { | } else { | ||||
addOperationWarnconfig(this.form).then(response => { | |||||
this.$modal.msgSuccess("新增成功"); | |||||
this.open = false; | |||||
this.getList(); | |||||
}).finally(() => { | |||||
this.buttonLoading = false; | |||||
}); | |||||
addOperationWarnconfig(this.form) | |||||
.then((response) => { | |||||
this.$modal.msgSuccess('新增成功') | |||||
this.open = false | |||||
this.getList() | |||||
}) | |||||
.finally(() => { | |||||
this.buttonLoading = false | |||||
}) | |||||
} | } | ||||
} | } | ||||
}); | |||||
}) | |||||
}, | }, | ||||
/** 删除按钮操作 */ | /** 删除按钮操作 */ | ||||
handleDelete(row) { | handleDelete(row) { | ||||
const ids = row.id || this.ids; | |||||
this.$modal.confirm('是否确认删除预警配置编号为"' + ids + '"的数据项?').then(() => { | |||||
this.loading = true; | |||||
return delOperationWarnconfig(ids); | |||||
}).then(() => { | |||||
this.loading = false; | |||||
this.getList(); | |||||
this.$modal.msgSuccess("删除成功"); | |||||
}).catch(() => { | |||||
}).finally(() => { | |||||
this.loading = false; | |||||
}); | |||||
const ids = row.id || this.ids | |||||
this.$modal | |||||
.confirm('是否确认删除预警配置编号为"' + ids + '"的数据项?') | |||||
.then(() => { | |||||
this.loading = true | |||||
return delOperationWarnconfig(ids) | |||||
}) | |||||
.then(() => { | |||||
this.loading = false | |||||
this.getList() | |||||
this.$modal.msgSuccess('删除成功') | |||||
}) | |||||
.catch(() => {}) | |||||
.finally(() => { | |||||
this.loading = false | |||||
}) | |||||
}, | }, | ||||
/** 导出按钮操作 */ | /** 导出按钮操作 */ | ||||
handleExport() { | handleExport() { | ||||
this.download('system/operationWarnconfig/export', { | |||||
...this.queryParams | |||||
}, `operationWarnconfig_${new Date().getTime()}.xlsx`) | |||||
this.download( | |||||
'system/operationWarnconfig/export', | |||||
{ | |||||
...this.queryParams | |||||
}, | |||||
`operationWarnconfig_${new Date().getTime()}.xlsx` | |||||
) | |||||
} | } | ||||
} | } | ||||
}; | |||||
} | |||||
</script> | </script> |
> | > | ||||
{{ scope.row.goodsSkuName }} | {{ scope.row.goodsSkuName }} | ||||
</el-link> | </el-link> | ||||
<em style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis;" :title="scope.row.remark">{{ scope.row.remark }}</em> | |||||
<em>{{ scope.row.goodsSkuSn }}</em> | <em>{{ scope.row.goodsSkuSn }}</em> | ||||
<em>¥{{ scope.row.initPrice }}</em> | <em>¥{{ scope.row.initPrice }}</em> | ||||
</div> | </div> | ||||
> | > | ||||
<template slot-scope="scope"> | <template slot-scope="scope"> | ||||
<el-button | <el-button | ||||
v-if="scope.row.status == 1" | |||||
v-if="scope.row.status == 0" | |||||
v-hasPermi="['system:operationWarnresult:edit']" | v-hasPermi="['system:operationWarnresult:edit']" | ||||
size="mini" | size="mini" | ||||
type="text" | type="text" |