|
|
@@ -0,0 +1,486 @@
|
|
|
+<template>
|
|
|
+ <section class="content">
|
|
|
+ <div
|
|
|
+ class="box-body"
|
|
|
+ v-loading.fullscreen="loading"
|
|
|
+ element-loading-text="请稍后..."
|
|
|
+ >
|
|
|
+ <el-form :inline="true" :model="formSearch" ref="primaryForm">
|
|
|
+ <el-row>
|
|
|
+ <el-form-item label="名称">
|
|
|
+ <el-input
|
|
|
+ class="input_width_lg"
|
|
|
+ placeholder="请输入参数名称"
|
|
|
+ v-model="formSearch.propKey"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="描述">
|
|
|
+ <el-input
|
|
|
+ class="input_width_lg"
|
|
|
+ placeholder="请输入参数描述"
|
|
|
+ v-model="formSearch.description"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <!-- <el-form-item label="类型">
|
|
|
+ <el-select
|
|
|
+ class="input"
|
|
|
+ :remote-method="getBasicDataTypes"
|
|
|
+ @focus="e => getBasicDataTypes(e.target.value)"
|
|
|
+ :loading="basicDataTypeLoading"
|
|
|
+ remote
|
|
|
+ filterable
|
|
|
+ clearable
|
|
|
+ v-model="formSearch.basicDataTypeCode"
|
|
|
+ placeholder="请选择参数类型"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in basicDataTypeList4Search"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.code"
|
|
|
+ :key="item.code"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>-->
|
|
|
+ <el-form-item label="参数值">
|
|
|
+ <el-input
|
|
|
+ class="input_width_lg"
|
|
|
+ placeholder="请输入参数值"
|
|
|
+ v-model="formSearch.propValue"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item>
|
|
|
+ <el-button
|
|
|
+ size="small"
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-search"
|
|
|
+ @click="handleSearchBtn"
|
|
|
+ >查询</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ size="small"
|
|
|
+ @click="resetPrimaryForm"
|
|
|
+ icon="el-icon-refresh"
|
|
|
+ >重置</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ size="small"
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-plus"
|
|
|
+ @click="insert"
|
|
|
+ >新增</el-button
|
|
|
+ >
|
|
|
+ </el-form-item>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <div class="block-seperator"></div>
|
|
|
+
|
|
|
+ <span>操作：</span>
|
|
|
+ <el-button
|
|
|
+ size="small"
|
|
|
+ type="danger"
|
|
|
+ @click="deleteIds"
|
|
|
+ :disabled="noBatchSelected"
|
|
|
+ icon="el-icon-delete"
|
|
|
+ >删除</el-button
|
|
|
+ >
|
|
|
+
|
|
|
+ <div style="width: 100%;margin-bottom: 10px;"></div>
|
|
|
+
|
|
|
+ <!-- 新增或修改弹出框 -->
|
|
|
+ <el-dialog
|
|
|
+ title="参数信息"
|
|
|
+ width="450px"
|
|
|
+ :visible.sync="sysPropDialog"
|
|
|
+ @close="dialogBeforeClose"
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ :inline="true"
|
|
|
+ inline-message
|
|
|
+ :model="sysPropForm"
|
|
|
+ ref="sysPropForm"
|
|
|
+ :rules="rules"
|
|
|
+ label-position="right"
|
|
|
+ label-width="90px"
|
|
|
+ >
|
|
|
+ <el-form-item label="名称" prop="propKey">
|
|
|
+ <el-input
|
|
|
+ :disabled="'modify' == operateType"
|
|
|
+ class="pull_length"
|
|
|
+ v-model="sysPropForm.propKey"
|
|
|
+ auto-complete="off"
|
|
|
+ placeholder="请输入参数名称"
|
|
|
+ maxlength="100"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="类型" prop="propValueType">
|
|
|
+ <el-select
|
|
|
+ class="pull_length"
|
|
|
+ :remote-method="getBasicDataTypes"
|
|
|
+ @focus="e => getBasicDataTypes(e.target.value)"
|
|
|
+ :loading="basicDataTypeLoading"
|
|
|
+ remote
|
|
|
+ filterable
|
|
|
+ clearable
|
|
|
+ v-model="sysPropForm.propValueType"
|
|
|
+ placeholder="请选择参数类型"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in basicDataTypeList4Search"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.code"
|
|
|
+ :key="item.code"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="参数值" prop="propValue">
|
|
|
+ <el-input
|
|
|
+ class="pull_length"
|
|
|
+ v-model="sysPropForm.propValue"
|
|
|
+ auto-complete="off"
|
|
|
+ placeholder="请输入参数值"
|
|
|
+ maxlength="100"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="描述" prop="description">
|
|
|
+ <el-input
|
|
|
+ class="pull_length"
|
|
|
+ v-model="sysPropForm.description"
|
|
|
+ auto-complete="off"
|
|
|
+ placeholder="请输入参数描述"
|
|
|
+ maxlength="100"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-row class="pull_center">
|
|
|
+ <el-button type="primary" @click="submitForm('sysPropForm')"
|
|
|
+ >保 存</el-button
|
|
|
+ >
|
|
|
+ <el-button @click="close">取 消</el-button>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 页面列表 -->
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ border
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
+ >
|
|
|
+ <el-table-column type="selection" width="35"></el-table-column>
|
|
|
+ <el-table-column prop="propKey" label="名称"></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="propValueType"
|
|
|
+ label="类型"
|
|
|
+ width="100"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column prop="propValue" label="参数值"></el-table-column>
|
|
|
+ <el-table-column prop="description" label="描述"></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ sortable
|
|
|
+ prop="updateTime"
|
|
|
+ label="更新时间"
|
|
|
+ width="170"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column label="操作" width="300">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ <el-button
|
|
|
+ size="mini"
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-edit"
|
|
|
+ @click="edit(scope.row)"
|
|
|
+ plain
|
|
|
+ >编辑</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ size="mini"
|
|
|
+ type="danger"
|
|
|
+ icon="el-icon-delete"
|
|
|
+ @click="deleteId(scope.row)"
|
|
|
+ >删除</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div class="page pull-right">
|
|
|
+ <el-pagination
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page="currentPage"
|
|
|
+ :page-size="pageSize"
|
|
|
+ :page-sizes="[10, 20, 50, 100]"
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ :total="total"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { CORE_API } from "@/constants/constants.js";
|
|
|
+import { mapState } from "vuex";
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "sys_prop_list",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ courseLoading: false,
|
|
|
+ formSearch: {
|
|
|
+ propKey: "",
|
|
|
+ propValueType: "",
|
|
|
+ propValue: "",
|
|
|
+ description: ""
|
|
|
+ },
|
|
|
+ sysPropForm: {
|
|
|
+ propKey: "",
|
|
|
+ propValueType: "",
|
|
|
+ propValue: "",
|
|
|
+ description: ""
|
|
|
+ },
|
|
|
+ sysPropDialog: false,
|
|
|
+ loading: false,
|
|
|
+ basicDataTypeLoading: false,
|
|
|
+ operateType: "add",
|
|
|
+ tableData: [],
|
|
|
+ currentPage: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ total: 10,
|
|
|
+ basicDataTypeList4Search: [],
|
|
|
+ multipleSelection: [],
|
|
|
+ rules: {
|
|
|
+ propKey: [
|
|
|
+ { required: true, message: "请输入参数名称", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ propValueType: [
|
|
|
+ { required: true, message: "请选择参数类型", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ propValue: [
|
|
|
+ { required: true, message: "请输入参数值", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ description: [
|
|
|
+ { required: true, message: "请输入参数描述", trigger: "blur" }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState({
|
|
|
+ user: state => state.user
|
|
|
+ }),
|
|
|
+ noBatchSelected() {
|
|
|
+ return this.multipleSelection.length === 0;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ dialogBeforeClose() {
|
|
|
+ this.$refs.sysPropForm.clearValidate();
|
|
|
+ },
|
|
|
+ handleSizeChange(val) {
|
|
|
+ this.pageSize = val;
|
|
|
+ this.searchForm();
|
|
|
+ },
|
|
|
+ resetPrimaryForm() {
|
|
|
+ this.formSearch = {
|
|
|
+ propKey: "",
|
|
|
+ propValueType: "",
|
|
|
+ propValue: "",
|
|
|
+ description: ""
|
|
|
+ };
|
|
|
+ this.$refs.primaryForm.resetFields();
|
|
|
+ },
|
|
|
+ getBasicDataTypes(query) {
|
|
|
+ this.basicDataTypeLoading = true;
|
|
|
+ this.$httpWithMsg
|
|
|
+ .get(CORE_API + "/systemProperty/getBasicDataTypes?name=" + query)
|
|
|
+ .then(response => {
|
|
|
+ this.basicDataTypeList4Search = response.data;
|
|
|
+ this.basicDataTypeLoading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleSearchBtn() {
|
|
|
+ this.currentPage = 1;
|
|
|
+ this.searchForm();
|
|
|
+ },
|
|
|
+ //查询
|
|
|
+ searchForm() {
|
|
|
+ let searchLock = true;
|
|
|
+ setTimeout(() => {
|
|
|
+ if (searchLock) {
|
|
|
+ this.loading = true;
|
|
|
+ }
|
|
|
+ }, 500);
|
|
|
+ var param = new URLSearchParams(this.formSearch);
|
|
|
+ var url =
|
|
|
+ CORE_API +
|
|
|
+ "/systemProperty/page/" +
|
|
|
+ (this.currentPage - 1) +
|
|
|
+ "/" +
|
|
|
+ this.pageSize +
|
|
|
+ "?" +
|
|
|
+ param;
|
|
|
+ this.$httpWithMsg
|
|
|
+ .get(url)
|
|
|
+ .then(response => {
|
|
|
+ console.log("response :", response);
|
|
|
+ this.tableData = response.data.content;
|
|
|
+ this.total = response.data.totalElements;
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ searchLock = false;
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.currentPage = val;
|
|
|
+ this.searchForm();
|
|
|
+ },
|
|
|
+ handleCourseCurrentChange(val) {
|
|
|
+ this.currentCoursePage = val;
|
|
|
+ this.searchCoursePage();
|
|
|
+ },
|
|
|
+ //全选
|
|
|
+ handleSelectionChange(val) {
|
|
|
+ this.multipleSelection = val;
|
|
|
+ },
|
|
|
+ //保存
|
|
|
+ submitForm(formData) {
|
|
|
+ this.$refs[formData].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ var url = CORE_API + "/systemProperty";
|
|
|
+ //修改
|
|
|
+ if ("modify" == this.operateType) {
|
|
|
+ this.$httpWithMsg.put(url, this.sysPropForm).then(
|
|
|
+ () => {
|
|
|
+ this.$notify({
|
|
|
+ type: "success",
|
|
|
+ message: "修改成功！"
|
|
|
+ });
|
|
|
+ this.searchForm();
|
|
|
+ this.sysPropDialog = false;
|
|
|
+ },
|
|
|
+ () => {
|
|
|
+ this.searchForm();
|
|
|
+ this.sysPropDialog = false;
|
|
|
+ }
|
|
|
+ );
|
|
|
+ }
|
|
|
+ //新增
|
|
|
+ else {
|
|
|
+ this.$httpWithMsg.post(url, this.sysPropForm).then(
|
|
|
+ () => {
|
|
|
+ this.$notify({
|
|
|
+ type: "success",
|
|
|
+ message: "新增成功！"
|
|
|
+ });
|
|
|
+ this.sysPropDialog = false;
|
|
|
+ this.searchForm();
|
|
|
+ },
|
|
|
+ () => {
|
|
|
+ this.sysPropDialog = false;
|
|
|
+ return this.searchForm();
|
|
|
+ }
|
|
|
+ );
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ console.log("error submit!");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ //重置
|
|
|
+ resetForm(formData) {
|
|
|
+ this.$refs[formData].resetFields();
|
|
|
+ },
|
|
|
+ close() {
|
|
|
+ this.sysPropDialog = false;
|
|
|
+ },
|
|
|
+ //新增
|
|
|
+ insert() {
|
|
|
+ this.operateType = "add";
|
|
|
+ this.sysPropForm.propKey = "";
|
|
|
+ this.sysPropForm.propValueType = "";
|
|
|
+ this.sysPropForm.propValue = "";
|
|
|
+ this.sysPropForm.description = "";
|
|
|
+
|
|
|
+ this.sysPropDialog = true;
|
|
|
+ },
|
|
|
+ //修改
|
|
|
+ edit(row) {
|
|
|
+ this.operateType = "modify";
|
|
|
+ this.sysPropForm = Object.assign({}, row);
|
|
|
+
|
|
|
+ this.sysPropDialog = true;
|
|
|
+ },
|
|
|
+ //删除
|
|
|
+ deleteId(row) {
|
|
|
+ this.$confirm("是否删除该条配置信息？", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "error"
|
|
|
+ }).then(() => {
|
|
|
+ var url = CORE_API + "/systemProperty/" + row.propKey;
|
|
|
+ this.$httpWithMsg.delete(url).then(() => {
|
|
|
+ this.$notify({
|
|
|
+ type: "success",
|
|
|
+ message: "删除成功！"
|
|
|
+ });
|
|
|
+ this.searchForm();
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //删除多条信息
|
|
|
+ deleteIds() {
|
|
|
+ if (this.multipleSelection.length === 0) {
|
|
|
+ this.$notify({
|
|
|
+ type: "warning",
|
|
|
+ message: "请选择要删除的配置"
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$confirm("是否删除这些配置信息？", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "error"
|
|
|
+ }).then(() => {
|
|
|
+ var ids = [];
|
|
|
+ for (var i = 0; i < this.multipleSelection.length; i++) {
|
|
|
+ ids.push(this.multipleSelection[i].propKey);
|
|
|
+ }
|
|
|
+ var url = CORE_API + "/systemProperty/" + ids;
|
|
|
+ this.$httpWithMsg.delete(url).then(() => {
|
|
|
+ this.$notify({
|
|
|
+ type: "success",
|
|
|
+ message: "删除成功！"
|
|
|
+ });
|
|
|
+ this.searchForm();
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ //初始化查询
|
|
|
+ created() {
|
|
|
+ this.searchForm();
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.page {
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.input_width_lg {
|
|
|
+ width: 180px;
|
|
|
+}
|
|
|
+.pull_center {
|
|
|
+ margin-left: 120px;
|
|
|
+}
|
|
|
+.pull_length {
|
|
|
+ width: 200px;
|
|
|
+}
|
|
|
+</style>
|
lideyin