系统基础设置

fhKeeper/formulahousekeeper/timesheet-workshop/src/views/settings/settings.vue

@@ -0,0 +1,214 @@
+<template>
+    <section >
+        <el-col :span="24" class="toolbar" style="padding-bottom: 0px;position:sticky;top:0;z-index:1002">
+            <el-form :inline="true">
+                <el-form-item :label="$t('navigation.basicSystemSettings')"> 
+                </el-form-item>
+                <el-form-item  style="float:right">
+                    <el-button  type="primary" @click="submitInsert" :loading="addLoading">{{ $t('save') }}</el-button>
+                </el-form-item>
+            </el-form>
+        </el-col>
+        <div >
+            <el-form style="padding:35px;">
+                <el-form-item label="应用名称"  > 
+                    <el-input v-model="appName" :maxlength="25" style="width:400px;"></el-input>
+                </el-form-item>
+                <el-form-item label="应用LOGO" >
+                    <!-- <el-upload
+                        list-type="picture-card"
+                        :http-request="(file) => {return addImg(file, index)}"
+                        :on-preview="(file) => {return handlePictureCardPreview(file, index)}"
+                        :before-remove="(file, fileList) => {return delImg(file, fileList, index)}"
+                        :file-list="domain.imgListUrl" :limit="9"
+                        :disabled="workForm.domains[index].state>=2?false:true">
+                        <i class="el-icon-plus"></i>
+                    </el-upload> -->
+                    <el-upload
+                        class="avatar-uploader"
+                        :show-file-list="false"
+                        :http-request="(file) => {return addImg(file)}"
+                        :on-success="handleAvatarSuccess"
+                        :before-upload="beforeAvatarUpload">
+                    <img v-if="appLogo" :src="'/upload/'+appLogo" class="avatar">
+                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                    </el-upload>
+                </el-form-item>
+            </el-form>
+        </div>
+        <div style="width:80px;margin:0 auto;padding:20px;">
+            <el-button  type="primary" @click="submitInsert" :loading="addLoading">{{ $t('save') }}</el-button>
+        </div>
+    </section>
+</template>
+<script>
+    import util from "../../common/js/util";
+    // 引入自定义级联组件
+    import vueCascader from "@/components/cascader.vue"
+    
+    export default {
+        components: {
+            vueCascader
+        },
+        data() {
+            return {
+                appName: null,
+                appLogo: null,
+            };
+        },
+        watch: {
+            filterText(val) {
+                this.$refs.whiteListTree.filter(val);
+            }
+        },
+        created() {
+            let height = window.innerHeight;
+            this.tableHeight = height - 195;
+            const that = this;
+            window.onresize = function temp() {
+                that.tableHeight = window.innerHeight - 195;
+            };
+        },
+        mounted() {
+            this.getSettings();
+        },
+         methods: {
+            addImg(e) {
+                let formData = new FormData()
+                formData.append('multipartFile', e.file)
+                this.http.uploadFile('/common/uploadFile', formData,
+                res => {
+                    if (res.code == "ok") {
+                        this.appLogo = res.data;
+                    } else {
+                        this.$message({message: res.msg,type: "error"});
+                    }
+                },
+                error => {this.$message({message: error,type: "error"});
+                });
+            },
+            handleAvatarSuccess(res, file) {
+                // this.appLogo = URL.createObjectURL(file.raw);
+            },
+            getSettings() {
+                this.http.post('/sys-config/getAppSetting', {},
+                res => {
+                    if (res.code == "ok") {
+                        this.appName = res.data.appName;
+                        this.appLogo = res.data.appLogo;
+                    } else {
+                        this.$message({
+                            message: res.msg,
+                            type: "error"
+                        });
+                    }
+                },
+                error => {
+                    this.$message({
+                        message: error,
+                        type: "error"
+                    });
+                });
+            },
+            fileUpload(file) {
+                //首先判断文件类型
+                console.log(file)
+                let str = file.file.name.split(".");
+                let indexLi = file.action
+                let format = str[str.length - 1];
+                if (format != "jpg" && format != "jpeg" && format != "png") {
+                    this.$message({
+                        message: "请选择.jpg或.jpeg文件",
+                        type: "error"
+                    });
+                } else {
+                    let formData = new FormData();
+                    formData.append("multipartFile", file.file);
+                    this.http.uploadFile('/common/uploadFile', formData,
+                    res => {
+                        if (res.code == "ok") {
+                            this.dataList[indexLi].valuelist.push(res.data)
+                            this.$forceUpdate()
+                            this.$message({
+                                message: "上传成功",
+                                type: "success"
+                            });
+                        } else {
+                            this.$message({
+                                message: res.msg,
+                                type: "error"
+                            });
+                        }
+                    },
+                    error => {
+                        this.$message({
+                            message: error,
+                            type: "error"
+                        });
+                    });
+                }
+            },
+            
+            beforeAvatarUpload(file) {
+                const isLt2M = file.size / 1024 / 1024 < 10;
+                if (!isLt2M) {
+                    this.$message.error('上传图片大小不能超过 10MB!');
+                }
+                return isLt2M;
+            },
+            
+            submitInsert() {
+                this.http.post('/sys-config/saveAppSetting', {
+                    appName: this.appName,
+                    appLogo: this.appLogo,
+                },
+                res => {
+                    if (res.code == "ok") {
+                        this.$message({
+                            message: '保存成功',
+                            type: "success"
+                        });
+                    } else {
+                        this.$message({
+                            message: res.msg,
+                            type: "error"
+                        });
+                    }
+                },
+                error => {
+                    this.$message({
+                        message: error,
+                        type: "error"
+                    });
+                });
+            },
+
+        },
+    };
+</script>
+
+<style >
+.avatar-uploader .el-upload {
+    border: 1px dashed #d9d9d9;
+    border-radius: 6px;
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+  }
+  .avatar-uploader .el-upload:hover {
+    border-color: #409EFF;
+  }
+  .avatar-uploader-icon {
+    font-size: 28px;
+    color: #8c939d;
+    width: 178px;
+    height: 178px;
+    line-height: 178px;
+    text-align: center;
+  }
+  .avatar {
+    width: 178px;
+    height: 178px;
+    display: block;
+  }
+</style>