|
|
|
@ -89,11 +89,18 @@ |
|
|
|
<el-form-item label="备注" prop="remark"> |
|
|
|
<el-input v-model="form.remark" placeholder="请输入" style="width: 580px;" type="textarea" :rows="3" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item v-if="crud.status.edit !== 1" label="电子原文" prop="pfxFileName" class="upload-ca-file"> |
|
|
|
<el-input v-model="form.pfxFileName" style="width: 460px;" readonly /> |
|
|
|
<el-form-item v-if="crud.status.edit !== 1" label="pem文件" prop="pemFile" class="upload-ca-file"> |
|
|
|
<el-input v-model="form.pemFile" style="width: 460px;" readonly /> |
|
|
|
<div class="upload-img"> |
|
|
|
<input ref="fileInput" class="upload-input" type="file" accept=".pfx" @change="handleFileUpload"> |
|
|
|
<el-button size="small" :disabled="crud.status.edit === 1" type="primary" @click="openFileSelector"><i class="iconfont icon-shangchuan" />点击上传</el-button> |
|
|
|
<input ref="pemFileInput" class="upload-input" type="file" accept=".pem" @change="handleFileUpload"> |
|
|
|
<el-button size="small" :disabled="crud.status.edit === 1" type="primary" @click="openPemFileSelector"><i class="iconfont icon-shangchuan" />点击上传</el-button> |
|
|
|
</div> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item v-if="crud.status.edit !== 1" label="key文件" prop="keyFile" class="upload-ca-file"> |
|
|
|
<el-input v-model="form.keyFile" style="width: 460px;" readonly /> |
|
|
|
<div class="upload-img"> |
|
|
|
<input ref="keyFileInput" class="upload-input" type="file" accept=".key" @change="handleFileUpload"> |
|
|
|
<el-button size="small" :disabled="crud.status.edit === 1" type="primary" @click="openKeyFileSelector"><i class="iconfont icon-shangchuan" />点击上传</el-button> |
|
|
|
</div> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item v-if="crud.status.edit !== 1" label="证书密码" prop="extractPassword"> |
|
|
|
@ -101,17 +108,18 @@ |
|
|
|
<i slot="suffix" class="iconfont icon-mimachakan" @click="showPassword = !showPassword" /> |
|
|
|
</el-input> |
|
|
|
</el-form-item> |
|
|
|
<div v-if="crud.status.edit !== 1" class="certVerify-style"> |
|
|
|
<!-- <div v-if="crud.status.edit !== 1" class="certVerify-style"> |
|
|
|
<el-button :loading="certVerifyLoadingbtn" @click="handleCertVerify"><i class="iconfont icon-yanzhengma" />证书验证</el-button> |
|
|
|
<div v-if="caCertStatus" style="display: inline-block; margin-left: 20px;"> |
|
|
|
<p v-if="isCertVerification"> <i class="iconfont icon-shi" style="color: #1AAE93;" />{{ caCertStatus }}</p> |
|
|
|
<p v-else><i class="iconfont icon-cuowu1" style="color: #F65163; font-size: 18px;" />{{ caCertStatus }}</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> --> |
|
|
|
</el-form> |
|
|
|
<div slot="footer" class="dialog-footer"> |
|
|
|
<el-button type="text" @click="crud.cancelCU">取消</el-button> |
|
|
|
<el-button :disabled="!isCertVerification && crud.status.edit !== 1" :loading="confirmUploadLoading" type="primary" @click="handleConfirmUpload">保存</el-button> |
|
|
|
<!-- :disabled="!isCertVerification && crud.status.edit !== 1" --> |
|
|
|
<el-button :loading="confirmUploadLoading" type="primary" @click="handleConfirmUpload">保存</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-dialog> |
|
|
|
@ -198,7 +206,9 @@ import { verifyMaintenance } from '@/api/system/field' |
|
|
|
import { encrypt } from '@/utils/rsaEncrypt' |
|
|
|
import { caCertUpload, editCaCertificate, VerifyCaPfxCertificates } from '@/utils/upload' |
|
|
|
|
|
|
|
const defaultForm = { id: null, name: null, extractPassword: null, pfxFile: null, pfxFileName: null, remark: '' } |
|
|
|
// const defaultForm = { id: null, name: null, extractPassword: null, pfxFile: null, pfxFileName: null, remark: '' } |
|
|
|
// pfxFile: null, pfxFileName: null, |
|
|
|
const defaultForm = { id: null, name: null, extractPassword: null, pemFile: null, keyFile: null, pemFileName: null, keyFileName: null, remark: '' } |
|
|
|
|
|
|
|
export default { |
|
|
|
name: 'CaCertificate', |
|
|
|
@ -227,8 +237,11 @@ export default { |
|
|
|
name: [ |
|
|
|
{ required: true, message: '名称不可为空', trigger: 'blur' } |
|
|
|
], |
|
|
|
pfxFileName: [ |
|
|
|
{ required: true, message: '请上传pfx文件', trigger: 'blur' } |
|
|
|
pemFile: [ |
|
|
|
{ required: true, message: '请上传pem文件', trigger: 'blur' } |
|
|
|
], |
|
|
|
keyFile: [ |
|
|
|
{ required: true, message: '请上传key文件', trigger: 'blur' } |
|
|
|
], |
|
|
|
extractPassword: [ |
|
|
|
{ required: true, message: '证书密码不可为空', trigger: 'blur' } |
|
|
|
@ -243,6 +256,8 @@ export default { |
|
|
|
currentRow: null, |
|
|
|
confirmUploadLoading: false, |
|
|
|
selectedFile: null, |
|
|
|
pemFile: null, |
|
|
|
keyFile: null, |
|
|
|
isCertVerification: false, |
|
|
|
certVerifyLoadingbtn: false, |
|
|
|
showPassword: false, |
|
|
|
@ -373,8 +388,11 @@ export default { |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
openFileSelector() { |
|
|
|
this.$refs.fileInput.click() |
|
|
|
openPemFileSelector() { |
|
|
|
this.$refs.pemFileInput.click() |
|
|
|
}, |
|
|
|
openKeyFileSelector() { |
|
|
|
this.$refs.keyFileInput.click() |
|
|
|
}, |
|
|
|
handleClose() { |
|
|
|
if (this.$refs.verfiyForm) { |
|
|
|
@ -387,26 +405,31 @@ export default { |
|
|
|
}, |
|
|
|
async handleFileUpload(event) { |
|
|
|
const file = event.target.files[0] |
|
|
|
if (!file) return // 取消选择时直接返回 |
|
|
|
if (!file) return |
|
|
|
|
|
|
|
// 验证文件类型(PFX格式) |
|
|
|
const isPFX = file.type === 'application/x-pkcs12' || file.name.endsWith('.pfx') |
|
|
|
// 验证文件大小(可根据需求调整,这里保持2MB) |
|
|
|
// const isLt2M = file.size / 1024 / 1024 < 2 |
|
|
|
const accept = event.target.accept |
|
|
|
let isValid = false |
|
|
|
let fileType = '' |
|
|
|
let fileObj = null |
|
|
|
|
|
|
|
if (accept === '.pem') { |
|
|
|
isValid = file.type === 'text/plain' || file.name.endsWith('.pem') |
|
|
|
fileType = 'pemFile' |
|
|
|
fileObj = 'pemFile' |
|
|
|
} else if (accept === '.key') { |
|
|
|
isValid = file.type === 'text/plain' || file.name.endsWith('.key') |
|
|
|
fileType = 'keyFile' |
|
|
|
fileObj = 'keyFile' |
|
|
|
} |
|
|
|
|
|
|
|
if (!isPFX) { |
|
|
|
this.$message({ message: '请上传PFX格式的证书文件', type: 'error', offset: 8 }) |
|
|
|
if (!isValid) { |
|
|
|
this.$message({ message: `请上传${accept}格式的文件`, type: 'error', offset: 8 }) |
|
|
|
event.target.value = '' |
|
|
|
return false |
|
|
|
} |
|
|
|
// if (!isLt2M) { |
|
|
|
// this.$message({ message: '文件大小不能超过 2MB', type: 'error', offset: 8 }) |
|
|
|
// event.target.value = '' |
|
|
|
// return false |
|
|
|
// } |
|
|
|
|
|
|
|
this.selectedFile = file |
|
|
|
this.form.pfxFileName = file.name |
|
|
|
this.form[fileType] = file.name |
|
|
|
this[fileObj] = file |
|
|
|
event.target.value = '' |
|
|
|
}, |
|
|
|
handleConfirmUpload() { |
|
|
|
@ -446,7 +469,7 @@ export default { |
|
|
|
}) |
|
|
|
} else { |
|
|
|
caCertUpload(this.baseApi + '/api/oauthClient/uploadCaCertificate', |
|
|
|
this.selectedFile, params |
|
|
|
this.pemFile, this.keyFile, params |
|
|
|
).then(res => { |
|
|
|
console.log('res666', res) |
|
|
|
if (res.data.code === 200) { |
|
|
|
|