<template>
  <page-header-wrapper>
    <a-card :bordered="false">
      <!-- 条件搜索 -->
      <div class="table-page-search-wrapper">
        <a-form layout="inline">
          <a-row :gutter="48">
            <a-col :md="8" :sm="24">
              <a-form-item label="应用名称">
                <a-input v-model="queryParam.name" placeholder="请输入" allow-clear/>
              </a-form-item>
            </a-col>
            <a-col :md="8" :sm="24">
              <a-form-item label="认证方式">
                <a-select placeholder="请选择" v-model="queryParam.compositiveForm" style="width: 100%" allow-clear>
                  <a-select-option v-for="(d, index) in statusOptions" :key="index" :value="d.dictLabel">{{ d.dictLabel }}</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :md="8" :sm="24">
              <span class="table-page-search-submitButtons">
                <a-button type="primary" @click="handleQuery"><a-icon type="search" />查询</a-button>
                <!-- <a-button style="margin-left: 8px" @click="resetQuery"><a-icon type="redo" />重置</a-button> -->
              </span>
            </a-col>
          </a-row>
        </a-form>
      </div>
      <!-- 操作 -->
      <div class="table-operations">
        <!-- @click="$refs.createForm.handleAdd()" -->
        <a-dropdown :trigger="trigger">
          <a-button type="primary" >
            <a-icon type="plus" />新增
          </a-button>
          <a-menu slot="overlay">
            <a-menu-item @click="Qauth_ModelAdd" key="0">
              <span >Oauth2.0</span>
            </a-menu-item>
            <a-menu-item @click="Form_Model=true" key="1">
              <span >表单认证</span>
            </a-menu-item>
            <a-menu-item @click="JWT_Model=true" key="2">
              <span >JWT令牌认证</span>

            </a-menu-item>
            <a-menu-item @click="DZ_Model=true" key="3">
              <span >地址认证</span>

            </a-menu-item>
            <a-menu-item @click="CasAdd" key="4">
              <span>CAS</span>

            </a-menu-item>
          </a-menu>
        </a-dropdown>
        <!-- <a-button type="primary" @click="edit" v-hasPermi="['system:menu:add']">
          <a-icon type="edit" />编辑
        </a-button> -->
        <!-- <a-button type="danger" @click="handleDelete" v-hasPermi="['system:menu:add']">
          <a-icon type="delete" />删除
        </a-button> -->

        <!-- <a-button
          type="dashed"
          shape="circle"
          :loading="loading"
          :style="{float: 'right'}"
          icon="reload"
          @click="getList" /> -->
      </div>
      <!-- 增加修改 -->
      <a-modal
        v-model="Qauth_Model"
        title="Oauth2.0新增认证系统"
        :destroyOnClose="true"
        on-ok="handleOk"
        width="600px"
        @ok="handleSubmit">
        <a-form :form="Qauth_Form">
          <div class="form-title"> 基础信息：</div>
          <a-row>
            <a-col :span="12">
              <a-form-item label="选择系统" :labelCol="{span:8}" :wrapperCol="{ span: 12 }">
                <a-select v-decorator="['joinsysCode',{rules: [{ required: true, message: '请选择系统' }]}]" placeholder="请选择" >
                  <a-select-option v-for="d in systemOptions" :key="d.dictValue" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="访问协议" :labelCol="{span:9}" :wrapperCol="{ span: 12 }">
                <a-input :disabled="true" v-decorator="['compositiveForm',{initialValue: 'Oauth2.0'}]"/>
              </a-form-item>
              <!-- <a-form-item label="系统唯一标识" :labelCol="{span:9}" :wrapperCol="{ span: 12 }">
                        <a-input :disabled="true" placeholder="请输入系统唯一标识" v-decorator="['one',]"/>
                      </a-form-item> -->
            </a-col>
          </a-row>

          <div class="form-title"> OAuth2.0协议配置：</div>
          <!-- <a-row>
                    <a-col :span="12">
                      <a-form-item label="Client Id" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
                        <a-input :disabled="true" placeholder="请输入Client Id" v-decorator="['ClientId']"/>
                      </a-form-item>
                    </a-col>
                    <a-col :span="12">
                      <a-form-item label="Client Secret" :labelCol="{span:9}" :wrapperCol="{ span: 14 }">
                        <a-input :disabled="true" placeholder="请输入Client Secret" v-decorator="['ClientSecret']"/>
                      </a-form-item>
                    </a-col>
                  </a-row> -->
          <a-row>
            <a-col :span="24">
              <a-form-item label="授权方式" :labelCol="{span:4}" :wrapperCol="{ span: 20}">
                <a-checkbox-group :defaultValue="['1']" >
                  <div>  <a-checkbox value="1">authorization_code | code</a-checkbox>
                    <a-checkbox value="2">implicit</a-checkbox>
                  </div>
                  <div>
                    <a-checkbox value="3">password</a-checkbox>
                    <a-checkbox value="4">client credentials</a-checkbox>
                  </div>
                </a-checkbox-group>
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="认证地址" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
                <a-input v-decorator="['redirectUri',{rules: [{ required: true, message: '请输入认证地址' }]}]"/>
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="accessToken有效期" :labelCol="{span:13}" :wrapperCol="{ span: 10 }">
                <a-input placeholder="请输入accessToken有效期" v-decorator="['accessTokenValidity',{rules: [{ required: true, message: '请输入accessToken有效期' }]}]"/>
              </a-form-item>
            </a-col>
          </a-row>
          <!--                  <a-row>-->
          <!--                    <a-col :span="12">-->
          <!--                      <a-form-item label="refreshToken有效期" :labelCol="{span:13}" :wrapperCol="{ span: 10 }">-->
          <!--                        <a-input placeholder="请输入refreshToken有效期" v-decorator="['refreshToken',{rules: [{ required: true, message: '请输入refreshToken有效期' }],initialValue:180}]"/>-->
          <!--                      </a-form-item>-->
          <!--                    </a-col>-->
          <!--                  </a-row>-->
          <!-- <div class="form-title">OpenID Connect 认证配置：</div>
                  <a-row>
                    <a-col :span="12">
                      <a-form-item label="idToken签名算法" :labelCol="{span:12}" :wrapperCol="{ span: 11 }">
                        <a-select v-decorator="['idToken',{rules: [{ required: true, message: '请选择idToken签名算法' }]}]" placeholder="请选择" >
                          <a-select-option v-for="(d, index) in selectOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
                        </a-select>
                      </a-form-item>
                    </a-col>
                    <a-col :span="12">
                      <a-form-item label="用户签名算法" :labelCol="{span:12}" :wrapperCol="{ span: 11 }">
                        <a-select v-decorator="['userSignAlgorithm',{rules: [{ required: true, message: '请选择用户签名算法' }]}]" placeholder="请选择" >
                          <a-select-option v-for="(d, index) in selectOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
                        </a-select>
                      </a-form-item>
                    </a-col>
                  </a-row>
                  <a-row>
                    <a-col :span="12">
                      <a-form-item label="JWKS地址" :labelCol="{span:12}" :wrapperCol="{ span: 11 }">
                        <a-input placeholder="请输入JWKS地址" v-decorator="['JWKS',{rules: [{ required: true, message: '请输入JWKS地址' }]}]"/>
                      </a-form-item>
                    </a-col>
                    <a-col :span="12">
                      <a-form-item label="idToken加密算法" :labelCol="{span:12}" :wrapperCol="{ span: 11 }">
                        <a-select v-decorator="['idTokenPwdAlgorithm',{rules: [{ required: true, message: '请选择idToken加密算法' }]}]" placeholder="请选择" >
                          <a-select-option v-for="(d, index) in selectOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
                        </a-select>
                      </a-form-item>
                    </a-col>
                  </a-row>
                  <a-row>
                    <a-col :span="12">
                      <a-form-item label="用户加密算法" :labelCol="{span:12}" :wrapperCol="{ span: 11 }">
                        <a-select v-decorator="['userPwdAlgorithm',{rules: [{ required: true, message: '请选择用户加密算法' }]}]" placeholder="请选择" >
                          <a-select-option v-for="(d, index) in selectOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
                        </a-select>
                      </a-form-item>
                    </a-col>
                    <a-col :span="12">
                      <a-form-item label="idToken加密方法" :labelCol="{span:12}" :wrapperCol="{ span: 11 }">
                        <a-select v-decorator="['idTokenPwdMethod',{rules: [{ required: true, message: '请选择idToken加密方法' }]}]" placeholder="请选择">
                          <a-select-option v-for="(d, index) in selectOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
                        </a-select>
                      </a-form-item>
                    </a-col>
                  </a-row>
                  <a-row>
                    <a-col :span="12">
                      <a-form-item label="用户加密方法" :labelCol="{span:12}" :wrapperCol="{ span: 11 }">
                        <a-select v-decorator="['userPwdMethod',{rules: [{ required: true, message: '请选择用户加密方法' }]}]" placeholder="请选择">
                          <a-select-option v-for="(d, index) in selectOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
                        </a-select>
                      </a-form-item>
                    </a-col>
                    <a-col :span="12">
                      <a-form-item label="许可确认" :labelCol="{span:12}" :wrapperCol="{ span: 11 }">
                        <a-select v-decorator="['commit',{rules: [{ required: true, message: '请选择许可确认' }],initialValue:'强制'}]" placeholder="请选择">
                          <a-select-option v-for="(d, index) in commitOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
                        </a-select>
                      </a-form-item>
                    </a-col>
                  </a-row> -->
        </a-form>
      </a-modal>
      <a-modal
        v-model="Form_Model"
        title="表单认证新增"
        on-ok="handleOk"
        :destroyOnClose="true"
        width="600px"
        @ok="handleSubmit2">
        <a-form :form="Form_form">
          <div class="form-title"> 基础信息：</div>
          <a-form-item label="选择系统" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-select v-decorator="['system',{rules: [{ required: true, message: '请选择系统' }]}]" placeholder="请选择">
              <a-select-option v-for="(d, index) in systemOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
            </a-select>
          </a-form-item>
          <!-- <a-form-item label="系统唯一标识" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
                    <a-input :disabled="true" placeholder="请输入系统唯一标识" v-decorator="['one',]"/>
                  </a-form-item> -->
          <a-form-item label="访问协议" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-input :disabled="true" placeholder="请输入访问协议" v-decorator="['treaty',]"/>
          </a-form-item>
          <div class="form-title"> 表单认证配置：</div>
          <a-form-item label="认证地址" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-input placeholder="请输入认证地址" v-decorator="['address',{rules: [{ required: true, message: '请输入认证地址' }]}]"/>
          </a-form-item>
          <a-form-item label="登录名映射" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-input placeholder="请输入登录名映射" v-decorator="['loginName',{rules: [{ required: true, message: '请输入登录名映射' }]}]"/>
          </a-form-item>
          <a-form-item label="登录凭证映射" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-input placeholder="请输入登录凭证映射" v-decorator="['loginProof',{rules: [{ required: true, message: '请输入登录凭证映射' }]}]"/>
          </a-form-item>
          <a-form-item label="登录凭证映射" :labelCol="{span:8}" :wrapperCol="{ span: 16 }">
            <a-radio-group v-model="radioValue" @change="radioChange">
              <a-radio :value="1">
                用户自定义
              </a-radio>
              <a-radio :value="2">
                应用共享
              </a-radio>
              <a-radio :value="3">
                系统配置
              </a-radio>
            </a-radio-group>
          </a-form-item>
          <div v-if="radioValue=='2'">
            <a-form-item label="认证视图" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
              <a-input placeholder="请输入认证视图" v-decorator="['picture',{rules: [{ required: true, message: '请输入认证视图' }]}]"/>
            </a-form-item>
            <a-form-item label="共享用户名" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
              <a-input placeholder="请输入共享用户名" v-decorator="['username',{rules: [{ required: true, message: '请输入共享用户名' }]}]"/>
            </a-form-item>
            <a-form-item label="共享凭证" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
              <a-input placeholder="请输入共享凭证" v-decorator="['proof',{rules: [{ required: true, message: '请输入共享凭证' }]}]"/>
            </a-form-item>
          </div>
          <div v-else-if="radioValue=='1'">
            <a-form-item label="认证视图" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
              <a-input placeholder="请输入认证视图" v-decorator="['picture',{rules: [{ required: true, message: '请输入认证视图' }]}]"/>
            </a-form-item>
          </div>
          <div v-else-if="radioValue=='3'">
            <a-form-item label="认证视图" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
              <a-input placeholder="请输入认证视图" v-decorator="['picture',{rules: [{ required: true, message: '请输入认证视图' }]}]"/>
            </a-form-item>
            <a-form-item label="系统属性" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
              <a-select v-decorator="['systemProp',{rules: [{ required: true, message: '请选择' }]}]" placeholder="请选择系统属性" >
                <a-select-option v-for="(d, index) in selectOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
              </a-select>
            </a-form-item>
          </div>
        </a-form>
      </a-modal>
      <a-modal
        v-model="JWT_Model"
        title="JWT令牌新增"
        on-ok="handleOk"
        :destroyOnClose="true"
        width="600px"
        @ok="handleSubmit3">
        <a-form :form="JWT_form">
          <div class="form-title"> 基础信息：</div>
          <a-form-item label="选择系统" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-select v-decorator="['system',{rules: [{ required: true, message: '请选择系统' }]}]" placeholder="请选择">
              <a-select-option v-for="(d, index) in systemOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
            </a-select>
          </a-form-item>
          <!-- <a-form-item label="系统唯一标识" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
                    <a-input :disabled="true" placeholder="请输入系统唯一标识" v-decorator="['one',]"/>
                  </a-form-item> -->
          <a-form-item label="访问协议" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-input :disabled="true" placeholder="请输入访问协议" v-decorator="['treaty',]"/>
          </a-form-item>
          <div class="form-title"> JWT令牌配置：</div>
          <a-form-item label="认证地址" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-input :disabled="true" placeholder="请输入认证地址" v-decorator="['address']"/>
          </a-form-item>
          <a-form-item label="令牌类型" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-select v-decorator="['token',{rules: [{ required: true, message: '请选择令牌类型' }]}]" placeholder="请选择">
              <a-select-option v-for="(d, index) in tokenOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
            </a-select>
          </a-form-item>
          <a-form-item label="cookie名称" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-input placeholder="请输入cookie名称" v-decorator="['cookie',{rules: [{ required: true, message: '请输入cookie名称' }]}]"/>
          </a-form-item>
          <a-form-item label="加密算法" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-select v-decorator="['pwdAlgorithm',{rules: [{ required: true, message: '请选择加密算法' }]}]" placeholder="请选择">
              <a-select-option v-for="(d, index) in pwdOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
            </a-select>
          </a-form-item>
          <a-form-item label="秘钥" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-input :disabled="true" placeholder="请输入秘钥" v-decorator="['keys',{rules: [{ required: true, message: '请输入秘钥' }],initialValue:'ZJJIMTMxMjIwMjExOTMxMTQzMzcLIJ'}]"/>
          </a-form-item>
          <a-form-item label="令牌内容" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-select v-decorator="['tokenContent',{rules: [{ required: true, message: '请选择令牌内容' }]}]" placeholder="请选择">
              <a-select-option v-for="(d, index) in tokenContentOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
            </a-select>
          </a-form-item>
          <a-form-item label="过期时间" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-input placeholder="请输入过期时间" v-decorator="['time',{rules: [{ required: true, message: '请输入过期时间' }]}]"/>
          </a-form-item>
        </a-form>
      </a-modal>
      <a-modal
        v-model="DZ_Model"
        title="地址认证新增"
        :destroyOnClose="true"
        on-ok="handleOk"
        width="600px"
        @ok="handleSubmit4">
        <a-input placeholder="请输入地址"/>
      </a-modal>
      <a-modal
        v-model="Cas_Model"
        title="CAS新增"
        on-ok="handleOk"
        :destroyOnClose="true"
        width="600px"
        @ok="handleSubmit5">
        <a-form :form="CAS_form">
          <div class="form-title"> 基础信息：</div>
          <a-row>
            <a-col :span="12">
              <a-form-item label="选择系统" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
                <a-select v-decorator="['joinsysCode',{rules: [{ required: true, message: '请选择系统' }]}]" placeholder="请选择">
                  <a-select-option v-for="(d, index) in systemOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="访问协议" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
                <a-input :disabled="true" placeholder="请输入访问协议" v-decorator="['compositiveForm',{initialValue: 'CAS'}]"/>
              </a-form-item>
              <!-- <a-form-item label="系统唯一标识" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
                        <a-input :disabled="true" placeholder="请输入系统唯一标识" v-decorator="['one',]"/>
                      </a-form-item> -->
            </a-col>
          </a-row>
          <!-- <a-row>
                    <a-col :span="12">
                      <a-form-item label="访问协议" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
                        <a-input :disabled="true" placeholder="请输入访问协议" v-decorator="['treaty',{initialValue: 'CAS'}]"/>
                      </a-form-item>
                    </a-col>
                  </a-row> -->
          <div class="form-title"> CAS协议配置：</div>
          <a-form-item label="CAS认证中心地址" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-input placeholder="请输入CAS认证中心地址" v-decorator="['authenticationCenterUrl',{rules: [{ required: true, message: '请输入认证地址' }]}]"/>
          </a-form-item>
          <a-form-item label="CAS认证中心登录地址" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-input placeholder="请输入CAS认证中心登录地址" v-decorator="['authenticationLoginUrl',{rules: [{ required: true, message: '请输入登录名映射' }]}]"/>
          </a-form-item>
          <a-form-item label="CAS认证中心登出地址" :labelCol="{span:8}" :wrapperCol="{ span: 14 }">
            <a-input placeholder="请输入CAS认证中心登出地址" v-decorator="['casLogout',{rules: [{ required: true, message: '请输入登录名映射' }]}]"/>
          </a-form-item>
        </a-form>
      </a-modal>
      <create-form
        ref="createForm"
        :menuOptions="menuOptions"
        :statusOptions="statusOptions"
        :visibleOptions="visibleOptions"
        @ok="getList"
        @select-tree="getTreeselect"
      />
      <!-- 数据展示 -->
      <a-table
        :loading="loading"
        :size="tableSize"
        rowKey="integratManId"
        :columns="columns"
        :data-source="list"
        :pagination="false">
        <!-- :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" -->
        <span slot="icon" slot-scope="text">
          <a-icon :component="allIcon[text + 'Icon']" v-if="allIcon[text + 'Icon']"/>
          <a-icon :type="text" v-if="!allIcon[text + 'Icon']"/>
        </span>
        <span slot="status" slot-scope="text, record">
          {{ statusFormat(record) }}
        </span>
        <span slot="createTime" slot-scope="text, record">
          {{ parseTime(record.createTime) }}
        </span>
        <span slot="operation" slot-scope="text, record">
          <!-- slot-scope="text, record" -->
          <a @click="handleUpdate(record)" v-hasPermi="['system:menu:edit']">
            <a-icon type="edit" />编辑
          </a>
          <!-- <a-divider type="vertical" v-hasPermi="['system:menu:add']" />
          <a @click="$refs.createForm.handleAdd(record)" v-hasPermi="['system:menu:add']">
            <a-icon type="plus" />新增
          </a> -->
          <!-- <a-divider type="vertical" v-if="record.menuId != 0" v-hasPermi="['system:menu:remove']" /> -->
          <a @click="handleDelete(record)" v-if="record.menuId != 0" v-hasPermi="['system:menu:remove']">
            <a-icon type="delete" />删除
          </a>
        </span>
      </a-table>
    </a-card>
  </page-header-wrapper>
</template>

<script>

import { listMenu } from '@/api/system/menu'
import { getInsideSystemInfoList } from '@/api/backmanage/insidesystem'
import { addInsideOauth, addInsideCas, list, deleteList, editInsideInfo, queryDetailInfo } from '@/api/monitor/integratMan'
import CreateForm from './modules/CreateForm'
import allIcon from '@/core/icons'

export default {
  name: 'Menu',
  components: {
    CreateForm
  },
  data () {
    return {
      radioValue: '2',
      trigger: ['click'],
      Qauth_Model: false,
      Form_Model: false,
      Cas_Model: false,
      JWT_Model: false,
      DZ_Model: false,
      Qauth_Form: this.$form.createForm(this),
      Form_form: this.$form.createForm(this),
      JWT_form: this.$form.createForm(this),
      CAS_form: this.$form.createForm(this),
      selectedRowKeys: [],
      handleStatus: '',
      editID: null,
      allIcon,
      iconVisible: false,
      list: [],
      // 部门树选项
      menuOptions: [],
      loading: false,
      // 状态数据字典
      statusOptions: [],
      visibleOptions: [],
      selectedRows: [],
      ids: [],
      queryParam: {
        name: undefined,
        compositiveForm: undefined
      },
      selectOptions: [
          {
            dictValue: '1',
            dictLabel: '选项一'
        },
        {
            dictValue: '2',
            dictLabel: '选项二'
        },
        {
            dictValue: '3',
            dictLabel: '选项三'
        }
      ],
      systemOptions: [],
      commitOptions: [
        {
            dictValue: '1',
            dictLabel: '强制'
        },
        {
            dictValue: '2',
            dictLabel: '自动'
        }
      ],
      tokenOptions: [
        {
            dictValue: '1',
            dictLabel: '安全令牌'
        },
        {
            dictValue: '2',
            dictLabel: '轻量级认证'
        }
      ],
      pwdOptions: [
        {
            dictValue: '1',
            dictLabel: 'AES'
        },
        {
            dictValue: '2',
            dictLabel: 'DES'
        },
        {
            dictValue: '3',
            dictLabel: 'HA-256'
        }
      ],
      tokenContentOptions: [
        {
            dictValue: '1',
            dictLabel: '用户编码'
        },
        {
            dictValue: '2',
            dictLabel: '邮箱'
        },
        {
            dictValue: '3',
            dictLabel: '手机号码'
        }
      ],
      columns: [
        {
          title: '系统名称',
          dataIndex: 'menuName',
          width: '15%'
        },
        {
          title: '系统唯一标识',
          dataIndex: 'perms',
          ellipsis: true,
          align: 'center'
        },
        {
          title: '认证方式',
          dataIndex: 'component',
          ellipsis: true,
          align: 'center'
        },
        {
          title: '操作',
          dataIndex: 'operation',
          width: '20%',
          scopedSlots: { customRender: 'operation' },
          align: 'center'
        }
      ]
    }
  },
  filters: {
  },
  created () {
    this.Qauth_Form = this.$form.createForm(this)
    this.Form_form = this.$form.createForm(this)
    this.JWT_form = this.$form.createForm(this)
    this.CAS_form = this.$form.createForm(this)
    this.getList()
    this.getSystem()
    this.getDicts('sys_normal_disable').then(response => {
    //   this.statusOptions = response.data
    this.statusOptions = [
        {
            dictValue: '1',
            dictLabel: 'Oauth2.0'
        },
        {
            dictValue: '2',
            dictLabel: '表单认证'
        },
        {
            dictValue: '3',
            dictLabel: 'JWT令牌'
        },
        {
            dictValue: '4',
            dictLabel: '地址认证'
        },
        {
            dictValue: '5',
            dictLabel: 'CAS'
        }
    ]
    })
    this.getDicts('sys_show_hide').then(response => {
      this.visibleOptions = response.data
    })
  },
  computed: {
  },
  watch: {
  },
  methods: {
    // 清空操作
    onPageChange () {
      const selectedRowKeys = []
      const selectedRows = []
      this.onSelectChange(selectedRowKeys, selectedRows)
      // console.log('清空啦！！！！！')
    },
    // 系统数据处理
    changeSystem (data) {
      data.forEach(item => {
        const obj = {}
        obj.dictValue = item.joinsysCode
        obj.dictLabel = item.name
        this.systemOptions.push(obj)
      })
    },
    // 表单数据处理
    changeList (data) {
      const arr = []
      data.forEach(item => {
        const obj = {}
        obj.menuName = item.insideSys.name
        obj.perms = item.insideSys.joinsysCode
        obj.component = item.compositiveForm
        obj.key = item.insideSys.joinsysCode
        obj.insideSystemId = item.id
        arr.push(obj)
      })
      return arr
    },

    // 查询系统
    getSystem () {
      getInsideSystemInfoList().then(res => {
        this.changeSystem(res.rows)
      })
    },
    /** 查询菜单列表 */
    getList () {
    //   this.loading = true
      list(this.queryParam).then(res => {
        this.list = this.changeList(res.rows)
      })
    //   listMenu(this.queryParam).then(response => {
    //       this.list = this.handleTree(response.data, 'menuId')
    //       this.loading = false
    //     }
    //   )
    },
    radioChange (e) {
    },
    onSelectChange (selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
      this.ids = this.selectedRows.map(item => item.insideSystemId)
        //   this.selectedRows = selectedRows
    },
    handleSubmit () {
      if (this.handleStatus === 'add') {
        this.Qauth_Form.validateFields((err, values) => {
              if (!err) {
                addInsideOauth(values).then(res => {
                  if (res.code === 200) {
                     this.$message.success(res.msg)
                      this.Qauth_Model = false
                      this.getList()
                  } else {
                    this.$message.error(res.msg)
                  }
                })
              }
          })
      } else if (this.handleStatus === 'edit') {
        this.Qauth_Form.validateFields((err, values) => {
              if (!err) {
                values.id = this.editID
                editInsideInfo(values).then(res => {
                  if (res.code === 200) {
                     this.$message.success(res.msg)
                      this.Qauth_Model = false
                      this.getList()
                  } else {
                    this.$message.error(res.msg)
                  }
                })
              }
          })
      }
      },
    handleSubmit2 () {
          this.Form_form.validateFields((err, values) => {
              if (!err) {
                  this.Form_Model = false
              }
          })
      },
     handleSubmit3 () {
          this.JWT_form.validateFields((err, values) => {
              if (!err) {
                  this.JWT_Model = false
              }
          })
    },
     handleSubmit4 () {
          // this.JWT_form.validateFields((err, values) => {
          //     if (!err) {
          //         alert('不错呦,竟然填对了!')
          //         this.JWT_Model = false
          //     }
          // })
    },
     handleSubmit5 () {
       if (this.handleStatus === 'add') {
         this.CAS_form.validateFields((err, values) => {
              if (!err) {
                addInsideCas(values).then(res => {
                  if (res.code === 200) {
                     this.$message.success(res.msg)
                      this.Cas_Model = false
                      this.getList()
                  } else {
                    this.$message.error(res.msg)
                  }
                })
              }
          })
       } else if (this.handleStatus === 'edit') {
         this.CAS_form.validateFields((err, values) => {
              if (!err) {
                values.id = this.editID
                editInsideInfo(values).then(res => {
                  if (res.code === 200) {
                     this.$message.success(res.msg)
                      this.Cas_Model = false
                      this.getList()
                  } else {
                    this.$message.error(res.msg)
                  }
                })
              }
          })
       }
    },
    // 字典状态字典翻译
    visibleFormat (row) {
      if (row.menuType === 'F') {
        return ''
      }
      return this.selectDictLabel(this.visibleOptions, row.visible)
    },
    statusFormat (row) {
      return this.selectDictLabel(this.statusOptions, row.status)
    },
    /** 搜索按钮操作 */
    handleQuery () {
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery () {
      this.queryParam = {
        memuName: undefined,
        status: undefined
      }
      this.handleQuery()
    },
    /** 查询菜单下拉树结构 */
    getTreeselect () {
      listMenu().then(response => {
        this.menuOptions = []
        const menu = { menuId: 0, menuName: '主目录', children: [] }
        menu.children = this.handleTree(response.data, 'menuId')
        this.menuOptions.push(menu)
      })
    },
    /** 删除按钮操作 */
    handleDelete (row) {
      var that = this
      this.$confirm({
        title: '确认删除所选中数据?',
        content: '当前选中编号为' + row.insideSystemId + '的数据',
        onOk () {
          return deleteList({ id: row.insideSystemId, compositiveForm: row.component })
            .then(() => {
              that.onPageChange()
              that.getList()
              that.$message.success(
                '删除成功',
                3
              )
          })
        },
        onCancel () {}
      })
    },
    // 编辑按钮操作
    edit () {
      console.log('aaa')
    },
    Qauth_ModelAdd () {
      this.handleStatus = 'add'
      this.Qauth_Model = true
    },
    CasAdd () {
      this.handleStatus = 'add'
      this.Cas_Model = true
    },
    handleUpdate (record) {
      this.editID = record.insideSystemId
      const data = {
          id: record.insideSystemId,
          compositiveForm: record.component
      }
      this.handleStatus = 'edit'
      if (record.component === 'Oauth2.0') {
        queryDetailInfo(data).then(res => {
          this.Qauth_Model = true
          this.$nextTick(() => {
          this.Qauth_Form.setFieldsValue({ 'joinsysCode': res.data.joinsysCode, 'redirectUri': res.data.redirectUri, 'accessTokenValidity': res.data.accessTokenValidity })
          })
          this.Qauth_Form.setFieldsValue({ 'id': res.data.id })
        })
      } else if (record.component === 'CAS') {
        queryDetailInfo(data).then(res => {
          console.log('res', res)
          this.Cas_Model = true
          this.$nextTick(() => {
          this.CAS_form.setFieldsValue({ 'authenticationCenterUrl': res.data.authenticationCenterUrl, 'authenticationLoginUrl': res.data.authenticationLoginUrl, 'joinsysCode': res.data.joinsysCode, 'casLogout': res.data.casLogout })
          })
          this.CAS_form.setFieldsValue({ 'id': res.data.redirectUri })
        })
      }
    }
  }
}
</script>
<style lang="less" scoped>
    .form-title{
        font-weight:bolder;
        font-size: 17px;
        margin-bottom:30px ;
    }
</style>
