|
@@ -1,85 +1,173 @@
|
|
|
<template>
|
|
|
- <div class="app-container">
|
|
|
- <el-form ref="form" :model="form" label-width="120px">
|
|
|
- <el-form-item label="Activity name">
|
|
|
- <el-input v-model="form.name" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="Activity zone">
|
|
|
- <el-select v-model="form.region" placeholder="please select your zone">
|
|
|
- <el-option label="Zone one" value="shanghai" />
|
|
|
- <el-option label="Zone two" value="beijing" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="Activity time">
|
|
|
- <el-col :span="11">
|
|
|
- <el-date-picker v-model="form.date1" type="date" placeholder="Pick a date" style="width: 100%;" />
|
|
|
- </el-col>
|
|
|
- <el-col :span="2" class="line">-</el-col>
|
|
|
- <el-col :span="11">
|
|
|
- <el-time-picker v-model="form.date2" type="fixed-time" placeholder="Pick a time" style="width: 100%;" />
|
|
|
- </el-col>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="Instant delivery">
|
|
|
- <el-switch v-model="form.delivery" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="Activity type">
|
|
|
- <el-checkbox-group v-model="form.type">
|
|
|
- <el-checkbox label="Online activities" name="type" />
|
|
|
- <el-checkbox label="Promotion activities" name="type" />
|
|
|
- <el-checkbox label="Offline activities" name="type" />
|
|
|
- <el-checkbox label="Simple brand exposure" name="type" />
|
|
|
- </el-checkbox-group>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="Resources">
|
|
|
- <el-radio-group v-model="form.resource">
|
|
|
- <el-radio label="Sponsor" />
|
|
|
- <el-radio label="Venue" />
|
|
|
- </el-radio-group>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="Activity form">
|
|
|
- <el-input v-model="form.desc" type="textarea" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <el-button type="primary" @click="onSubmit">Create</el-button>
|
|
|
- <el-button @click="onCancel">Cancel</el-button>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
+ <div>
|
|
|
+ <el-row class="ml-5" style="margin-bottom: 20px">
|
|
|
+ <el-col :span="2">
|
|
|
+ <div class="">
|
|
|
+ <div class="block-title">系统参数</div>
|
|
|
+ <div class="totalCount-text">
|
|
|
+ 参数数量:{{ this.tableData.length }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <!-- <el-col :span="5">
|
|
|
+ <el-input
|
|
|
+ clearable
|
|
|
+ prefix-icon="el-icon-search"
|
|
|
+ type="text"
|
|
|
+ placeholder="搜索系统参数"
|
|
|
+ style="width: 275px; border-radius: 30px"
|
|
|
+ v-model="searchParam"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="14">
|
|
|
+ <el-button
|
|
|
+ icon="el-icon-search"
|
|
|
+ class="btn-filter"
|
|
|
+ @click="getParamList"
|
|
|
+ >
|
|
|
+ 筛选
|
|
|
+ </el-button>
|
|
|
+ </el-col> -->
|
|
|
+ <el-col :span="3" :offset="19">
|
|
|
+ <el-button type="primary" class="btn-add" @click="addParamBtn">
|
|
|
+ 添加参数
|
|
|
+ </el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col>
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ style="width: 100%"
|
|
|
+ :header-cell-style="{
|
|
|
+ fontSize: '12px',
|
|
|
+ fontFamily: 'hm-regular',
|
|
|
+ fontWeight: 400,
|
|
|
+ textAlign: 'LEFT',
|
|
|
+ color: '#888888',
|
|
|
+ lineHeight: '12px',
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <el-table-column prop="paramName" label="参数名称" width="">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="paramValue" label="参数值"> </el-table-column>
|
|
|
+ <el-table-column prop="systemName" label="系统名称">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="createTime" label="创建时间">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="updateTime" label="修改时间">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="paramNote" label="备注"> </el-table-column>
|
|
|
+ <el-table-column label="操作">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button
|
|
|
+ type="text"
|
|
|
+ @click="handleEdit(scope.$index, scope.row)"
|
|
|
+ class="fs-14 bold blue"
|
|
|
+ >编辑
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ type="text"
|
|
|
+ @click="handleDelete(scope.$index, scope.row)"
|
|
|
+ class="fs-14 bold color-red"
|
|
|
+ >删除
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-pagination
|
|
|
+ style="margin-top: 20px"
|
|
|
+ class="float-right"
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page.sync="page"
|
|
|
+ :page-sizes="[10, 20, 30, 40]"
|
|
|
+ :page-size.sync="pageSize"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ :total="totalCount"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <save-or-update ref="SaveOrUpdate" />
|
|
|
</div>
|
|
|
</template>
|
|
|
-
|
|
|
<script>
|
|
|
+import SaveOrUpdate from "./SaveOrUpdate.vue";
|
|
|
+import { pageParam, deleteParam } from "@/api/param";
|
|
|
+import constant from "@/api/constant";
|
|
|
export default {
|
|
|
+ components: { SaveOrUpdate },
|
|
|
data() {
|
|
|
return {
|
|
|
- form: {
|
|
|
- name: '',
|
|
|
- region: '',
|
|
|
- date1: '',
|
|
|
- date2: '',
|
|
|
- delivery: false,
|
|
|
- type: [],
|
|
|
- resource: '',
|
|
|
- desc: ''
|
|
|
- }
|
|
|
- }
|
|
|
+ page: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ totalCount: 0,
|
|
|
+ searchParam: undefined,
|
|
|
+ systemId: constant.systemId,
|
|
|
+ param: {},
|
|
|
+ tableData: [],
|
|
|
+ };
|
|
|
},
|
|
|
methods: {
|
|
|
- onSubmit() {
|
|
|
- this.$message('submit!')
|
|
|
+ handleSizeChange(val) {
|
|
|
+ this.pageSize = val;
|
|
|
+ this.page = 1;
|
|
|
+ this.getParamList();
|
|
|
},
|
|
|
- onCancel() {
|
|
|
- this.$message({
|
|
|
- message: 'cancel!',
|
|
|
- type: 'warning'
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.page = val;
|
|
|
+ this.getParamList();
|
|
|
+ },
|
|
|
+ getParamList() {
|
|
|
+ pageParam({
|
|
|
+ page: this.page,
|
|
|
+ pageSize: this.pageSize,
|
|
|
+ paramName: this.searchParam,
|
|
|
+ systemId: this.systemId,
|
|
|
+ }).then((res) => {
|
|
|
+ this.tableData = res.records;
|
|
|
+ this.totalCount = res.total;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ addParamBtn() {
|
|
|
+ this.$refs.SaveOrUpdate.isSave = true;
|
|
|
+ this.$refs.SaveOrUpdate.paramModal = true;
|
|
|
+ // this.$refs.SaveOrUpdate.resetForm();
|
|
|
+ this.$refs.SaveOrUpdate.param.systemParamId = undefined;
|
|
|
+ this.$refs.SaveOrUpdate.param.paramName = undefined;
|
|
|
+ this.$refs.SaveOrUpdate.param.paramValue = undefined;
|
|
|
+ this.$refs.SaveOrUpdate.param.systemId = constant.systemId;
|
|
|
+ this.$refs.SaveOrUpdate.param.paramNote = undefined;
|
|
|
+ },
|
|
|
+ handleEdit(index, row) {
|
|
|
+ this.$refs.SaveOrUpdate.isSave = false;
|
|
|
+ this.$refs.SaveOrUpdate.paramModal = true;
|
|
|
+ Object.assign(this.$refs.SaveOrUpdate.param, row);
|
|
|
+ },
|
|
|
+ handleDelete(index, row) {
|
|
|
+ this.$confirm("此操作将永久删除此系统参数信息, 是否继续?", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
})
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</script>
|
|
|
-
|
|
|
-<style scoped>
|
|
|
-.line{
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-</style>
|
|
|
-
|
|
|
+ .then(() => {
|
|
|
+ deleteParam(row.systemParamId).then(() => {
|
|
|
+ this.$message.success("删除成功");
|
|
|
+ this.getParamList();
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: "info",
|
|
|
+ message: "已取消删除",
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getParamList();
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|