3x-ui/web/html/xui/form/tls_settings.html

{{define "form/tlsSettings"}}
<!-- tls enable -->
<a-form layout="inline" v-if="inbound.canSetTls()">
    <a-form-item label="TLS">
        <a-switch v-model="inbound.tls">
        </a-switch>
    </a-form-item>
    <a-form-item v-if="inbound.canEnableXTLS()" label="XTLS">
        <a-switch v-model="inbound.XTLS"></a-switch>
    </a-form-item>
</a-form>

<!-- tls settings -->
<a-form v-if="inbound.tls || inbound.XTLS" layout="inline">
    <a-form-item label="SNI" placeholder="Server Name Indication" v-if="inbound.tls">
        <a-input v-model.trim="inbound.stream.tls.settings[0].serverName"></a-input>
    </a-form-item>
    <a-form-item label="CipherSuites">
        <a-select v-model="inbound.stream.tls.cipherSuites" style="width: 300px">
            <a-select-option value="">auto</a-select-option>
            <a-select-option v-for="key in TLS_CIPHER_OPTION" :value="key">[[ key ]]</a-select-option>
        </a-select>
    </a-form-item>
    <a-form-item label="MinVersion">
        <a-select v-model="inbound.stream.tls.minVersion" style="width: 60px" :dropdown-class-name="siderDrawer.isDarkTheme ? 'ant-card-dark' : ''">
            <a-select-option v-for="key in TLS_VERSION_OPTION" :value="key">[[ key ]]</a-select-option>
        </a-select>
    </a-form-item>
    <a-form-item label="MaxVersion">
        <a-select v-model="inbound.stream.tls.maxVersion" style="width: 60px" :dropdown-class-name="siderDrawer.isDarkTheme ? 'ant-card-dark' : ''">
            <a-select-option v-for="key in TLS_VERSION_OPTION" :value="key">[[ key ]]</a-select-option>
        </a-select>
    </a-form-item>
    <a-form-item label="uTLS" v-if="inbound.tls" >
        <a-select v-model="inbound.stream.tls.settings[0].fingerprint" style="width: 135px">
            <a-select-option value=''>None</a-select-option>
            <a-select-option v-for="key in UTLS_FINGERPRINT" :value="key">[[ key ]]</a-select-option>
        </a-select>
    </a-form-item>
    <a-form-item label='{{ i18n "domainName" }}'>
        <a-input v-model.trim="inbound.stream.tls.server"></a-input>
    </a-form-item>
    <a-form-item label="Alpn">
        <a-checkbox-group v-model="inbound.stream.tls.alpn" style="width:200px">
            <a-checkbox v-for="key in ALPN_OPTION" :value="key">[[ key ]]</a-checkbox>
        </a-checkbox-group>
    </a-form-item>
    <a-form-item label="Allow insecure">
        <a-switch v-model="inbound.stream.tls.settings[0].allowInsecure"></a-switch>
    </a-form-item>
    <a-form-item label='{{ i18n "certificate" }}'>
        <a-radio-group v-model="inbound.stream.tls.certs[0].useFile" button-style="solid">
            <a-radio-button :value="true">{{ i18n "pages.inbounds.certificatePath" }}</a-radio-button>
            <a-radio-button :value="false">{{ i18n "pages.inbounds.certificateContent" }}</a-radio-button>
        </a-radio-group>
    </a-form-item>
    <template v-if="inbound.stream.tls.certs[0].useFile">
        <a-form-item label='{{ i18n "pages.inbounds.publicKeyPath" }}'>
            <a-input v-model.trim="inbound.stream.tls.certs[0].certFile" style="width:300px;"></a-input>
        </a-form-item>
        <a-form-item label='{{ i18n "pages.inbounds.keyPath" }}'>
            <a-input v-model.trim="inbound.stream.tls.certs[0].keyFile" style="width:300px;"></a-input>
        </a-form-item>
    </template>
    <template v-else>
        <a-form-item label='{{ i18n "pages.inbounds.publicKeyContent" }}'>
            <a-input type="textarea" :rows="3" style="width:300px;" v-model="inbound.stream.tls.certs[0].cert"></a-input>
        </a-form-item>
        <a-form-item label='{{ i18n "pages.inbounds.keyContent" }}'>
            <a-input type="textarea" :rows="3" style="width:300px;" v-model="inbound.stream.tls.certs[0].key"></a-input>
        </a-form-item>
    </template>
</a-form>
{{end}}