<!--
 * @Descripttion: 当前组件信息
 * @version: 1.0.0
 * @Author: 无尘
 * @Date: 2019-03-20 14:36:37
 * @LastEditors: 无尘
 * @LastEditTime: 2020-12-03 15:26:58
 -->
<template>
  <div class="daily-set-wrap">
    <div class="company-set-content border-box">
      <div class="company-title m-b-20 flex flex-space-between">
        <div class="line-h-32">
          <span class="color-303133 font-14 font-w-600">企业微信基本信息</span>
          <el-button v-if="$getButtonLimit($buttonCode.refreshStoreInfo)" :limit-code="$buttonCode.refreshStoreInfo" class="m-l-20" type="text" @click="refeshData">同步刷新 </el-button>
        </div>
        <div>
          <set-tip v-if="!checkShow" :tipText="tipText"></set-tip>
        </div>
      </div>
      <div class="company-info-body">
        <el-form ref="form" :model="form" label-width="105px">
          <!-- <el-form-item label="小程序版本">
            <span class="font-14 color-303133">{{ companyObj.smallVersion || '免费版' }}</span>
          </el-form-item> -->
          <el-form-item label="企业名称">
            <span class="font-14 color-303133 p-r-10">{{ companyObj.corpName }}</span>
            <el-tag> {{ companyObj.contactFlag == 1 ? '已认证' : '未认证' }}</el-tag
            ><span v-if="companyObj.contactFlag == 1" class="p-l-10 font-12 color-909399">认证到期 {{ companyObj.verifiedEndTime | timeStampToYmd }}</span>
          </el-form-item>
          <el-form-item label="企业ID">
            <span class="font-14 color-303133">{{ companyObj.corpid }}</span>
          </el-form-item>
          <el-form-item label="行业类型">
            <span class="font-14 color-303133">{{ companyObj.corpIndustry }} / {{ companyObj.corpSubIndustry }}</span>
          </el-form-item>
          <el-form-item label="人员规模">
            <span class="font-14 color-303133">{{ companyObj.corpScale }}</span>
          </el-form-item>
          <el-form-item label="地址">
            <span class="font-14 color-303133">{{ companyObj.location }}</span>
          </el-form-item>
        </el-form>
      </div>
    </div>
    <div class="company-set-content border-box">
      <div class="company-title m-b-20 m-t-30"><span class="color-303133 font-14 font-w-600">客户密钥维护</span></div>
      <div class="company-info-body secret-body">
        <div class="m-b-20 secret-cell">
          <span class="inline-block w-127">
            <el-tooltip class="item" effect="dark" content="企业微信中【客户联系】API中若更新secret，请复制后更新至此处。首次使用好办请输入。" placement="top-start"> <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;" class="font-14 color-606266">客户联系secret：</span></el-tooltip>
          </span>
          <el-input class="m-l-10 w-399" maxlength="200" v-model="wxObj.secretVal" placeholder="必填"></el-input>
          <el-button v-if="$getButtonLimit($buttonCode.saveMemberSecret)" :limit-code="$buttonCode.saveMemberSecret" class="m-l-20" type="text" @click="saveSecret('1')">保存</el-button><span v-if="wxObj.updateTime" class="m-l-20 font-12 color-909399">最后一次保存：{{ wxObj.updateTime | formatTimeStamp }}</span
          ><span class="m-l-37 font-14 color-303133"
            ><span :class="['iconfont-hb3', wxObj.checkFlag ? 'color-49c958 iconchenggong' : 'color-f83431 iconshibai']"></span><span class="p-l-10">{{ wxObj.checkFlag ? '校验成功' : '校验失败' }}</span></span
          >
          <div v-if="showWxError" class="el-form-item__error m-l-137">请填写客户联系 secret</div>
        </div>
        <!-- <div class="m-b-20 secret-cell">
          <span class="inline-block w-127">
            <el-tooltip class="item" effect="dark" placement="top-start">
              <div slot="content">企业微信中通讯录同步若更新secret，请复制后更新至此处。<br />因获取Secret而获取通讯录的相关信息。首次使用好办请输入。<br />若发生相关变更，与企业微信无关，特此告知！</div>
              <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;" class="font-14 color-606266">通讯录secret：</span>
            </el-tooltip>
          </span>
          <el-input class="m-l-10 w-399" maxlength="200" v-model="contactObj.secretVal" placeholder="非必填"></el-input>
          <el-button class="m-l-20" type="text" @click="saveSecret('2')">保存</el-button><span v-if="contactObj.updateTime" class="m-l-20 font-12 color-909399">最后一次保存：{{ contactObj.updateTime | formatTimeStamp }}</span
          ><span class="m-l-37 font-14 color-303133"
            ><span :class="['iconfont-hb3', contactObj.checkFlag ? 'color-49c958 iconchenggong' : 'color-f83431 iconshibai']"></span><span class="p-l-10">{{ contactObj.checkFlag ? '校验成功' : '校验失败' }}</span></span
          >
        </div> -->
        <div class="m-b-20 secret-cell" v-show="haobanObj.secretVal">
          <span class="inline-block w-127">
            <el-tooltip class="item" effect="dark" content="用于获取登录小程序用户的手机号/姓名/部门信息" placement="top-start"> <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;" class="font-14 color-606266">好办助手secret：</span></el-tooltip>
          </span>
          <el-input class="m-l-10 w-399" maxlength="200" v-model="haobanObj.secretVal" placeholder="必填"></el-input>
          <el-button class="m-l-20" type="text" @click="saveSecret('3')">保存</el-button>
          <el-button class="m-l-20" type="text" @click="delSecret">删除</el-button>
          <span v-if="haobanObj.updateTime" class="m-l-20 font-12 color-909399">最后一次保存：{{ haobanObj.updateTime | formatTimeStamp }}</span>
          <span class="m-l-37 font-14 color-303133">
            <span :class="['iconfont-hb3', haobanObj.checkFlag ? 'color-49c958 iconchenggong' : 'color-f83431 iconshibai']"></span>
            <span class="p-l-10">{{ haobanObj.checkFlag ? '校验成功' : '校验失败' }}</span>
          </span>
          <div v-if="showHaobanError" class="el-form-item__error m-l-137">请填写好办助手 secret</div>
        </div>
        <!-- <div class="secret-cell m-b-20">
          <span class="inline-block w-127"
            ><el-tooltip class="item" effect="dark" content="企业微信中【应用管理】关联的会员小程序secret，请复制后更新至此处。首次使用好办请输入。" placement="top-start"> <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;" class="font-14 color-606266">会员小程序secret：</span></el-tooltip> </span
          ><el-input class="m-l-10 w-399" maxlength="200" v-model="companyObj.memberSecret" placeholder="非必填"></el-input><el-button class="m-l-20" type="text" @click="saveSecret('3')">保存</el-button><span v-if="companyObj.memberSecretLastTime" class="m-l-20 font-12 color-909399">最后一次保存：{{ companyObj.memberSecretLastTime | formatTimeStamp }}</span
          ><span class="m-l-37 font-14 color-303133"
            ><span :class="['iconfont-hb3', companyObj.memberSecretFlag ? 'color-49c958 iconchenggong' : 'color-f83431 iconshibai']"></span><span class="p-l-10">{{ companyObj.memberSecretFlag ? '校验成功' : '校验失败' }}</span></span
          >
        </div> -->
        <div class="m-b-20 secret-cell" v-show="application.secretVal">
          <span class="inline-block w-127">
            <el-tooltip class="item" effect="dark" content="注意：2021-10-22之后新增的企微应用，全部要求走代开发模式，请录入代开发应用secret，之前建立的应用不受影响" placement="top-start">
              <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;" class="font-14 color-606266">代开发应用secret：</span>
            </el-tooltip>
          </span>
          <el-input class="m-l-10 w-399" maxlength="200" v-model="application.secretVal"></el-input>
          <span v-if="haobanObj.updateTime" class="m-l-20 font-12 color-909399">最后一次授权：{{ application.updateTime | formatTimeStamp }}</span>
        </div>
        <div class="m-b-20 secret-cell" v-show="paymentObj.secretVal">
          <span class="inline-block w-127">
            <span class="font-14 color-606266">企微支付secret：</span>
          </span>
          <el-input class="m-l-10 w-399" maxlength="200" v-model="paymentObj.secretVal"></el-input>
        </div>
        <div class="secret-cell m-b-20">
          <el-tooltip class="item" effect="dark" content="企业微信中【应用管理】关联的会员小程序secret，请复制后更新至此处。首次使用好办请输入。" placement="top-start"> <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;" class="font-14 color-606266">会员小程序secret：</span></el-tooltip>
          <span class="p-l-10 font-14 color-303133 font-w-500">会员小程序信息</span>
          <div class="table-cell m-t-10 p-l-137">
            <el-table class="no-empty-icon-table" ref="multipleTable" :data="tableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }">
              <el-table-column label="小程序名称" show-overflow-tooltip>
                <template slot-scope="scope">{{ scope.row.secretName || '--' }}</template>
              </el-table-column>
              <el-table-column prop="" label="secret" width="506">
                <template slot-scope="scope">
                  <span>{{ scope.row.secretVal || '-- ' }} </span><span :class="['iconfont-hb3', scope.row.checkFlag ? 'color-49c958 iconchenggong' : 'color-f83431 iconshibai']"></span><span class="p-l-10">{{ scope.row.checkFlag ? '校验成功' : '校验失败' }}</span>
                </template>
              </el-table-column>
              <el-table-column prop="" label="关联商户" show-overflow-tooltip>
                <template slot-scope="scope">{{ scope.row.enterpriseName || '--' }}</template>
              </el-table-column>
              <el-table-column prop="" label="最近编辑时间" show-overflow-tooltip>
                <template slot-scope="scope">
                  <div class="line-18">{{ scope.row.updateTime | timeStampToYmd }}</div>
                  <div class="line-18">{{ scope.row.updateTime | timeStampToHms }}</div>
                </template>
              </el-table-column>
              <el-table-column prop="" label="操作" v-if="$getButtonLimit($buttonCode.editMemberAppsSecret) || $getButtonLimit($buttonCode.delMemberAppsSecret)">
                <template slot-scope="scope">
                  <el-button v-if="$getButtonLimit($buttonCode.editMemberAppsSecret)" :limit-code="$buttonCode.editMemberAppsSecret" type="text" @click="toEdit(scope.$index, scope.row)">编辑</el-button>
                  <el-button v-if="$getButtonLimit($buttonCode.delMemberAppsSecret)" :limit-code="$buttonCode.delMemberAppsSecret" type="text" @click="toDel(scope.$index, scope.row)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
            <div v-if="tableData.length < 10 && $getButtonLimit($buttonCode.addMemberAppsSecret)" :limit-code="$buttonCode.addMemberAppsSecret" class="text-center add-cell cursor-pointer" @click="addSecret"><span class="el-icon-plus font-14 color-2f54eb add-cell-txt"></span><span class="font-14 color-2f54eb p-l-5 add-cell-txt">新建</span><span class="font-12 color-c0c4cc p-l-20">最多添加10个</span></div>
          </div>
        </div>
      </div>
      <div v-if="wxShow" class="line-h-32 m-b-20">
        <span class="color-303133 font-14 font-w-600">企微好友</span>
        <el-button v-if="wxShow" class="m-l-20" type="text" @click="refeshDataWx">同步刷新 </el-button>
      </div>
      <div v-if="wxShow">
        <el-form ref="wxForm" label-width="115px">
          <el-form-item>
            <el-tooltip slot="label" class="item" effect="dark" placement="top-start">
              <div slot="content">刷新企业里关联导购账号的导购添加的客户。每天最多1次，每月最多3次。<br />仅刷新好办关联导购的企业好友数据，所以会小于等于企业微信看到的客户总数。<br />点击刷新后当日凌晨更新数据。</div>
              <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;" class="font-14 color-606266">企微好友更新</span>
            </el-tooltip>
            <span class="font-14 color-303133">更新时间：{{ wxDate | formatTimeStamp }}{{ !wxDate ? '--' : '' }}</span>
          </el-form-item>
        </el-form>
      </div>
    </div>
    <div class="company-set-content border-box">
      <div class="company-title m-b-20 m-t-26 flex flex-space-between flex-align-center">
        <el-tooltip slot="label" class="item" effect="dark" placement="top-start">
          <div slot="content">①小程序添加：用于小程序素材创建后群发小程序或配置欢迎语；<br />②获取小程序：用于获取商户绑定的小程序，创建后可用来配置欢迎语&小程序素材；<br />③添加小程序：用于自定义添加小程序，创建后可用来配置小程序素材</div>
          <p class="color-303133 font-14 font-w-600" style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;">小程序添加</p>
        </el-tooltip>
        <div>
          <el-button v-if="$getButtonLimit($buttonCode.addAppsSecret)" :limit-code="$buttonCode.addAppsSecret" type="primary" @click="addApp">添加小程序</el-button>
          <el-button v-if="$getButtonLimit($buttonCode.getAppsSecret)" :limit-code="$buttonCode.getAppsSecret" type="primary" @click="getApp">获取小程序</el-button>
        </div>
      </div>
      <div class="company-info-body">
        <div class="table-cell m-t-10">
          <el-table class="no-empty-icon-table" ref="multipleTable" :data="appTableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }">
            <el-table-column label="小程序名称" show-overflow-tooltip>
              <template slot-scope="scope">{{ scope.row.miniprogramName || '--' }}</template>
            </el-table-column>
            <el-table-column prop="" label="AppID" width="239">
              <template #header>
                <el-tooltip class="item" effect="dark" placement="top">
                  <div slot="content">如何查看AppId：<a href="https://jingyan.baidu.com/article/95c9d20d0545f9ec4e75612d.html" target="blank">https://jingyan.baidu.com/article/95c9d20d0545f9ec4e75612d.html</a></div>
                  <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;">AppId</span>
                </el-tooltip>
              </template>
              <template slot-scope="scope">
                <span>{{ scope.row.appId || '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="miniprogramType" label="类型" width="239">
              <template #header>
                <el-tooltip class="item" effect="dark" placement="top">
                  <div slot="content">①默认：用于欢迎语&小程序素材<br />②自定义：用于小程序素材</div>
                  <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;">类型</span>
                </el-tooltip>
              </template>
              <template slot-scope="{ row }">
                <span>{{ row.miniprogramType == 1 ? '自定义' : '默认' }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="" label="最近编辑时间" show-overflow-tooltip>
              <template slot-scope="scope">
                <div class="line-18">{{ scope.row.updateTime | timeStampToYmd }}</div>
                <div class="line-18">{{ scope.row.updateTime | timeStampToHms }}</div>
              </template>
            </el-table-column>
            <el-table-column prop="" label="操作" v-if="$getButtonLimit($buttonCode.editAppsSecret) || $getButtonLimit($buttonCode.delAppsSecret)">
              <template slot-scope="scope">
                <template v-if="scope.row.miniprogramType != 1">
                  <el-button type="text" @click="toAppEdit(scope.$index, scope.row)" v-if="$getButtonLimit($buttonCode.editAppsSecret)" :limit-code="$buttonCode.editAppsSecret">编辑</el-button>
                </template>
                <template v-else>
                  <el-button v-if="$getButtonLimit($buttonCode.editAppsSecret)" :limit-code="$buttonCode.editAppsSecret" type="text" @click="toAddAppEdit(scope.$index, scope.row)">编辑</el-button>
                  <el-button v-if="$getButtonLimit($buttonCode.delAppsSecret)" :limit-code="$buttonCode.delAppsSecret" type="text" @click="toAppDel(scope.$index, scope.row)">删除</el-button>
                </template>
              </template>
            </el-table-column>
          </el-table>
          <!-- <div class="text-center add-cell cursor-pointer" @click="getApp"><span class="el-icon-plus font-14 color-2f54eb add-cell-txt"></span><span class="font-14 color-2f54eb p-l-5 add-cell-txt">新建</span></div> -->
        </div>
      </div>
    </div>
    <div class="company-set-content border-box" v-if="false">
      <div class="company-title m-b-20 m-t-26 flex flex-space-between flex-align-center">
        <p class="color-303133 font-14 font-w-600">授权配置</p>
      </div>
      <div>
        <el-form>
          <el-form-item label="是否已同意企微授权"> <el-switch v-model="openFlag" @change="getAgreeExternalFlag" :active-value="1" :inactive-value="0" :disabled="openFlag == 1"/></el-form-item>
          <span class="font-12 color-909399 " style="margin-left: 110px;margin-top:10px;">提示：若企微管理员在企微端进行过如下的授权，可打开此开关，开始企微ID转换。</span>
        </el-form>
        <img src="../../assets/示例图.png" class="example" alt="示例图" />
      </div>
    </div>
    <secret-set v-if="addShow" :editRow="editRow" @closeText="closeText" @submitText="submitText"></secret-set>
    <add-customize-app v-if="addAppShow" :editRow="addAppRow" :enterpriseId="companyObj.corpid" @closeText="closeAddApp" @submitText="submitAddApp"></add-customize-app>
    <app-set v-if="getAppShow" :editRow="appEditRow" :type="appSetType" @closeText="closeAppText" @submitText="submitAppText"></app-set>
  </div>
</template>
<script>
import setTip from '@/components/app/set-tip.vue';
import secretSet from '@/components/set/secret-set.vue';
import appSet from '@/components/set/app-set.vue';
import addCustomizeApp from '@/components/set/add-customize-app.vue';
import { getRequest, postRequest } from '@/api/api';
import { _debounce } from '@/common/js/public';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
export default {
  props: {},
  data() {
    return {
      openFlag: 0,
      checkShow: true,
      tipText: '请在企业密钥维护中输入对应的secret',
      tableH: window.screen.availHeight - 464 - 126,
      wxEnterpriseId: sessionStorage.getItem('userInfos') ? JSON.parse(sessionStorage.getItem('userInfos')).wxEnterpriseId : '',
      companyObj: {
        smallVersion: '',
        corpName: '',
        corpid: '',
        contactFlag: false,
        verifiedEndTime: '',
        corpIndustry: '',
        corpSubIndustry: '',
        corpUserMax: '',
        location: ''
      },
      // 客户联系
      wxObj: {
        secretType: 1,
        secretVal: '',
        checkFlag: 0,
        updateTime: null
      },
      // 通讯录
      contactObj: {
        secretType: 2,
        secretVal: '',
        checkFlag: 0,
        updateTime: null
      },
      // 好办助手
      haobanObj: {
        secretType: 3,
        secretVal: '',
        checkFlag: 0,
        updateTime: null
      },
      showWxError: false,
      showContactError: false,
      showHaobanError: false,
      tableData: [],
      appTableData: [],
      addShow: false,
      getAppShow: false,
      appSetType: 0,
      editRow: {},
      appEditRow: {},
      // 添加小程序
      addAppShow: false,
      addAppRow: {},
      // 企微好友
      wxShow: false,
      wxDate: '',
      application: {
        secretVal: '',
        updateTime: null
      }, // 待开发应用secret
      paymentObj: {}
    };
  },
  computed: {},
  methods: {
    /**
     * @description: 刷新企微好友
     * @author: 无尘
     */
    refeshDataWx: _debounce(function() {
      const that = this;
      let para = {
        wxEnterpriseId: that.wxEnterpriseId
      };
      getRequest('/haoban-manage3-web/fresh-wx-friend', para)
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            showMsg.showmsg('刷新成功', 'success');
            return false;
          }
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    }, 300),
    getRefreshTime() {
      const that = this;
      let para = {
        wxEnterpriseId: that.wxEnterpriseId
      };
      getRequest('/haoban-manage3-web/get-fresh-detail', para)
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            that.wxDate = resData.result || '';
            return false;
          }
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    },
    getAgreeExternalFlag(val) {
      this.$confirm('请谨慎操作！开启后，将无法关闭。并需要在开启后，尽快完成好办后台欢迎语配置和联系运营开启external_userid转换，否则将影响企微&好办的使用。(可联系达摩运营人员进行协助)', '提示', {
        confirmButtonText: '确认开启',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          getRequest('/haoban-manage3-web/agree_external_userid_flag', { openFlag: this.openFlag }).then(res => {
            let resData = res.data;
            if (resData.errorCode == 1) {
              showMsg.showmsg('操作成功', 'success');
            }
          });
        })
        .catch(() => {
          val == 0 ? (this.openFlag = 1) : (this.openFlag = 0);
        });
    },
    getRefreshShow() {
      const that = this;
      let para = {
        wxEnterpriseId: that.wxEnterpriseId
      };
      getRequest('/haoban-manage3-web/get-fresh-on-off', para)
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            that.wxShow = resData.result || false;
            return false;
          }
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    },
    addSecret() {
      const that = this;
      that.addShow = true;
      that.editRow = {};
    },
    getApp() {
      const that = this;
      that.getAppShow = true;
      that.editRow = { type: 'add' };
    },
    // 新增小程序
    addApp() {
      this.addAppShow = true;
      this.addAppRow = { type: 'add' };
    },
    /**
     * 编辑
     */
    toEdit(index, row) {
      const that = this;
      that.addShow = true;
      that.editRow = row;
    },
    toAppEdit(index, row) {
      const that = this;
      that.getAppShow = true;
      that.appEditRow = Object.assign({}, row, { type: 'edit' });
    },
    // 新增小程序编辑
    toAddAppEdit(index, row) {
      const that = this;
      that.addAppShow = true;
      that.addAppRow = Object.assign({}, row, { type: 'edit' });
    },
    closeText() {
      const that = this;
      that.addShow = false;
      that.editRow = {};
    },
    closeAppText() {
      const that = this;
      that.getAppShow = false;
      that.appEditRow = {};
    },
    // 新增add
    closeAddApp() {
      this.addAppShow = false;
      this.addAppRow = {};
    },
    submitText() {
      const that = this;
      that.addShow = false;
      that.editRow = {};
      that.getSecretData();
    },
    submitAppText() {
      const that = this;
      that.getAppShow = false;
      that.appEditRow = {};
      that.getAppData();
    },
    // 新增add
    submitAddApp() {
      this.addAppShow = false;
      this.addAppRow = {};
      this.getAppData();
    },
    /**
     * 删除
     */
    toDel(index, row) {
      const that = this;
      that
        .$confirm('确定删除当前小程序信息?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
        .then(() => {
          that.postDel(row.secretId);
        })
        .catch(() => {});
    },
    toAppDel(index, row) {
      const that = this;
      that
        .$confirm('确定删除当前小程序?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
        .then(() => {
          that.postAppDel(index, row);
        })
        .catch(() => {});
    },
    postDel(secretId) {
      const that = this;
      let para = {
        secretId
      };
      postRequest('/haoban-manage3-web/member-secret-del', para)
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            showMsg.showmsg('删除成功', 'success');
            that.getSecretData();
            return;
          }
          that.getSecretData();
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    },
    postAppDel(index, row) {
      const that = this;
      let para = {
        id: row.miniprogramSettingId
      };
      postRequest('/haoban-manage3-web/del-miniprogram-setting', para)
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            showMsg.showmsg('删除成功', 'success');
            that.getAppData();
            return;
          }
          that.getAppData();
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    },
    /**
     * 保存secret
     */
    saveSecret: _debounce(function(flag) {
      const that = this;
      let para = {};
      if (flag == 1) {
        para.wxSecretKey = String(that.wxObj.secretVal).trim();
        that.showWxError = !!that.wxObj.secretVal ? false : true;
      }
      if (flag == 2) {
        para.contactSecret = String(that.contactObj.secretVal).trim();
      }
      if (flag == 2 && para.contactSecret == '') {
        return false;
      }
      if (flag == 3) {
        para.contactSecret = String(that.haobanObj.secretVal).trim();
        that.showHaobanError = !!that.haobanObj.secretVal ? false : true;
      }
      if (flag == 1 && that.showWxError) {
        return false;
      }
      if (flag == 3 && that.showHaobanError) {
        return false;
      }
      that.postSaveSecret(flag, para);
    }, 300),
    /**删除 secret */
    delSecret() {
      this.$confirm('确定删除好办助手secret?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.postDel(this.haobanObj.secretId);
      });
    },
    postSaveSecret(flag, para) {
      const that = this;
      const url = flag == 1 ? '/wx-enterprise-wx-secret-set' : flag == 2 ? 'wx-enterprise-contact-secret-set' : 'wx-enterprise-haoban-secret-set';
      postRequest(`/haoban-manage3-web/${url}`, para)
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            showMsg.showmsg('操作成功', 'success');
            that.getSecretData();
            return false;
          }
          that.getSecretData();
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    },
    refeshData: _debounce(function() {
      const that = this;
      that.refreshData();
    }, 300),
    /**
     * 刷新数据
     */
    refreshData(val) {
      const that = this;
      let para = {
        wxEnterpriseId: that.wxEnterpriseId
      };
      getRequest('/haoban-manage3-web/wxEnterprise-refresh', para)
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            showMsg.showmsg('刷新成功', 'success');
            that.companyObj = resData.result;
            return false;
          }
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    },

    /**
     * 获取secret数据
     */
    getSecretData() {
      const that = this;
      let para = {
        wxEnterpriseId: that.wxEnterpriseId
      };
      getRequest('/haoban-manage3-web/secret-list', para)
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            that.tableData = [];
            let arr = [];
            if (resData.result && resData.result.length) {
              resData.result.forEach(ele => {
                arr.push(ele.secretType);
                if (ele.secretType == 1) {
                  that.wxObj = ele;
                }
                if (ele.secretType == 2) {
                  that.contactObj = ele;
                }
                if (ele.secretType == 3) {
                  that.haobanObj = ele;
                }
                if (ele.secretType == 4) {
                  that.tableData.push(ele);
                }
                if (ele.secretType == 5) {
                  this.application = ele;
                }
                if (ele.secretType == 6) {
                  this.paymentObj = ele;
                }
              });
              if (!arr.includes(3)) {
                this.haobanObj = {
                  secretType: 3,
                  secretVal: '',
                  checkFlag: 0,
                  updateTime: null
                };
              }
            }
            return false;
          }
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    },
    /**
     * 获取数据
     */
    getData(val) {
      const that = this;
      let para = {
        wxEnterpriseId: that.wxEnterpriseId
      };
      getRequest('/haoban-manage3-web/wxEnterprise-detail', para)
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            that.companyObj = resData.result;
            this.openFlag = resData.result.agreeExternalUseridFlag === null ? 0 : resData.result.agreeExternalUseridFlag;
            return false;
          }
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    },
    /**
     *  获取显示的提示
     */
    getTipData() {
      const that = this;
      let para = {};
      getRequest('/haoban-manage3-web/is-wx-enterprise-secret-set', para)
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            that.checkShow = resData.result;
            return;
          }
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    },
    getAppData() {
      const that = this;
      getRequest('/haoban-manage3-web/list-miniprogram-setting', {})
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            that.appTableData = resData.result;
            return;
          }
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    }
  },
  watch: {},
  mounted() {
    const that = this;
    that.getAppData();
    that.getData();
    that.getSecretData();
    that.getTipData();
    that.getRefreshShow();
    that.getRefreshTime();
  },
  components: {
    setTip,
    secretSet,
    appSet,
    addCustomizeApp
  }
};
</script>
<style type="text/scss" lang="scss" scoped>
.example {
  width: 899px;
  margin-left: 100px;
  margin-top: 20px;
}
.color-c0c4cc {
  display: inline-block;
  line-height: 34px;
  padding-left: 10px;
  color: #c0c4cc;
}
.color-49c958 {
  color: #49c958;
}
.color-f83431 {
  color: #f83431;
}
.line-h-32 {
  line-height: 32px;
}
.condition-tips {
  display: inline-block;
  vertical-align: middle;
  line-height: 32px;
}

.w-127 {
  width: 127px;
}

.w-399 {
  width: 399px;
}

.p-l-5 {
  padding-left: 5px;
}

.p-l-130 {
  padding-left: 130px;
}

.p-l-137 {
  padding-left: 137px;
}

.m-l-20 {
  margin-left: 20px;
}

.m-l-37 {
  margin-left: 37px;
}

.m-l-137 {
  margin-left: 137px;
}
.m-b-20 {
  margin-bottom: 20px;
}
.m-t-30 {
  margin-top: 30px;
}
.secret-cell {
  position: relative;
}
.add-cell {
  height: 43px;
  line-height: 43px;
  border-bottom: 1px solid #dcdfe6;
  &:hover {
    .add-cell-txt {
      color: #597ef7;
    }
  }
}
// .table-condition {
// min-width: 1200px;
// }
.secret-body {
  .el-input {
    >>> .el-input__inner {
      color: #c0c4cc;
    }
  }
}
.daily-set-wrap {
  height: 100%;
  margin-top: -10px;
  background: #f0f2f5 !important;
  .company-set-content {
    background: #ffffff;
    margin-top: 10px;
    padding: 20px;
    .table-condition-left {
      font-size: 0;
    }
  }
  .el-form {
    .el-form-item {
      margin-bottom: 4px;
    }
    >>> .el-form-item__label {
      color: #606266;
    }
  }
  .depart-item-content {
    width: 213px;
    height: 32px;
    overflow: hidden;
    white-space: nowrap;
    border-radius: 4px;
    border: 1px solid #dcdfe6;
    cursor: pointer;
  }
  .item-cell-select {
    >>> .el-select__tags {
      white-space: nowrap;
      overflow: hidden;
    }
  }
  .depart-cell {
    position: relative;
    margin: 0 24px 24px 0;
    .el-icon-circle-close {
      position: absolute;
      top: -10px;
      right: -10px;
      font-size: 16px;
      color: #808995;
      cursor: pointer;
    }
  }
}
</style>
