<template>
  <view class="msg-container">
    <view class="oa-header-section">提醒设置：关闭后，仍会接收此消息，但不进行消息接收提示</view>
    <view class="oa-content-section">
      <view class="menu-list mt0 mlr0">
        <view class="list-cell" v-for="(item, index) in modeList" :key="index">
          <view class="menu-item">
            <view class="title" style="width: 100%">{{ proxy.$common.mapping("label", "value", index.toString(), dictList) }}</view>
            <u-switch v-model="modeList[index]" size="20" @change="changeMode(modeList)"></u-switch>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>
<script setup>
/*----------------------------------依赖引入-----------------------------------*/
import { onLoad, onShow } from "@dcloudio/uni-app";
import { reactive, getCurrentInstance, toRefs, inject } from "vue";
/*----------------------------------接口引入-----------------------------------*/
import { getMceSettingInfo, addMceSetting } from "@/api/mine/info.js";
/*----------------------------------组件引入-----------------------------------*/
/*----------------------------------store引入-----------------------------------*/
/*----------------------------------公共方法引入-----------------------------------*/
/*----------------------------------公共变量-----------------------------------*/
const { proxy } = getCurrentInstance();
const { message_type } = proxy.useDict("message_type");
/*----------------------------------变量声明-----------------------------------*/
const state = reactive({
  id: "",
  modeType: "",
  modeList: [],
  dictList: [],
});
const { id, modeList, modeType, dictList } = toRefs(state);

/**
 * @初始化
 */
function init() {
  getMceSettingInfo().then((res) => {
    //#ifdef APP-PLUS
    modeList.value = res.data.appMode;
    modeType.value = "appMode";
    //#endif
    //#ifdef H5 || MP-WEIXIN
    modeList.value = res.data.wcMode;
    modeType.value = "wcMode";
    //#endif
    id.value = res.data.id;
    dictList.value = message_type.value;
  });
}
/**
 * @通知状态变更
 */
function changeMode() {
  addMceSetting({
    id: id.value,
    [modeType.value]: JSON.stringify(modeList.value),
  }).then((response) => {
    proxy.$modal.msg("修改成功");
    init();
  });
}

onLoad(() => {
  init();
});

onShow(() => {
  //调用系统主题颜色
  proxy.$settingStore.systemThemeColor([1]);
});
</script>
<style lang="scss" scoped>
.oa-header-section {
  background: #f9f9f9;
  color: #7d7e7e;
  padding: 10px 18px;
  font-size: $uni-font-size-sm;
}
</style>
