|
@@ -1,5 +1,5 @@
|
|
|
<script setup>
|
|
|
-import { onMounted, ref, getCurrentInstance, watch } from 'vue'
|
|
|
+import { onMounted, ref, getCurrentInstance, watch, nextTick } from 'vue'
|
|
|
import Close from '@/components/icon/delete.vue'
|
|
|
import CloseBig from '@/components/icon/closeBig.vue'
|
|
|
import Empty from '@/components/icon/empty.vue'
|
|
@@ -196,6 +196,7 @@ const isUpdate = ref(false)
|
|
|
const productError = ref('')
|
|
|
const groupNameList = ref('')
|
|
|
const multipleTable = ref()
|
|
|
+const syncLoading = ref(false)
|
|
|
onMounted(() => {
|
|
|
getDirectoryList()
|
|
|
getDNSFile()
|
|
@@ -208,12 +209,6 @@ watch(() => addDirectory.value, (nextValue, oldValue) => {
|
|
|
directoryNameError.value = ''
|
|
|
}
|
|
|
})
|
|
|
-// 打开选择同步用户组弹框
|
|
|
-watch(() => scopeOption.value, (nextValue, oldValue) => {
|
|
|
- if (Number(nextValue) === 2) {
|
|
|
- getMicrosoftList()
|
|
|
- }
|
|
|
-})
|
|
|
// 监听绑定域按钮是否可用
|
|
|
watch(() => domainId.value, (nextValue, oldValue) => {
|
|
|
if (domainId.value) {
|
|
@@ -233,6 +228,13 @@ watch(() => directorySetting.value, (nextValue, oldValue) => {
|
|
|
if (!directorySetting.value) {
|
|
|
ruleForm.value.clearValidate(['appId', 'directoryId', 'secret'])
|
|
|
productError.value = ''
|
|
|
+ formData.value.productList = [{
|
|
|
+ productId: '',
|
|
|
+ licenseNumber: ''
|
|
|
+ }]
|
|
|
+ groupIds.value = []
|
|
|
+ groupNameList.value = ''
|
|
|
+ microsoftList.value = []
|
|
|
}
|
|
|
})
|
|
|
// 获取DNS文件内容
|
|
@@ -355,7 +357,7 @@ const copy = () => {
|
|
|
.then(() => {
|
|
|
proxy.$message({
|
|
|
duration: 5000,
|
|
|
- message: 'Copy Success!',
|
|
|
+ message: 'Copy Successfully',
|
|
|
type: 'success'
|
|
|
})
|
|
|
}).catch((error) => {
|
|
@@ -746,6 +748,7 @@ const checkout = () => {
|
|
|
// 拼接选择组名字
|
|
|
const getGroupNameList = () => {
|
|
|
const arr = []
|
|
|
+ groupNameList.value = ''
|
|
|
groupIds.value.forEach((item) => {
|
|
|
arr.push(item.displayName)
|
|
|
})
|
|
@@ -753,23 +756,76 @@ const getGroupNameList = () => {
|
|
|
}
|
|
|
// 获取之前同步时间
|
|
|
const daySync = (val) => {
|
|
|
- if (val.time) {
|
|
|
+ if (val.time && val.type === '2') {
|
|
|
syncTime.value = [val.type, val.time]
|
|
|
- } else syncTime.value = val.type
|
|
|
+ } else {
|
|
|
+ syncTime.value = val.type
|
|
|
+ }
|
|
|
}
|
|
|
+// 重新打开选择微软弹窗自动选中
|
|
|
const getRowKeys = (row) => {
|
|
|
return row.id
|
|
|
}
|
|
|
+// 是否显示产品设置
|
|
|
const handleDisable = () => {
|
|
|
if (isDisable.value) {
|
|
|
addDirectory.value = false
|
|
|
} else isDisable.value = true
|
|
|
}
|
|
|
+// 修改同步设置赋值
|
|
|
+const syncSettings = async (val) => {
|
|
|
+ directorySetting.value = true
|
|
|
+ directoryId.value = val.directoryId
|
|
|
+ formData.value.appId = val.applicationId
|
|
|
+ formData.value.directoryId = val.tenantId
|
|
|
+ formData.value.secret = val.clientSecrets
|
|
|
+ isDisable.value = true
|
|
|
+ isCreate.value = false
|
|
|
+ scopeOption.value = val.scope
|
|
|
+ if (val.msGroupIds && val.scope === '2') {
|
|
|
+ groupIds.value = []
|
|
|
+ syncLoading.value = true
|
|
|
+ const { data: { result } } = await get('/pdf-tech/directory/getGroupList?clientId=' + formData.value.appId + '&tenantId=' + formData.value.directoryId + '&clientSecret=' + formData.value.secret + '&queryString=' + queryString.value)
|
|
|
+ microsoftList.value = result
|
|
|
+ const uniqueGroupIds = new Set()
|
|
|
+ microsoftList.value.forEach((item) => {
|
|
|
+ val.msGroupIds.split(',').forEach((items) => {
|
|
|
+ if (item.id === items) {
|
|
|
+ // 将匹配的项添加到 Set 中
|
|
|
+ uniqueGroupIds.add(item)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ // 将 Set 转换为数组
|
|
|
+ groupIds.value = Array.from(uniqueGroupIds)
|
|
|
+ getGroupNameList()
|
|
|
+ syncLoading.value = false
|
|
|
+ }
|
|
|
+}
|
|
|
+// 打开选择微软组对话框
|
|
|
+const openSelectDialog = () => {
|
|
|
+ getMicrosoftList()
|
|
|
+ loading.value = true
|
|
|
+ microsoftDialog.value = true
|
|
|
+ nextTick(() => {
|
|
|
+ // 清空用户选项
|
|
|
+ multipleTable.value.clearSelection()
|
|
|
+ microsoftList.value.forEach((item) => {
|
|
|
+ groupIds.value.forEach((items) => {
|
|
|
+ if (item.id === items.id) {
|
|
|
+ setTimeout(() => {
|
|
|
+ multipleTable.value.toggleRowSelection(item, true)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
<div class="font pb-40px">
|
|
|
- <h1 class="text-28px leading-40px mb-15px font-700">Settings</h1>
|
|
|
+ <h1 class="text-28px leading-40px mb-15px font-700">Directory Settings</h1>
|
|
|
<div class="flex">
|
|
|
<span class="flex justify-center bg-[#C6C9CC] rounded-t-8px items-center font-bold w-200px h-32px cursor-pointer" @click="active = 'directory'" :class="active === 'directory' && 'active'">Directory</span>
|
|
|
<span class="flex justify-center bg-[#C6C9CC] rounded-t-8px items-center font-bold w-200px h-32px ml-8px cursor-pointer" @click="active = 'domains', getDomainList()" :class="active === 'domains' && 'active'">Domains</span>
|
|
@@ -798,7 +854,7 @@ const handleDisable = () => {
|
|
|
<el-form-item label="Status details:">
|
|
|
<span v-if="props.row.sync" class="text-12px leading-16px">
|
|
|
<div v-if="!Number(props.row.sync?.status)">Synchronizing users/groups</div>
|
|
|
- <div v-else-if="Number(props.row.sync?.status) === 2">SAML user/group sync:Last synced at: {{ scope.row.sync.syncTime }}</div>
|
|
|
+ <div v-else-if="Number(props.row.sync?.status) === 2">SAML user/group sync:Last synced at: {{ props.row.sync.syncTime }}</div>
|
|
|
<div v-else>SAML user/group sync:Last synced succeeded at: {{ props.row.sync.syncTime }}</div>
|
|
|
</span>
|
|
|
<span v-else class="text-12px leading-16px">The directory configuration is incomplete</span>
|
|
@@ -829,7 +885,7 @@ const handleDisable = () => {
|
|
|
<div v-else-if="scope.row.domains.length && !scope.row.sync">Active</div>
|
|
|
<div v-else-if="scope.row.sync">
|
|
|
<div v-if="!Number(scope.row.sync?.status)">Synchronizing...</div>
|
|
|
- <div v-else-if="Number(scope.row.sync?.status) === 2">Last synced at: {{ scope.row.sync.syncTime }}</div>
|
|
|
+ <div v-else-if="Number(scope.row.sync?.status) === 2">Last synced at: {{ scope.row.sync.syncTime }}<br> Status:Fail</div>
|
|
|
<div v-else>Last synced succeeded at: {{ scope.row.sync.syncTime }}</div>
|
|
|
</div>
|
|
|
<div v-else>The directory configuration is incomplete</div>
|
|
@@ -843,21 +899,15 @@ const handleDisable = () => {
|
|
|
Add Domain
|
|
|
</div>
|
|
|
<span class="text-[#D9D9D9]">丨</span>
|
|
|
- <div v-if="!scope.row.domains.length" class="h-20px rounded-4px text-center text-14px leading-20px text-[#1460F3] cursor-pointer"
|
|
|
+ <div v-if="Number(scope.row.sync?.status) === 1 || Number(scope.row.sync?.status) === 2" class="h-20px rounded-4px text-center text-14px leading-20px text-[#1460F3] cursor-pointer"
|
|
|
+ @click="setFrequency = true, directoryId = scope.row.directoryId, daySync(scope.row.scheduleSetting)">
|
|
|
+ Synchronize
|
|
|
+ </div>
|
|
|
+ <div v-else-if="Number(scope.row.sync?.status) === 0" class="text-14px leading-20px text-[#1460F3] cursor-pointer">Synchronizing...</div>
|
|
|
+ <div v-else class="h-20px rounded-4px text-center text-14px leading-20px text-[#1460F3] cursor-pointer"
|
|
|
@click="openSync(scope.row.domains.length), directoryId = scope.row.directoryId, formData.appId = scope.row.applicationId, formData.directoryId = scope.row.tenantId, formData.secret = scope.row.clientSecrets, isCreate = true">
|
|
|
Add Sync
|
|
|
</div>
|
|
|
- <template v-else>
|
|
|
- <div v-if="Number(scope.row.sync?.status) === 1" class="h-20px rounded-4px text-center text-14px leading-20px text-[#1460F3] cursor-pointer"
|
|
|
- @click="setFrequency = true, directoryId = scope.row.directoryId, daySync(scope.row.scheduleSetting)">
|
|
|
- Synchronize
|
|
|
- </div>
|
|
|
- <div v-else-if="Number(scope.row.sync?.status) === 0" class="text-14px leading-20px text-[#1460F3] cursor-pointer">Synchronizing...</div>
|
|
|
- <div v-else class="h-20px rounded-4px text-center text-14px leading-20px text-[#1460F3] cursor-pointer"
|
|
|
- @click="openSync(scope.row.domains.length), directoryId = scope.row.directoryId, formData.appId = scope.row.applicationId, formData.directoryId = scope.row.tenantId, formData.secret = scope.row.clientSecrets, isCreate = true">
|
|
|
- Add Sync
|
|
|
- </div>
|
|
|
- </template>
|
|
|
<span class="text-[#D9D9D9]">丨</span>
|
|
|
<div class="h-20px rounded-4px text-center text-14px leading-20px text-[#1460F3] cursor-pointer">
|
|
|
<el-dropdown>
|
|
@@ -866,9 +916,9 @@ const handleDisable = () => {
|
|
|
<el-dropdown-item>
|
|
|
<button type="submit" :disabled="scope.row.sync?.status === '0'" @click="addDirectory = true, directoryName = scope.row.name, isUpdate = true, directoryId = scope.row.directoryId" :class="scope.row.sync?.status === '0' && 'text-[#979898] cursor-not-allowed'">Directory Settings</button>
|
|
|
</el-dropdown-item>
|
|
|
- <template v-if="scope.row.sync && scope.row.domains.length">
|
|
|
+ <template v-if="scope.row.sync && scope.row.domains?.length">
|
|
|
<el-dropdown-item>
|
|
|
- <button type="submit" @click="directorySetting = true, directoryId = scope.row.directoryId, formData.appId = scope.row.applicationId, formData.directoryId = scope.row.tenantId, formData.secret = scope.row.clientSecrets, isDisable = true, isCreate = false, scopeOption = scope.row.scope">Sync Settings</button>
|
|
|
+ <button type="submit" @click="syncSettings(scope.row)">Sync Settings</button>
|
|
|
</el-dropdown-item>
|
|
|
</template>
|
|
|
<el-dropdown-item>
|
|
@@ -881,7 +931,7 @@ const handleDisable = () => {
|
|
|
<!-- 给目录添加域名弹窗 -->
|
|
|
<el-dialog :visible.sync="openBindDialog" width="556px" top="30vh" center class="addDomain">
|
|
|
<div class="text-[#232A40] text-24px leading-32px font-bold mb-12px w-full text-left flex justify-between items-center">Add Domain <CloseBig class="cursor-pointer" @click.native="openBindDialog = false" /></div>
|
|
|
- <div class="text-[#808185] text-14px leading-20px mb-24px w-full text-left">Select the Domain to add to the directory</div>
|
|
|
+ <div class="text-[#808185] text-14px leading-20px mb-24px w-full text-left">Select the domain to add to the directory</div>
|
|
|
<!-- 可用域名列表 -->
|
|
|
<el-table v-loading="loading" ref="domainTable" class="signSelect" :data="usableDomain" style="width: 100%" @selection-change="handleSelectionChange">
|
|
|
<el-table-column type="selection" width="55" :selectable="selectable"></el-table-column>
|
|
@@ -889,8 +939,13 @@ const handleDisable = () => {
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="status" label="Status" min-width="60px">
|
|
|
<template slot-scope="scope">
|
|
|
- <div class="text-14px leading-20px flex items-center" :class="Number(scope.row.verified) ? 'text-[#41CC00]' : 'text-[#808185]'">
|
|
|
- <span class="flex w-6px h-6px rounded-[50%] mr-8px" :class="Number(scope.row.verified) ? 'bg-[#41CC00]' : 'bg-[#808185]'"></span>{{ Number(scope.row.verified) ? 'Verified' : 'Unverified' }}
|
|
|
+ <div class="text-14px leading-20px flex items-center" :class="Number(scope.row.used) ? 'text-[#FFAE49]' : 'text-[#41CC00]'">
|
|
|
+ <template v-if="Number(scope.row.used)">
|
|
|
+ Occupied
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ Verified
|
|
|
+ </template>
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
@@ -930,7 +985,7 @@ const handleDisable = () => {
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 添加同步设置模块 -->
|
|
|
- <div v-show="directorySetting">
|
|
|
+ <div v-show="directorySetting" v-loading="syncLoading">
|
|
|
<div @click="directorySetting = false" class="flex items-center text-[#505258] text-14px leading-20px py-2px mb-12px cursor-pointer"><img src="@/assets/images/back.png" width="12" height="12" class="mr-5px" />Back</div>
|
|
|
<div class="text-[#232A40] text-28px leading-40px mb-16px font-bold">SAML User Sync Configuration</div>
|
|
|
<div class="text-[#232A40] font-bold test-16px leading-20px mt-16px mb-4px">Connector:</div>
|
|
@@ -1017,7 +1072,7 @@ const handleDisable = () => {
|
|
|
</el-form>
|
|
|
<div v-show="Number(scopeOption) === 2">
|
|
|
<div class="text-[#232A40] text-14px leading-20px mb-8px">Class range<span class="text-[#FF5054] text-18px ml-2px align-bottom">*</span></div>
|
|
|
- <button type="submit" @click="microsoftDialog = true, getMicrosoftList(), loading = true"
|
|
|
+ <button type="submit" @click="openSelectDialog"
|
|
|
:class="isDisable && '!bg-[#1460F333] !text-white border-none'" :disabled="isDisable"
|
|
|
class="w-172px h-32px flex justify-center font-600 items-center border-1 border-[#1460F3] text-[#1460F3] cursor-pointer rounded-8px">
|
|
|
Select group range
|
|
@@ -1059,7 +1114,7 @@ const handleDisable = () => {
|
|
|
<div v-show="tag === 'https'">
|
|
|
<div class="mt-8px text-16px leading-20px text-[#232A40]">1. Download the verification file.</div>
|
|
|
<div class="flex mt-12px text-14px leading-20px">
|
|
|
- <div class="py-4px text-[#505258]" ref="copyText">PDFTech-Editor-domain-verification.txt</div>
|
|
|
+ <div class="py-4px text-[#505258]" ref="copyText">PDF-Tech-Editor-domain-verification.txt</div>
|
|
|
<div class="border-1px border-[#1460F3] py-4px px-8px text-[#1460F3] rounded-4px ml-8px hover:bg-[#e8effe] cursor-pointer" @click="downHTTPSFile">Download</div>
|
|
|
</div>
|
|
|
<div class="my-4px text-[#808185] text-14px leading-20px">The same file can be used for multiple domains. It includes information that will allow us to verify that you own the domain.</div>
|
|
@@ -1185,14 +1240,11 @@ const handleDisable = () => {
|
|
|
</p>
|
|
|
<div class="scrollbar relative w-full p-24px flex flex-col items-center bg-[#F6F7F999] max-h-520px overflow-auto">
|
|
|
<div class="w-full relative mb-12px">
|
|
|
- <el-input v-model="queryString" size="mini" clearable class="input-with-select" placeholder="Search user name or email" @clear="getMicrosoftList">
|
|
|
- </el-input>
|
|
|
- <button class="absolute top-8px right-8px" @click="getMicrosoftList">
|
|
|
- <Search />
|
|
|
- </button>
|
|
|
+ <el-input v-model="queryString" size="mini" clearable class="input-with-select" placeholder="Search user name or email" @clear="getMicrosoftList"></el-input>
|
|
|
+ <button class="absolute top-8px right-8px" @click="getMicrosoftList"><Search /></button>
|
|
|
</div>
|
|
|
- <div v-show="loading" class="absolute z-9999 top-26vh text-[#808185] max-w-400px text-center">It may take a while for the data to be synchronized if the volume of data is large. Please be patient.</div>
|
|
|
<el-table
|
|
|
+ height="450"
|
|
|
ref="multipleTable"
|
|
|
v-loading="loading"
|
|
|
element-loading-text="Group is synchronizing..."
|
|
@@ -1200,11 +1252,12 @@ const handleDisable = () => {
|
|
|
tooltip-effect="dark"
|
|
|
:key="resetTableHeader"
|
|
|
:row-key="getRowKeys"
|
|
|
- @selection-change="handleSelectionChanges"
|
|
|
+ @select="handleSelectionChanges"
|
|
|
+ @select-all="handleSelectionChanges"
|
|
|
>
|
|
|
- <el-table-column type="selection" width="55" :reserve-selection="true"> </el-table-column>
|
|
|
- <el-table-column prop="displayName" label="Group Name" min-width="100px"></el-table-column>
|
|
|
- <el-table-column min-width="275px">
|
|
|
+ <el-table-column type="selection" width="55" :reserve-selection="true"></el-table-column>
|
|
|
+ <el-table-column prop="displayName" label="Group Name" min-width="120px"></el-table-column>
|
|
|
+ <el-table-column min-width="200px">
|
|
|
<div slot="header" class="flex justify-end items-center text-14px leading-20px font-400 pr-8px text-[#808185]">
|
|
|
Selected/Total:
|
|
|
{{ groupIds.length }} / {{ microsoftTotal }}
|
|
@@ -1219,7 +1272,7 @@ const handleDisable = () => {
|
|
|
<div class="flex justify-between items-center w-full mt-24px">
|
|
|
<div @click="getMicrosoftList(), loading = true" class="text-[#1460F3] cursor-pointer">{{ microsoftList ? 'Sync group' : 'Refresh list' }}</div>
|
|
|
<div class="flex">
|
|
|
- <div class="bg-white rounded-8px text-16px leading-20px py-10px flex justify-center font-bold text-[#1460F3] w-152px border-1 border-[#1460F3] mr-16px hover:bg-[#e8effe] cursor-pointer" @click="microsoftDialog = false, getGroupNameList()">Cancel</div>
|
|
|
+ <div class="bg-white rounded-8px text-16px leading-20px py-10px flex justify-center font-bold text-[#1460F3] w-152px border-1 border-[#1460F3] mr-16px hover:bg-[#e8effe] cursor-pointer" @click="microsoftDialog = false">Cancel</div>
|
|
|
<div class="bg-[#1460F3] rounded-8px text-16px leading-20px py-10px flex justify-center font-bold text-white w-152px hover:bg-[#4380f5] cursor-pointer" @click="microsoftDialog = false, getGroupNameList()">Add</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -1268,14 +1321,14 @@ const handleDisable = () => {
|
|
|
height: 40px;
|
|
|
}
|
|
|
}
|
|
|
-.scrollbar::-webkit-scrollbar{
|
|
|
+.scrollbar::-webkit-scrollbar {
|
|
|
width: 4px;
|
|
|
height: 4px;
|
|
|
}
|
|
|
-.scrollbar::-webkit-scrollbar-track{
|
|
|
+.scrollbar::-webkit-scrollbar-track {
|
|
|
display: none;
|
|
|
}
|
|
|
-.scrollbar::-webkit-scrollbar-thumb{
|
|
|
+.scrollbar::-webkit-scrollbar-thumb {
|
|
|
border-radius: 10px;
|
|
|
background: #E2E3E5;
|
|
|
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
|