1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980 |
- <template>
- <div>
- <div style="text-align: center;line-height: 50px;">
- <span class="main-title" style="margin: 0 10px;font-weight: bold;" >专业能力证书查询</span>
- </div>
- <div>
- <div class="label-box">
- <div class="label-title">
- <p>持证人姓名</p>
- <p>(或持证单位全称)</p>
- </div>
- <input type="text" v-model="userName" class="label-input" />
- </div>
- <div class="label-box">
- <div class="label-title">
- <p>证书编码</p>
- </div>
- <input type="text" v-model="certNumber" class="label-input" />
- </div>
- <div class="label-box">
- <div class="label-title">
- <p>验证码<span class="label-must">*</span></p>
- </div>
- <input type="text" v-model="code" class="label-input" style="border-color:#acb1b5"/>
- <div class="captcha-img">
- <img :src="codeUrl" @click="getCode" class="login-code-img"/>
- </div>
- </div>
- <div class="btn-box">
- <button class="btn-reset">重置</button>
- <button class="btn-search" @click="handleSearch">查询</button>
- </div>
- </div>
- </div>
- </template>
-
- <script>
- import { getCodeImg } from "@/api/login";
- export default {
- data() {
- return {
- userName: "",
- certNumber: "",
- code: "",
- codeUrl:"",
- captchaEnabled:true,
- uuid:"",
- };
- },
- methods:{
- getCode() {
- getCodeImg().then(res => {
- // console.log(res)
- this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled;
- if (this.captchaEnabled) {
- this.codeUrl = "data:image/gif;base64," + res.img;
- this.uuid = res.uuid;
- }
- });
- },
- handleSearch(){
- const form = {
- userName: this.userName,
- certNumber: this.certNumber,
- code: this.code,
- uuid: this.uuid
- }
- console.log(form)
- }
- },
- mounted(){
- this.getCode()
- }
- };
- </script>
- <style>
- </style>
|