app-cfg.html 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <title>应用对公配置</title>
  6. <!-- 所有的 css js 资源 -->
  7. <link rel="stylesheet" href="../../static/kj/element-ui/theme-chalk/index.css">
  8. <link rel="stylesheet" href="../../static/sa.css">
  9. <script src="../../static/kj/vue.min.js"></script>
  10. <script src="../../static/kj/element-ui/index.js"></script>
  11. <script src="https://unpkg.com/jquery@3.4.1/dist/jquery.js"></script>
  12. <script src="../../static/kj/layer/layer.js"></script>
  13. <script src="../../static/sa.js"></script>
  14. <script src="../../static/kj/upload-util.js"></script>
  15. <style type="text/css">
  16. html, body, .vue-box {
  17. height: 100%;
  18. overflow: hidden;
  19. }
  20. /* .vue-box{padding: 0px;} */
  21. .c-panel {
  22. height: calc(100% - 4em);
  23. position: relative;
  24. }
  25. .c-panel .c-label {
  26. width: 10em;
  27. }
  28. .c-panel .el-input {
  29. width: 500px;
  30. }
  31. .c-panel .el-textarea {
  32. width: 500px;
  33. }
  34. .logo-img {
  35. width: 35px;
  36. height: 35px;
  37. border-radius: 2px;
  38. vertical-align: middle;
  39. margin-right: 0.5em;
  40. cursor: pointer;
  41. }
  42. .s-tab {
  43. height: 100%;
  44. }
  45. .el-tabs__content {
  46. height: calc(100% - 130px);
  47. overflow: auto;
  48. }
  49. </style>
  50. </head>
  51. <body>
  52. <div class="vue-box" style="display: none;" :style="'display: block;'">
  53. <div class="c-panel" v-if="m != null">
  54. <!-- tab卡片 -->
  55. <el-tabs class="s-tab" v-model="activeTab">
  56. <!-- ---------------------------------- 系统参数 ---------------------------------- -->
  57. <el-tab-pane label="系统参数" name="tab1">
  58. <div class="c-item br">
  59. <label class="c-label">系统logo:</label>
  60. <img :src="m.logoUrl" class="logo-img" v-if="sa.isNull(m.logoUrl) == false"
  61. @click="sa.showImage(m.logoUrl, '400px', '400px')">
  62. <el-link type="primary" @click="sa.uploadImage(src => {m.logoUrl = src; sa.ok2('上传成功');})">选择上传
  63. </el-link>
  64. </div>
  65. <div class="c-item br">
  66. <label class="c-label">系统名称:</label>
  67. <el-input v-model="m.appName"></el-input>
  68. </div>
  69. <div class="c-item br">
  70. <label class="c-label">版本编号:</label>
  71. <el-input v-model="m.appVersionNo"></el-input>
  72. </div>
  73. <div class="c-item br">
  74. <label class="c-label">更新描述:</label>
  75. <el-input v-model="m.appVersionLog"></el-input>
  76. </div>
  77. </el-tab-pane>
  78. <!-- ---------------------------------- 其它配置 ---------------------------------- -->
  79. <el-tab-pane label="其它配置" name="tab2">
  80. <br>
  81. <span>其它配置</span>
  82. </el-tab-pane>
  83. </el-tabs>
  84. <!-- 确定按钮 -->
  85. <div style="position: absolute; bottom: 0px; width: calc(100% - 3em); line-height: 80px; background-color: #FFF;">
  86. <hr style="height: 2px;">
  87. <div class="c-item">
  88. <label class="c-label"></label>
  89. <el-button type="primary" icon="el-icon-check" @click="ok">保存修改</el-button>
  90. <el-button type="primary" icon="el-icon-refresh-right" @click="f5">重置</el-button>
  91. </div>
  92. </div>
  93. </div>
  94. </div>
  95. <script type="text/javascript">
  96. // 创建一个默认的配置对象
  97. function create_m() {
  98. return {
  99. logoUrl: '', // 系统logo地址
  100. appName: 'sa-plus快速开发框架',// 系统名称
  101. appVersionNo: 'v1.0.0', // 系统版本
  102. appVersionLog: '更新于2099-10-1', // 更新日志
  103. }
  104. }
  105. </script>
  106. <script>
  107. var app = new Vue({
  108. el: '.vue-box',
  109. data: {
  110. sa: sa, // 超级对象
  111. m: null, //
  112. activeTab: 'tab1', // 当前显示的tab
  113. textareaCfg: {minRows: 3, maxRows: 14} // 文本域的默认配置
  114. },
  115. methods: {
  116. // 初始化配置
  117. init: function (str) {
  118. // 获取
  119. var cfg = sa.JSONParse(str, {}); // 用户配置
  120. var default_cfg = create_m(); // 默认配置
  121. // 遍历
  122. for (var key in default_cfg) {
  123. if (cfg[key] !== undefined && cfg[key] !== null) {
  124. default_cfg[key] = cfg[key];
  125. }
  126. }
  127. // 赋值
  128. this.m = default_cfg;
  129. },
  130. // 刷新
  131. f5: function () {
  132. sa.ajax('/SpCfg/getCfg', {cfgName: 'app_cfg'}, function (res) {
  133. this.init(res.data);
  134. }.bind(this));
  135. },
  136. // 提交
  137. ok: function () {
  138. sa.ajax('/SpCfg/updateCfg', {cfgName: 'app_cfg', cfgValue: JSON.stringify(this.m)}, function (res) {
  139. sa.ok2('保存成功');
  140. }.bind(this));
  141. },
  142. },
  143. created: function () {
  144. this.f5();
  145. }
  146. })
  147. </script>
  148. </body>
  149. </html>