feat: 修改证书信息

frontend/src/lang/modules/zh.ts

@@ -856,7 +856,7 @@ export default {
         provider: '验证方式',
         dnsCommon: '手动解析',
         expireDate: '过期时间',
-        brand: '品牌',
+        brand: '颁发者',
         deploySSL: '部署',
         deploySSLHelper: '确定部署证书？',
         ssl: '证书',
@@ -940,7 +940,7 @@ export default {
         SSLProConfig: 'SSL 协议设置',
         supportProtocol: '支持的协议版本',
         encryptionAlgorithm: '加密算法',
-        notSecurity: ' 不安全',
+        notSecurity: '（不安全）',
         encryptHelper:
             "Let's Encrypt 签发证书有频率限制，但足以满足正常需求，过于频繁操作会导致签发失败。具体限制请看 <a target=“_blank” href='https://letsencrypt.org/zh-cn/docs/rate-limits/'>官方文档</a> ",
         ipValue: 'IP值',
@@ -984,6 +984,7 @@ export default {
         ssl: '证书',
         key: '私钥',
         startDate: '生效时间',
+        organization: '签发机构',
     },
     firewall: {
         ccDeny: 'CC 防护',

frontend/src/utils/util.ts

@@ -1,3 +1,5 @@
+import i18n from '@/lang';
+
 export function deepCopy<T>(obj: any): T {
     let newObj: any;
     try {
@@ -155,3 +157,16 @@ export function checkIp(value: string): boolean {
         return false;
     }
 }
+
+export function getProvider(provider: string): string {
+    switch (provider) {
+        case 'dnsAccount':
+            return i18n.global.t('website.dnsAccount');
+        case 'dnsManual':
+            return i18n.global.t('website.dnsManual');
+        case 'http':
+            return 'HTTP';
+        default:
+            return i18n.global.t('ssl.manualCreate');
+    }
+}

frontend/src/views/website/ssl/detail/index.vue

@@ -1,5 +1,5 @@
 <template>
-    <el-dialog v-model="open" :before-close="handleClose" :title="$t('ssl.detail')">
+    <el-dialog v-model="open" :before-close="handleClose" :title="$t('ssl.detail')" width="30%">
         <div>
             <el-radio-group v-model="curr">
                 <el-radio-button label="detail">{{ $t('ssl.msg') }}</el-radio-button>
@@ -16,6 +16,18 @@
                     <el-descriptions-item :label="$t('website.otherDomains')">
                         {{ ssl.otherDomains }}
                     </el-descriptions-item>
+                    <el-descriptions-item :label="$t('ssl.provider')">
+                        {{ getProvider(ssl.provider) }}
+                    </el-descriptions-item>
+                    <el-descriptions-item
+                        :label="$t('ssl.acmeAccount')"
+                        v-if="ssl.acmeAccount && ssl.provider !== 'manual'"
+                    >
+                        {{ ssl.acmeAccount.email }}
+                    </el-descriptions-item>
+                    <el-descriptions-item :label="$t('website.brand')">
+                        {{ ssl.type }}
+                    </el-descriptions-item>
                     <el-descriptions-item :label="$t('ssl.startDate')">
                         {{ dateFromat(0, 0, ssl.startDate) }}
                     </el-descriptions-item>
@@ -44,7 +56,7 @@
 <script lang="ts" setup>
 import { GetSSL } from '@/api/modules/website';
 import { ref } from 'vue';
-import { dateFromat } from '@/utils/util';
+import { dateFromat, getProvider } from '@/utils/util';
 import { ElMessage } from 'element-plus';
 import i18n from '@/lang';
 

frontend/src/views/website/ssl/index.vue

@@ -74,7 +74,7 @@ import AcmeAccount from './acme-account/index.vue';
 import Renew from './renew/index.vue';
 import Create from './create/index.vue';
 import Detail from './detail/index.vue';
-import { dateFromat } from '@/utils/util';
+import { dateFromat, getProvider } from '@/utils/util';
 import i18n from '@/lang';
 import { Website } from '@/api/interface/website';
 import { useDeleteData } from '@/hooks/use-delete-data';
@@ -152,19 +152,6 @@ const deleteSSL = async (id: number) => {
     search();
 };
 
-const getProvider = (provider: string) => {
-    switch (provider) {
-        case 'dnsAccount':
-            return i18n.global.t('website.dnsAccount');
-        case 'dnsManual':
-            return i18n.global.t('website.dnsAccount');
-        case 'http':
-            return 'HTTP';
-        default:
-            return i18n.global.t('ssl.manualCreate');
-    }
-};
-
 onMounted(() => {
     search();
 });

frontend/src/views/website/website/config/basic/https/index.vue

@@ -55,13 +55,22 @@
                         </el-form-item>
                     </div>
                     <el-form-item :label="' '" v-if="websiteSSL && websiteSSL.id > 0">
-                        <el-descriptions :column="3" border direction="vertical">
+                        <el-descriptions :column="5" border direction="vertical">
                             <el-descriptions-item :label="$t('website.primaryDomain')">
                                 {{ websiteSSL.primaryDomain }}
                             </el-descriptions-item>
                             <el-descriptions-item :label="$t('website.otherDomains')">
                                 {{ websiteSSL.otherDomains }}
                             </el-descriptions-item>
+                            <el-descriptions-item :label="$t('ssl.provider')">
+                                {{ getProvider(websiteSSL.provider) }}
+                            </el-descriptions-item>
+                            <el-descriptions-item
+                                :label="$t('ssl.acmeAccount')"
+                                v-if="websiteSSL.acmeAccount && websiteSSL.provider !== 'manual'"
+                            >
+                                {{ websiteSSL.acmeAccount.email }}
+                            </el-descriptions-item>
                             <el-descriptions-item :label="$t('website.expireDate')">
                                 {{ dateFromat(1, 1, websiteSSL.expireDate) }}
                             </el-descriptions-item>
@@ -112,9 +121,9 @@ import { Website } from '@/api/interface/website';
 import { GetHTTPSConfig, ListSSL, UpdateHTTPSConfig } from '@/api/modules/website';
 import { ElMessage, ElMessageBox, FormInstance } from 'element-plus';
 import { computed, onMounted, reactive, ref } from 'vue';
-import { dateFromat } from '@/utils/util';
 import i18n from '@/lang';
 import { Rules } from '@/global/form-rules';
+import { dateFromat, getProvider } from '@/utils/util';
 
 const props = defineProps({
     id: {
@@ -187,10 +196,10 @@ const get = () => {
             if (res.data.algorithm != '') {
                 form.algorithm = res.data.algorithm;
             }
-        }
-        if (res.data?.SSL && res.data?.SSL.id > 0) {
-            form.websiteSSLId = res.data.SSL.id;
-            websiteSSL.value = res.data.SSL;
+            if (res.data.SSL && res.data.SSL.id > 0) {
+                form.websiteSSLId = res.data.SSL.id;
+                websiteSSL.value = res.data.SSL;
+            }
         }
         listSSL();
     });
@@ -215,6 +224,9 @@ const submit = async (formEl: FormInstance | undefined) => {
 };
 
 const changeEnable = (enable: boolean) => {
+    if (enable) {
+        listSSL();
+    }
     if (resData.value.enable && !enable) {
         ElMessageBox.confirm(i18n.global.t('website.disbaleHTTTPSHelper'), i18n.global.t('website.disbaleHTTTPS'), {
             confirmButtonText: i18n.global.t('commons.button.confirm'),

frontend/src/views/website/website/create/index.vue

@@ -6,123 +6,130 @@
         width="40%"
         :before-close="handleClose"
     >
-        <el-form
-            ref="websiteForm"
-            label-position="right"
-            :model="website"
-            label-width="130px"
-            :rules="rules"
-            :validate-on-rule-change="false"
-        >
-            <el-form-item :label="$t('website.type')" prop="type">
-                <el-select v-model="website.type">
-                    <el-option :label="$t('website.deployment')" value="deployment"></el-option>
-                    <el-option :label="$t('website.static')" value="static"></el-option>
-                    <el-option :label="$t('website.proxy')" value="proxy"></el-option>
-                </el-select>
-            </el-form-item>
-            <el-form-item :label="$t('website.group')" prop="webSiteGroupId">
-                <el-select v-model="website.webSiteGroupId">
-                    <el-option
-                        v-for="(group, index) in groups"
-                        :key="index"
-                        :label="group.name"
-                        :value="group.id"
-                    ></el-option>
-                </el-select>
-            </el-form-item>
-            <div v-if="website.type === 'deployment'">
-                <el-form-item prop="appType">
-                    <el-radio-group v-model="website.appType" @change="changeAppType(website.appType)">
-                        <el-radio :label="'installed'" :value="'installed'">
-                            {{ $t('website.appInstalled') }}
-                        </el-radio>
-                        <el-radio :label="'new'">
-                            {{ $t('website.appNew') }}
-                        </el-radio>
-                    </el-radio-group>
-                </el-form-item>
-                <el-form-item
-                    v-if="website.appType == 'installed'"
-                    :label="$t('website.appInstalled')"
-                    prop="appInstallId"
+        <el-row>
+            <el-col :span="22" :offset="1">
+                <el-form
+                    ref="websiteForm"
+                    label-position="right"
+                    :model="website"
+                    label-width="68px"
+                    :rules="rules"
+                    :validate-on-rule-change="false"
                 >
-                    <el-select v-model="website.appInstallId">
-                        <el-option
-                            v-for="(appInstall, index) in appInstalles"
-                            :key="index"
-                            :label="appInstall.name"
-                            :value="appInstall.id"
-                        ></el-option>
-                    </el-select>
-                </el-form-item>
-                <div v-if="website.appType == 'new'">
-                    <el-form-item :label="$t('app.app')" prop="appinstall.appId">
-                        <el-row :gutter="20">
-                            <el-col :span="12">
-                                <el-select v-model="website.appinstall.appId" @change="getApp()">
-                                    <el-option
-                                        v-for="(app, index) in apps"
-                                        :key="index"
-                                        :label="app.name"
-                                        :value="app.id"
-                                    ></el-option>
-                                </el-select>
-                            </el-col>
-                            <el-col :span="12">
-                                <el-select
-                                    v-model="website.appinstall.version"
-                                    @change="getAppDetail(website.appinstall.version)"
-                                >
-                                    <el-option
-                                        v-for="(version, index) in appVersions"
-                                        :key="index"
-                                        :label="version"
-                                        :value="version"
-                                    ></el-option>
-                                </el-select>
-                            </el-col>
-                        </el-row>
+                    <el-form-item :label="$t('website.type')" prop="type">
+                        <el-select v-model="website.type">
+                            <el-option :label="$t('website.deployment')" value="deployment"></el-option>
+                            <el-option :label="$t('website.static')" value="static"></el-option>
+                            <el-option :label="$t('website.proxy')" value="proxy"></el-option>
+                        </el-select>
                     </el-form-item>
-                    <el-form-item :label="$t('app.name')" prop="appinstall.name">
-                        <el-input v-model="website.appinstall.name"></el-input>
+                    <el-form-item :label="$t('website.group')" prop="webSiteGroupId">
+                        <el-select v-model="website.webSiteGroupId">
+                            <el-option
+                                v-for="(group, index) in groups"
+                                :key="index"
+                                :label="group.name"
+                                :value="group.id"
+                            ></el-option>
+                        </el-select>
                     </el-form-item>
-                    <Params
-                        :key="paramKey"
-                        v-model:form="website.appinstall.params"
-                        v-model:rules="rules.appinstall.params"
-                        :params="appParams"
-                        :propStart="'appinstall.params.'"
-                    ></Params>
-                </div>
-            </div>
-            <el-form-item :label="$t('website.primaryDomain')" prop="primaryDomain">
-                <el-input v-model.trim="website.primaryDomain" @input="changeAlias(website.primaryDomain)"></el-input>
-            </el-form-item>
-            <el-form-item :label="$t('website.otherDomains')" prop="otherDomains">
-                <el-input
-                    type="textarea"
-                    :autosize="{ minRows: 2, maxRows: 6 }"
-                    v-model="website.otherDomains"
-                    :placeholder="$t('website.domainHelper')"
-                ></el-input>
-            </el-form-item>
-            <el-form-item :label="$t('website.alias')" prop="alias">
-                <el-input v-model.trim="website.alias" :placeholder="$t('website.aliasHelper')"></el-input>
-                <div>
-                    <span class="input-help">
-                        <span>{{ $t('website.staticPath') + staticPath + website.alias }}</span>
-                        <span v-if="website.type === 'static' && website.alias != ''">{{ '/index' }}</span>
-                    </span>
-                </div>
-            </el-form-item>
-            <el-form-item v-if="website.type === 'proxy'" :label="$t('website.proxyAddress')" prop="proxy">
-                <el-input v-model="website.proxy" :placeholder="$t('website.proxyHelper')"></el-input>
-            </el-form-item>
-            <el-form-item :label="$t('website.remark')" prop="remark">
-                <el-input v-model="website.remark"></el-input>
-            </el-form-item>
-        </el-form>
+                    <div v-if="website.type === 'deployment'">
+                        <el-form-item prop="appType">
+                            <el-radio-group v-model="website.appType" @change="changeAppType(website.appType)">
+                                <el-radio :label="'installed'" :value="'installed'">
+                                    {{ $t('website.appInstalled') }}
+                                </el-radio>
+                                <el-radio :label="'new'">
+                                    {{ $t('website.appNew') }}
+                                </el-radio>
+                            </el-radio-group>
+                        </el-form-item>
+                        <el-form-item
+                            v-if="website.appType == 'installed'"
+                            :label="$t('website.appInstalled')"
+                            prop="appInstallId"
+                        >
+                            <el-select v-model="website.appInstallId">
+                                <el-option
+                                    v-for="(appInstall, index) in appInstalles"
+                                    :key="index"
+                                    :label="appInstall.name"
+                                    :value="appInstall.id"
+                                ></el-option>
+                            </el-select>
+                        </el-form-item>
+                        <div v-if="website.appType == 'new'">
+                            <el-form-item :label="$t('app.app')" prop="appinstall.appId">
+                                <el-row :gutter="20">
+                                    <el-col :span="12">
+                                        <el-select v-model="website.appinstall.appId" @change="getApp()">
+                                            <el-option
+                                                v-for="(app, index) in apps"
+                                                :key="index"
+                                                :label="app.name"
+                                                :value="app.id"
+                                            ></el-option>
+                                        </el-select>
+                                    </el-col>
+                                    <el-col :span="12">
+                                        <el-select
+                                            v-model="website.appinstall.version"
+                                            @change="getAppDetail(website.appinstall.version)"
+                                        >
+                                            <el-option
+                                                v-for="(version, index) in appVersions"
+                                                :key="index"
+                                                :label="version"
+                                                :value="version"
+                                            ></el-option>
+                                        </el-select>
+                                    </el-col>
+                                </el-row>
+                            </el-form-item>
+                            <el-form-item :label="$t('app.name')" prop="appinstall.name">
+                                <el-input v-model="website.appinstall.name"></el-input>
+                            </el-form-item>
+                            <Params
+                                :key="paramKey"
+                                v-model:form="website.appinstall.params"
+                                v-model:rules="rules.appinstall.params"
+                                :params="appParams"
+                                :propStart="'appinstall.params.'"
+                            ></Params>
+                        </div>
+                    </div>
+                    <el-form-item :label="$t('website.primaryDomain')" prop="primaryDomain">
+                        <el-input
+                            v-model.trim="website.primaryDomain"
+                            @input="changeAlias(website.primaryDomain)"
+                        ></el-input>
+                    </el-form-item>
+                    <el-form-item :label="$t('website.otherDomains')" prop="otherDomains">
+                        <el-input
+                            type="textarea"
+                            :autosize="{ minRows: 2, maxRows: 6 }"
+                            v-model="website.otherDomains"
+                            :placeholder="$t('website.domainHelper')"
+                        ></el-input>
+                    </el-form-item>
+                    <el-form-item :label="$t('website.alias')" prop="alias">
+                        <el-input v-model.trim="website.alias" :placeholder="$t('website.aliasHelper')"></el-input>
+                        <div>
+                            <span class="input-help">
+                                <span>{{ $t('website.staticPath') + staticPath + website.alias }}</span>
+                                <span v-if="website.type === 'static' && website.alias != ''">{{ '/index' }}</span>
+                            </span>
+                        </div>
+                    </el-form-item>
+                    <el-form-item v-if="website.type === 'proxy'" :label="$t('website.proxyAddress')" prop="proxy">
+                        <el-input v-model="website.proxy" :placeholder="$t('website.proxyHelper')"></el-input>
+                    </el-form-item>
+                    <el-form-item :label="$t('website.remark')" prop="remark">
+                        <el-input v-model="website.remark"></el-input>
+                    </el-form-item>
+                </el-form>
+            </el-col>
+        </el-row>
         <template #footer>
             <span class="dialog-footer">
                 <el-button @click="handleClose" :disabled="loading">{{ $t('commons.button.cancel') }}</el-button>