Compare commits

...

5 Commits
v1.1 ... master

22 changed files with 625 additions and 58 deletions

View File

@ -2,20 +2,23 @@
> 红山开源工具库致力于集成开发团队及研究团队常用好用的日常工具做到轻量级、易部署集成目前项目正在开发ing
![img.png](img.png)
## Build Setup
``` bash
# install dependencies
npm install
yarn install
# serve with hot reload at localhost:8080
npm run dev
yarn serve
# build for production with minification
npm run build
yarn build
# build for production and view the bundle analyzer report
npm run build --report
```
For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).

BIN
img.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 MiB

View File

@ -27,20 +27,6 @@ export default {
html, body, #app{
min-width: 1600px;
margin: 0;
padding: 0;
/*height: 100vh;*/
width: 100%;
border: 0;
font-size: 100%;
line-height: 1.2;
font: inherit; /* 所有元素字体一致 */
vertical-align: baseline; /* 行内元素垂直对齐:父级元素基线 */
text-align: center; /* 水平居中 */
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
color: #000000;
}
</style>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.6 MiB

After

Width:  |  Height:  |  Size: 2.3 MiB

Binary file not shown.

View File

@ -0,0 +1,8 @@
@charset "UTF-8";
// 定义字体
@font-face {
font-family: "Alibaba";
src: url("../font/AlibabaPuHuiTi-3-115-Black.ttf"); // 注意这里的路径
font-weight: normal;
font-style: normal;
}

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 7.8 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="72" height="72" viewBox="0 0 72 72"><defs><clipPath id="master_svg0_3_06727"><rect x="0" y="0" width="72" height="72" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_3_06727)"><g><path d="M56.455505078125,26.951405078125L30.099105078125,53.307805078125L15.535105078125,38.753105078125C13.965875078125,37.183905078125,13.965875078125,34.816005078125,15.535105078125,33.246905078124996C17.113605078124998,31.668305078125,19.472105078125,31.668305078125,21.050605078125,33.246905078124996L30.099105078125,42.295405078125L50.949405078125,21.445305078125C52.527905078125,19.866705078125,54.886405078125,19.866705078125,56.455505078125,21.445305078125C58.034005078125,23.014505078125,58.034005078125,25.372905078125,56.455505078125,26.951405078125ZM36.000005078125,4.522705078125C18.692205078125,4.522705078125,4.522705078125,18.692205078125,4.522705078125,36.000005078125C4.522705078125,53.307805078125,18.692205078125,67.477305078125,36.000005078125,67.477305078125C53.307805078125,67.477305078125,67.477305078125,53.307805078125,67.477305078125,36.000005078125C67.477305078125,18.692205078125,53.307805078125,4.522705078125,36.000005078125,4.522705078125Z" fill="#FFFFFF" fill-opacity="1"/></g></g></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 616 KiB

BIN
src/assets/zs.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 MiB

View File

@ -1,5 +1,5 @@
<template>
<router-view></router-view>
</template>
<script>
@ -8,6 +8,23 @@ export default {
}
</script>
<style scoped>
<style >
html, body, #app{
background-color: gray;
min-width: 1600px;
margin: 0;
padding: 0;
/*height: 100vh;*/
width: 100%;
border: 0;
font-size: 100%;
line-height: 1.2;
font: inherit; /* 所有元素字体一致 */
vertical-align: baseline; /* 行内元素垂直对齐:父级元素基线 */
text-align: center; /* 水平居中 */
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
color: #000000;
}
</style>

View File

@ -0,0 +1,30 @@
<template>
<router-view></router-view>
</template>
<script>
export default {
name: "PhoneLayout"
}
</script>
<style >
html, body, #app{
min-width: 400px;
max-width: 1024px;
margin: 0;
padding: 0;
/*height: 100vh;*/
width: 100%;
border: 0;
font-size: 100%;
line-height: 1.2;
font: inherit; /* 所有元素字体一致 */
vertical-align: baseline; /* 行内元素垂直对齐:父级元素基线 */
text-align: center; /* 水平居中 */
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
color: #000000;
}
</style>

View File

@ -13,10 +13,15 @@ import moment from "moment"
import VueClipboard from "vue-clipboard2";
import JsonViewer from 'vue-json-viewer'
import Axios from "axios"
import api from './utils/http/index'
Vue.use(api)
Vue.prototype.$axios = Axios
Vue.prototype.$moment = moment;
Vue.use(VueClipboard)
Vue.use(JsonViewer)

View File

@ -0,0 +1,180 @@
<template>
<div id="app">
<div class="container">
<div class="title">
<img class="title-img" src="../assets/logo/no-word-logo.png">
<div class="title-font">红山开源证书查询</div>
</div>
<!--测试UUIDE29A018E9D46460FBDA73FB07ECDDE90-->
<div class="card">
<div class="card-num">证书编号{{certificateNum}}</div>
<div class="card-title" v-html="certificateName"></div>
<img class="card-img" src="../assets/icon/zq-icon.svg">
</div>
<div class="zs">
<img class="zs-img" :src="certificateImg">
</div>
</div>
</div>
</template>
<script>
import "../assets/font/font.scss";
import PageUtils from "@/utils/pageUtils";
export default {
name: "CertificateQuery",
data(){
return{
certificateNum :'',
certificateName : "",
certificateImg: "http://192.168.1.198:8020/api/files/rjgb3k-7e1be11c3c888250849b64ba0e06e12.png"
}
},
methods:{
checkUid(){
var UUID = this.$route.params.certificateUuid
if (!UUID || UUID === null ) {
// do something if UUID is empty or null
//
PageUtils.openPage(this.$router,"/CertificateQueryNotFound")
}else {
var certificateInfo = {
certificateUuid : UUID
}
this.$api.getCertificateInfoByUUID(certificateInfo).then((res)=>{
if (res.status === 0) {
this.certificateImg = "/api/" + res.data.certificateImg
this.certificateNum = res.data.certificateNum
this.certificateName = res.data.certificateName
}else {
//
PageUtils.openPage(this.$router,"/CertificateQueryNotFound")
}
})
}
}
},
mounted() {
this.checkUid();
}
}
</script>
<style scoped>
.zs-img{
width: 368px;
border-radius: 25px;
}
.zs{
margin-top: 30px;
}
.card{
position: relative;
width: 368px;
height: 206px;
border-radius: 25px;
opacity: 1;
background: linear-gradient(62deg, #FE7D41 2%, #FFE253 95%);
margin: 20px auto;
box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.2);
}
.card-num{
position: absolute;
left: 20px;
top: 23px;
height: 23px;
opacity: 1;
font-size: 16px;
font-weight: 500;
line-height: normal;
letter-spacing: 0em;
font-feature-settings: "kern" on;
color: #FFFFFF;
}
.card-title{
position: absolute;
left: 80px;
top: 75px;
width: 199px;
height: 74px;
opacity: 1;
font-family: Alibaba;
max-width:368px;
font-size: 24px;
font-weight: 900;
line-height: normal;
text-align: center;
letter-spacing: 0em;
font-feature-settings: "kern" on;
color: #FFFFFF;
}
.card-img{
position: absolute;
left: 287px;
top: 134px;
width: 72px;
height: 72px;
opacity: 1;
}
.container{
background: linear-gradient(180deg, rgba(150, 160, 247, 0.3082) 0%, rgba(185, 192, 250, 0) 100%);
height: 100vh;
padding-left: 4vw;
padding-right: 4vw;
padding-top: 3vh;
}
.title{
margin-left: 8px;
width: 269px;
height: 61px;
display: flex;
align-items: center;
}
.title-font{
font-size: 24px;
font-weight: 900;
line-height: normal;
margin: 0 auto;
letter-spacing: 0em;
font-feature-settings: "kern" on;
color: #3D3D3D;
}
.title-img{
width: 61px;
}
</style>

View File

@ -0,0 +1,80 @@
<template>
<div id="app">
<div class="container">
<div class="title">
<img class="title-img" src="../assets/logo/no-word-logo.png">
<div class="title-font">红山开源证书查询</div>
</div>
<div class="not-found">
<img src="../assets/icon/notfound.svg" class="not-found-img">
<div class="not-found-title">您查询的证书不存在<br/>请与证书发放人员确认</div>
</div>
</div>
</div>
</template>
<script>
import "../assets/font/font.scss";
export default {
name: "CertificateQueryNotFound"
}
</script>
<style scoped>
.not-found{
margin-top: 160px;
}
.not-found-title{
margin-top: -80px;
font-size: 18px;
font-weight: 500;
line-height: normal;
text-align: center;
letter-spacing: 0em;
font-family: Alibaba;
font-feature-settings: "kern" on;
color: #3D3D3D;
}
.container{
background: linear-gradient(180deg, rgba(150, 160, 247, 0.3082) 0%, rgba(185, 192, 250, 0) 100%);
height: 100vh;
padding-left: 4vw;
padding-right: 4vw;
padding-top: 3vh;
}
.title{
margin-left: 8px;
width: 269px;
height: 61px;
display: flex;
align-items: center;
}
.title-font{
font-size: 24px;
font-weight: 900;
line-height: normal;
margin: 0 auto;
letter-spacing: 0em;
font-feature-settings: "kern" on;
color: #3D3D3D;
}
.title-img{
width: 61px;
}
</style>

View File

@ -4,7 +4,7 @@
<div style="background: #FAFCFF; min-height: 100%;position: relative">
<div
style="width: 100%; height: 70px; background-color: white;display: flex;
text-align: left;align-items: center; position: fixed;z-index: 999; margin-bottom: 70px">
text-align: left;align-items: center; position: fixed;z-index: 999; margin-bottom: 70px;box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1)">
<el-image @click="backOsredm" :src="osredmLogo" style="margin-right: 30px;width: 48px; height: 48px; margin-left: 70px; cursor: pointer;"/>
<a href="https://www.osredm.com/" style="margin-left: 20px">首页</a>
<a href="https://www.osredm.com/explore/all" style="margin-left: 40px">开源项目</a>
@ -16,7 +16,7 @@
<div class="container" >
<div class="banner-main" :style="{backgroundImage:'url('+require('../assets/banner-noword.png')+')'}" style=" background-size:cover; ">
<div class="banner-main" :style="{backgroundImage:'url('+require('../assets/new-banner.svg')+')'}" style=" background-size:cover; ">
<!-- <img src="../assets/banner-noword.png" class="banner-img">-->
<div class="banner-word">
<img src="../assets/hskylogo.png" style="height: 60px">
@ -237,8 +237,11 @@ export default {
.banner-main{
position: relative;
width: 100%;
width: 95%;
height: 450px;
margin-top: 100px;
border-radius: 20px;
}
.banner-img{
@ -251,7 +254,7 @@ export default {
position: absolute;
color: white;
font-weight: 700;
top: 20%;
top: 15%;
left: 0;
right: 0;
}

View File

@ -4,6 +4,12 @@ import VueRouter from 'vue-router'
Vue.use(VueRouter)
let routes = [
{
path: '/',
component: () => import("@/layout/DefaultLayout"),
name: 'ToolsHome',
redirect: '/ToolsHome',
children:[
{
path: '/',
component: () => import("@/page/ToolsHome"),
@ -47,6 +53,27 @@ let routes = [
name: 'encryptionTool',
},
]
},
{
path: '/certificateQuery/:certificateUuid',
component: () => import("@/layout/PhoneLayout"),
name: 'certificateQuery',
children: [
{
path: '/certificateQuery/:certificateUuid',
component: () => import("@/page/CertificateQuery"),
name: 'certificateQuery',
},
{
path: '/CertificateQueryNotFound',
component: () => import("@/page/CertificateQueryNotFound"),
name: 'CertificateQueryNotFound',
},
]
},
// path: '/404',
// component:() => import("@/components/404"),

166
src/utils/http/api.js Normal file
View File

@ -0,0 +1,166 @@
import axios from 'axios' // 注意先安装哦
import config from './config' // 倒入默认配置
// import qs from 'qs' // 序列化请求数据,视服务端的要求
import router from '../../router'
import { Message } from 'element-ui'
export default function $axios (options) {
return new Promise((resolve, reject) => {
const instance = axios.create({
baseURL: config.baseURL,
headers: {},
// eslint-disable-next-line no-unused-vars
transformResponse: [function (data) {
}]
}
);
// request 拦截器
instance.interceptors.request.use(
config => {
// Tip: 1
// 请求开始的时候可以结合 vuex 开启全屏的 loading 动画
// Tip: 2
// 带上 token , 可以结合 vuex 或者重 localStorage
// let token = localStorage.getItem("systemToken")
// if (token) {
// config.headers.accessToken = token
// }else {
// router.push('/login')
// }
// if (store.getters.token) {
// config.headers['X-Token'] = getToken() // 让每个请求携带token--['X-Token']为自定义key 请根据实际情况自行修改
// } else {
// // 重定向到登录页面
// }
// Tip: 3
// 根据请求方法,序列化传来的参数,根据后端需求是否序列化
if (config.method.toLocaleLowerCase() === 'post'
|| config.method.toLocaleLowerCase() === 'put'
|| config.method.toLocaleLowerCase() === 'delete') {
// config.data = qs.stringify(config.data)
}
return config;
},
error => {
// 请求错误时做些事(接口错误、超时等)
// Tip: 4
// 关闭loadding
console.log('request:', error);
// 1.判断请求超时
if (error.code === 'ECONNABORTED' && error.message.indexOf('timeout') !== -1) {
console.log('根据你设置的timeout/真的请求超时 判断请求现在超时了,你可以在这里加入超时的处理方案')
// return service.request(originalRequest);//例如再重复请求一次
}
// 2.需要重定向到错误页面
const errorInfo = error.response
console.log(errorInfo)
if (errorInfo) {
// error =errorInfo.data//页面那边catch的时候就能拿到详细的错误信息,看最下边的Promise.reject
const errorStatus = errorInfo.status; // 404 403 500 ... 等
router.push({
path: `/error/${errorStatus}`
})
}
return Promise.reject(error) // 在调用的那边可以拿到(catch)你想返回的错误信息
}
);
// response 拦截器
instance.interceptors.response.use(
response => {
let data;
// IE9时response.data是undefined因此需要使用response.request.responseText(Stringify后的字符串)
if(response.data == undefined){
data = JSON.parse(response.request.responseText)
} else{
data = response.data
}
// 根据返回的code值来做不同的处理和后端约定
switch (data.code) {
case '':
break;
default:
}
// 若不是正确的返回code且已经登录就抛出错误
// const err = new Error(data.description)
// err.data = data
// err.response = response
// throw err
return data;
},
err => {
if (err && err.response) {
switch (err.response.status) {
case 400:
err.message = '请求错误';
break;
case 401:
err.message = '未授权,请登录';
break;
case 403:
err.message = '拒绝访问';
break;
case 404:
err.message = `请求地址出错: ${err.response.config.url}`;
break;
case 408:
err.message = '请求超时';
break;
case 500:
err.message = '服务器内部错误';
break;
case 501:
err.message = '服务未实现';
break;
case 502:
err.message = '网关错误';
break;
case 503:
err.message = '服务不可用';
break;
case 504:
err.message = '网关超时';
break;
case 505:
err.message = 'HTTP版本不受支持';
break;
default:
}
}
console.error(err);
// 此处我使用的是 element UI 的提示组件
Message.error(`ERROR: ${err}`);
return Promise.reject(err); // 返回接口返回的错误信息
}
);
//请求处理
instance(options)
.then((res) => {
resolve(res);
return false
})
.catch((error) => {
reject(error);
})
})
}

17
src/utils/http/config.js Normal file
View File

@ -0,0 +1,17 @@
export default {
method: 'post',
// 基础url前缀
baseURL: '/api',
// 请求头信息
headers: {
'Content-Type':'application/json;charset=UTF-8'
},
// 参数
data: {},
// 设置超时时间
timeout: 100000,
// 携带凭证
withCredentials: false,
// 返回数据类型
responseType: 'json'
}

17
src/utils/http/index.js Normal file
View File

@ -0,0 +1,17 @@
// 导入定义的统一接口
import apiList from './interface'
const install = Vue => {
if (install.installed) return;
install.installed = true;
Object.defineProperties(Vue.prototype, {
// 注意哦,此处挂载在 Vue 原型的 $api 对象上
$api: {
get() {
return apiList
}
}
})
};
export default install

View File

@ -0,0 +1,25 @@
// 导入 api
import axios from './api'
/* 便
* 如果项目很大可以将 url 独立成文件接口分成不同的模块
* 此处的数据依然来自 Easy Mock
*/
export const getCertificateInfoByUUID = data => {
return axios({
url: '/certificate/search',
method: 'post',
data
})
};
// 默认全部倒出
// 根据需要进行
export default {
getCertificateInfoByUUID
}

View File

@ -14,7 +14,7 @@ module.exports = {
port:8020,
proxy: {
'/api': {
target: 'http://localhost:8010',
target: 'http://localhost:8001',
changeOrigin: true,
pathRewrite: {
'^/api': ''