配置管理调整 分享编辑页调整

src/views/games/details/settings/SettingPanel.vue

@@ -1,16 +1,26 @@
 <template>
   <div class="c-setting-panel">
     <el-row>
-      <el-col :span="14" class="p-r">
+      <el-col
+        :span="14"
+        class="p-r"
+      >
         <div class="al-c">
           <h3 class="fw-500">
             配置详情 - {{ type === 'normal' ? '普通配置' : '私有配置' }}
           </h3>
-          <span class="dis-b al-c mgb-20" style="color: #E6A23C">{{
+          <span
+            class="dis-b al-c mgb-20"
+            style="color: #E6A23C"
+          >{{
             tip
           }}</span>
         </div>
-        <el-form ref="settingForm" label-width="120px" :model="settingsForm">
+        <el-form
+          ref="settingForm"
+          label-width="120px"
+          :model="settingsForm"
+        >
           <el-form-item label="游戏">
             <el-input
               v-model="gameInfo.game_name"
@@ -32,6 +42,12 @@
               />
             </el-select>
           </el-form-item>
+          <div
+            v-if="showTip"
+            class="al-c mgt-20 mgb-20"
+          >
+            暂无配置，以下为默认添加项，请注意保存
+          </div>
           <template v-for="(item, index) in settingsForm.settings">
             <el-form-item
               :key="index"
@@ -57,9 +73,10 @@
                   style="width: 70%"
                   @change="changTip"
                 />
-                <el-button type="primary" @click="openEditor(index)"
+                <el-button
-                  >json</el-button
+                  type="primary"
-                >
+                  @click="openEditor(index)"
+                >json</el-button>
               </div>
               <div v-else>
                 <el-input
@@ -70,28 +87,23 @@
               </div>
             </el-form-item>
           </template>
-          <div
+
-            v-if="settingsForm.settings.length === 0"
-            class="al-c mgt-20 mgb-20"
-          >
-            暂无配置项
-          </div>
           <el-form-item>
             <el-button
               v-if="permEdit && this.platform_id"
               type="primary"
               @click="save"
-              >保存</el-button
+            >保存</el-button>
-            >
             <el-button
               v-if="permPublish && this.platform_id"
               type="warning"
               @click="publish"
-              >发布</el-button
+            >发布</el-button>
-            >
+            <el-button
-            <el-button v-if="permEdit && this.platform_id" @click="reset" type="success"
+              v-if="permEdit && this.platform_id"
-              >重置</el-button
+              @click="reset"
-            >
+              type="success"
+            >重置</el-button>
           </el-form-item>
         </el-form>
 
@@ -111,37 +123,47 @@
             value-key="key"
             @remove-tag="delSetting"
           >
-            <el-option
+
+            <el-tooltip
+              class="item"
+              :content="item.comment"
+              placement="left"
               v-for="item in settingsList"
               :key="item.key"
-              :label="`${item.value.title}(${item.key})`"
+              :disabled="!item.comment"
-              :value="item"
+            >
-              @click.native="clickOp(item)"
+              <el-option
-            />
+                :label="`${item.value.title}(${item.key})`"
+                :value="item"
+                @click.native="clickOp(item)"
+              />
+            </el-tooltip>
+
           </el-select>
           <div class="btn-group">
             <el-button
               type="success"
               size="small"
               @click="addSetting"
-              v-if="permEdit"
+              v-if="permSettings"
-              >添加新的配置项</el-button
+            >添加新的配置项</el-button>
-            >
             <el-button
               v-show="selectedSettings.length > 0"
               type="danger"
               size="small"
               @click="clearSettings"
               v-if="permEdit"
-              >清空</el-button
+            >清空</el-button>
-            >
           </div>
         </div>
       </el-col>
     </el-row>
 
     <!-- modal - editor -->
-    <el-dialog title="编辑 JSON" :visible.sync="modalEditorVisible">
+    <el-dialog
+      title="编辑 JSON"
+      :visible.sync="modalEditorVisible"
+    >
       <vue-json-editor
         v-model="json"
         lang="en"
@@ -152,7 +174,10 @@
 
       <div slot="footer">
         <el-button @click="closeEditorModal">取 消</el-button>
-        <el-button type="primary" @click="saveJson">确 定</el-button>
+        <el-button
+          type="primary"
+          @click="saveJson"
+        >确 定</el-button>
       </div>
     </el-dialog>
 
@@ -168,28 +193,65 @@
         :rules="newSettingRules"
         label-width="80px"
       >
-        <el-form-item label="名称" prop="value.title">
+        <el-form-item
+          label="名称"
+          prop="value.title"
+        >
           <el-input v-model="newSettingForm.value.title" />
         </el-form-item>
-        <el-form-item label="key" prop="key">
+        <el-form-item
+          label="key"
+          prop="key"
+        >
           <el-input v-model="newSettingForm.key" />
           <span class="ipt-tip">该值写入redis并传入客户端，请谨慎填写</span>
         </el-form-item>
-        <el-form-item label="值类型" prop="value.type">
+        <el-form-item
+          label="值类型"
+          prop="value.type"
+        >
           <el-select
             v-model="newSettingForm.value.type"
             placeholder="请选择值类型"
             style="width: 100%"
           >
-            <el-option label="布尔值" value="bool" />
+            <el-option
-            <el-option label="数值" value="num" />
+              label="布尔值"
-            <el-option label="字符串" value="string" />
+              value="bool"
+            />
+            <el-option
+              label="数值"
+              value="num"
+            />
+            <el-option
+              label="字符串"
+              value="string"
+            />
           </el-select>
+
+        </el-form-item>
+        <el-form-item
+          label="是否禁用"
+          prop="disabled"
+        >
+          <el-switch v-model="newSettingForm.disabled"></el-switch>
+        </el-form-item>
+        <el-form-item
+          label="说明"
+          prop="comment"
+        >
+          <el-input
+            type="textarea"
+            v-model="newSettingForm.comment"
+          />
         </el-form-item>
       </el-form>
       <div slot="footer">
         <el-button @click="closeNewSettingModal">取 消</el-button>
-        <el-button type="primary" @click="saveNewSetting">确 定</el-button>
+        <el-button
+          type="primary"
+          @click="saveNewSetting"
+        >确 定</el-button>
       </div>
     </el-dialog>
   </div>
@@ -230,6 +292,8 @@ export default {
       gameInfo: {},
       permEdit: false,
       permPublish: false,
+      permSettings: false,
+      showTip: false,
       // left
       tip: '',
       settingsForm: {
@@ -251,7 +315,9 @@ export default {
         value: {
           title: '',
           type: ''
-        }
+        },
+        disabled: false,
+        comment: ''
       },
       newSettingRules: {
         key: [{ required: true, message: '请输入 key 值', trigger: 'blur' }],
@@ -276,6 +342,9 @@ export default {
     this.permPublish =
       this.userInfo.permissions.includes(`${this.uid}-publish`) ||
       this.userInfo.permissions.includes(`games-writeable`)
+    this.permSettings =
+      this.userInfo.permissions.includes(`settings-writeable`) ||
+      this.userInfo.permissions.includes(`games-writeable`)
     this.getGameInfo(this.getGameSettings)
     this.getSettingsList()
   },
@@ -331,6 +400,35 @@ export default {
         this.settingKeys = data.records.map(item => {
           return item.key
         })
+
+        // 若无配置，默认添加必要选项
+        if (this.settingsForm.settings.length === 0) {
+          const defaultSettings = [
+            {
+              key: 'openAD',
+              title: '广告开关',
+              type: 'bool',
+              value: 1
+            },
+            {
+              key: 'blackTech',
+              title: '各种违规操作',
+              type: 'bool',
+              value: 1
+            },
+            {
+              key: 'isTestMode',
+              title: '测试开关',
+              type: 'bool',
+              value: 1
+            }
+          ]
+          this.showTip = true
+          this.settingsForm.settings = [...defaultSettings]
+          this.selectedSettings = [...defaultSettings]
+          this.settingKeys = ['openAD', 'blackTech', 'isTestMode']
+        }
+
         if (data.published === false) {
           this.tip = '配置已保存，待发布'
         } else if (data.published === true) {
@@ -423,7 +521,9 @@ export default {
                   })
                   return
                 }
+
                 this.$message.success('配置发布成功！')
+                this.showTip = false
                 this.tip = '配置已发布'
               })
             })
@@ -459,6 +559,7 @@ export default {
           }
           this.$message.success('配置保存成功！')
           this.tip = '配置已保存，待发布'
+          this.showTip = false
           this.changeState(false)
           resolve()
         })
@@ -479,7 +580,9 @@ export default {
           })
           return
         }
-        this.settingsList = data.records
+        this.settingsList = data.records.filter(item => {
+          return item.disabled !== true
+        })
       })
     },
     clearSettings() {
@@ -546,7 +649,9 @@ export default {
         value: {
           title: '',
           type: 'bool'
-        }
+        },
+        disabled: false,
+        comment: ''
       }
       this.modalNewSettingVisible = true
     },
@@ -562,7 +667,9 @@ export default {
               id: this.newSettingForm._id ? this.newSettingForm._id : '',
               key: this.newSettingForm.key,
               title: this.newSettingForm.value.title,
-              type: this.newSettingForm.value.type
+              type: this.newSettingForm.value.type,
+              disabled: this.newSettingForm.disabled,
+              comment: this.newSettingForm.comment
             }
           }).then(res => {
             const { data } = res
@@ -570,10 +677,22 @@ export default {
               this.$message.error(data.errmsg)
               return
             }
-            this.modalNewSettingVisible = false
+            closeNewSettingModal()
             this.$message.success('成功添加配置项！')
             this.getSettingsList()
           })
+
+          if (this.newSettingForm.disabled !== true) {
+            const newSetting = {
+              key: this.newSettingForm.key,
+              title: this.newSettingForm.value.title,
+              type: this.newSettingForm.value.type,
+              value: ''
+            }
+            this.settingsForm.settings.push(newSetting)
+            this.selectedSettings = [...this.settingsForm.settings]
+            this.settingKeys.push(newSetting.key)
+          }
         } else {
           this.$message.error('请按要求填写配置信息！')
           return false

src/views/games/details/share/edit.vue

@@ -74,10 +74,7 @@
         prop="default_share"
       >
         <el-switch v-model="shareForm.default_share" />
-        <span class="ipt-tip">设为默认分享, 那么在遇到该分享类型下没有满足条件的分享图,
+        <span class="ipt-tip">默认开启该项。</span>
-          会使用该分享图, 一种分享类型下只能有一条默认分享记录.
-          将当前记录变成默认分享后,
-          将移除这个游戏同分享类型下其他分享图的默认分享属性。</span>
       </el-form-item>
 
       <el-form-item
@@ -562,7 +559,7 @@ export default {
       // main
       shareForm: {
         platform_id: '',
-        default_share: false,
+        default_share: true,
         share_images: [],
         share_words: [],
         share_count: 0,

src/views/games/settings.vue

@@ -3,10 +3,17 @@
     <!-- toolbar -->
     <div class="toolbar clearfix">
       <div class="l fl">
-        <el-button v-if="permWriteable" type="primary" @click="addSetting">新增</el-button>
+        <el-button
+          v-if="permWriteable"
+          type="primary"
+          @click="addSetting"
+        >新增</el-button>
       </div>
       <div class="r fr">
-        <el-button type="primary" @click="refreshData">刷新</el-button>
+        <el-button
+          type="primary"
+          @click="refreshData"
+        >刷新</el-button>
       </div>
     </div>
     <!-- table -->
@@ -17,41 +24,149 @@
       class="table mgt-20 mgb-20"
       @row-click="rowClick"
     >
-      <el-table-column prop="value.title" label="名称" show-overflow-tooltip sortable/>
+      <el-table-column
-      <el-table-column prop="key" label="key" show-overflow-tooltip sortable/>
+        prop="value.title"
-      <el-table-column prop="value.type" label="值类型" show-overflow-tooltip sortable/>
+        label="名称"
-      <el-table-column v-if="permWriteable" prop="name" label="操作" fixed="right" width="55">
+        show-overflow-tooltip
+        sortable
+      />
+      <el-table-column
+        prop="key"
+        label="key"
+        show-overflow-tooltip
+        sortable
+      />
+      <el-table-column
+        prop="comment"
+        label="说明"
+        show-overflow-tooltip
+        sortable
+      />
+      <el-table-column
+        prop="value.type"
+        label="值类型"
+        show-overflow-tooltip
+        sortable
+      />
+      <el-table-column
+        prop="disabled"
+        label="状态"
+        show-overflow-tooltip
+        sortable
+      >
         <template slot-scope="scope">
-          <el-button type="text" size="small" @click.stop="editSetting(scope.row)">编辑</el-button>
+          <el-tag
+            type="danger"
+            v-if="scope.row.disabled"
+          >禁用</el-tag>
+          <el-tag
+            type="success"
+            v-else
+          >启用</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column
+        v-if="permWriteable"
+        prop="name"
+        label="操作"
+        fixed="right"
+        width="100"
+      >
+        <template slot-scope="scope">
+          <el-button
+            type="text"
+            size="small"
+            @click.stop="editSetting(scope.row)"
+          >编辑</el-button>
+          <el-button
+            type="text"
+            size="small"
+            v-if="!scope.row.disabled"
+            @click.stop="toggleStatus(scope.row, true)"
+          >禁用</el-button>
+          <el-button
+            type="text"
+            size="small"
+            v-if="scope.row.disabled === true"
+            @click.stop="toggleStatus(scope.row, false)"
+          >启用</el-button>
         </template>
       </el-table-column>
     </el-table>
     <!-- modal -->
-    <el-dialog title="编辑配置项" :visible.sync="modalVisible" :before-close="closeModal">
+    <el-dialog
-      <el-form ref="modalForm" :model="modalForm" :rules="modalRules" label-width="80px">
+      title="编辑配置项"
-        <el-form-item label="名称" prop="value.title">
+      :visible.sync="modalVisible"
-          <el-input v-model="modalForm.value.title"/>
+      :before-close="closeModal"
+    >
+      <el-form
+        ref="modalForm"
+        :model="modalForm"
+        :rules="modalRules"
+        label-width="80px"
+      >
+        <el-form-item
+          label="名称"
+          prop="value.title"
+        >
+          <el-input v-model="modalForm.value.title" />
         </el-form-item>
-        <el-form-item label="key" prop="key">
+        <el-form-item
-          <el-input v-model="modalForm.key" :disabled="!isNew"/>
+          label="key"
+          prop="key"
+        >
+          <el-input
+            v-model="modalForm.key"
+            :disabled="!isNew"
+          />
           <span class="ipt-tip">该值写入redis并传入客户端，请谨慎填写</span>
         </el-form-item>
-        <el-form-item label="值类型" prop="value.type">
+        <el-form-item
+          label="值类型"
+          prop="value.type"
+        >
           <el-select
             v-model="modalForm.value.type"
             placeholder="请选择值类型"
             style="width: 100%"
             :disabled="!isNew"
           >
-            <el-option label="布尔值" value="bool"/>
+            <el-option
-            <el-option label="数值" value="num"/>
+              label="布尔值"
-            <el-option label="字符串" value="string"/>
+              value="bool"
+            />
+            <el-option
+              label="数值"
+              value="num"
+            />
+            <el-option
+              label="字符串"
+              value="string"
+            />
           </el-select>
         </el-form-item>
+        <el-form-item
+          label="是否禁用"
+          prop="disabled"
+        >
+          <el-switch v-model="modalForm.disabled"></el-switch>
+        </el-form-item>
+        <el-form-item
+          label="说明"
+          prop="comment"
+        >
+          <el-input
+            type="textarea"
+            v-model="modalForm.comment"
+          />
+        </el-form-item>
       </el-form>
       <div slot="footer">
         <el-button @click="closeModal">取 消</el-button>
-        <el-button type="primary" @click="saveEdit">确 定</el-button>
+        <el-button
+          type="primary"
+          @click="saveEdit"
+        >确 定</el-button>
       </div>
     </el-dialog>
   </div>
@@ -74,6 +189,8 @@ export default {
       modalForm: {
         _id: '',
         key: '',
+        comment: '',
+        disabled: false,
         value: {
           title: '',
           type: 'bool'
@@ -122,13 +239,52 @@ export default {
           })
           return
         }
-        this.tableData = data.records
+        this.tableData = data.records.sort((a, b) => {
+          return !!a.disabled - !!b.disabled
+        })
         this.isLoaded = false
       })
     },
     editSetting(row) {
       this.openModal(false, row)
     },
+    toggleStatus(row, disabled) {
+      const toStatus = disabled ? '禁用' : '启用'
+      this.$confirm(`是否${toStatus}配置项${row.value.title}`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.modalForm = JSON.parse(JSON.stringify(row))
+          this.modalForm.disabled = disabled
+          saveSettingItem({
+            record: {
+              id: this.modalForm._id ? this.modalForm._id : '',
+              key: this.modalForm.key,
+              title: this.modalForm.value.title,
+              type: this.modalForm.value.type,
+              comment: this.modalForm.comment,
+              disabled: this.modalForm.disabled
+            }
+          }).then(res => {
+            const { data } = res
+            if (data.errcode !== 0) {
+              this.$message.error(data.errmsg)
+              return
+            }
+            const successText = this.isNew
+              ? '配置项添加成功！'
+              : '配置项修改成功'
+            this.$message.success(successText)
+            this.refreshData()
+          })
+        })
+        .catch(err => {
+          console.log(err)
+          this.$message.info('操作已取消！')
+        })
+    },
     // modal
     openModal(isNew, data) {
       if (isNew) {
@@ -139,7 +295,9 @@ export default {
           value: {
             title: '',
             type: ''
-          }
+          },
+          comment: '',
+          disabled: false
         }
       } else {
         this.isNew = false
@@ -154,12 +312,18 @@ export default {
     saveEdit() {
       this.$refs['modalForm'].validate(valid => {
         if (valid) {
+          if (this.modalForm.comment === undefined) this.modalForm.comment = ''
+          if (this.modalForm.disabled === undefined)
+            this.modalForm.disabled = false
+
           saveSettingItem({
             record: {
               id: this.modalForm._id ? this.modalForm._id : '',
               key: this.modalForm.key,
               title: this.modalForm.value.title,
-              type: this.modalForm.value.type
+              type: this.modalForm.value.type,
+              comment: this.modalForm.comment,
+              disabled: this.modalForm.disabled
             }
           }).then(res => {
             const { data } = res