Commit 7af925a7 authored by 赵啸非's avatar 赵啸非

Merge remote-tracking branch 'origin/master'

parents dec0d1a7 3d6a38fa
......@@ -2,17 +2,17 @@ import http from "../request/http";
// 1.10.1. 查询应用服务列表
export function serviceList(params) {
return http.post("/zwfwsystem/service/list", params);
return http.post("/zwfw/system/service/list", params);
}
// 1.10.2. 查看应用服务
export function serviceInfo(params) {
return http.get("/zwfwsystem/service/info", params);
return http.get("/zwfw/system/service/info", params);
}
// 1.10.3. 保存更新应用服务
export function serviceSave(params) {
return http.post("/zwfwsystem/service/save", params);
return http.post("/zwfw/system/service/save", params);
}
// 1.10.4. 删除应用服务
export function serviceDelete(params) {
return http.get("/zwfwsystem/service/delete", params);
return http.get("/zwfw/system/service/delete", params);
}
......@@ -20,6 +20,7 @@ service.interceptors.request.use(
const Authorization = JSON.parse(localStorage.getItem("Authorization"));
if (Authorization) {
config.headers.Authorization = Authorization;
config.headers.Authtoken = Authorization;
}
return config;
},
......@@ -36,11 +37,13 @@ service.interceptors.response.use(
message.error({
content: msg,
maxCount: 1,
duration: 1,
});
} else if (code === 401) {
message.error({
message: msg,
maxCount: 1,
duration: 1,
});
Storage.clear(2);
// Storage.remove(2, "siteId");
......
<template>
<div class="application">
<div class="appl_search" ref="search_box">
<div class="appl_search">
<div class="search">
<h1>应用服务</h1>
<a-input-search
<div class="search-box">
<a-input
placeholder="请输入API名称搜索"
v-model="searchVal"
placeholder="请输入应用名称搜索"
@search="onSearch"
onfocus="this.placeholder=''"
onblur="this.placeholder='请输入应用名称搜索'"
>
<a-button slot="enterButton" class="btn">搜索</a-button>
</a-input-search>
@pressEnter="handleSearch"
/>
<button class="search_btn btn" @click="handleSearch">
<span>{{ isSearch ? "重置" : "搜索" }}</span>
</button>
</div>
</div>
</div>
<!-- <div class="appl_cont">
<a-table :columns="columns" :data-source="data" :pagination="false">
<span slot="lang">
<a-icon type="android" theme="filled" />
</span>
<span slot="action">
<a-button>
<a-icon type="download" />下载
</a-button>
</span>
</a-table>
</div>-->
<div class="stepbox" :style="{ height: contentHigh + 'px' }">
<div class="_left">
<a-steps direction="vertical" status="wait" v-model="activeStep">
<a-steps progress-dot direction="vertical">
<a-step
v-for="(item, index) in stepsList"
:status="active === index ? 'process' : 'wait'"
:key="index"
@click.native="stepChange(index)"
>
<span slot="title">{{ item.serviceName }}</span>
<span class="stepIcon" slot="icon"></span>
</a-step>
<a-step :key="2" @click.native="stepChange(2)">
<span slot="title">信息发布系统</span>
<span class="stepIcon" slot="icon"></span>
</a-step>
<a-step :key="3" @click.native="stepChange(3)">
<span slot="title">背靠背评价系统</span>
<span class="stepIcon" slot="icon"></span>
</a-step>
<a-step :key="4" @click.native="stepChange(4)">
<span slot="title">存取件系统</span>
<span class="stepIcon" slot="icon"></span>
<span slot="title" @click="handleChange(item, index)">{{
item.serviceName
}}</span>
</a-step>
</a-steps>
</div>
<el-scrollbar class="_right" ref="scroll">
<div
v-for="item of stepsList"
:key="item.serviceName"
class="list_box step_sign"
>
<h1 class="list_title">
{{ item.serviceName }}
<span>{{ item.count }}</span>
</h1>
<div class="list" v-for="itm of item.serviceList" :key="itm.id">
<b>{{ itm.packageName }}</b>
<img src="../../../assets/images/php.png" alt />
<b>{{ itm.packageVersion }}</b>
<b>{{ itm.packageRemark }}</b>
<b>失效时间:{{ $moment(itm.lapseTime).format("YYYY-MM-DD") }}</b>
<a-button> <a-icon type="download" />下载 </a-button>
</div>
</div>
<!-- 测试 -->
<div class="_right">
<div class="list_box step_sign">
<h1 class="list_title">
信息发布系统
<span>1</span>
</h1>
<div class="list">
<b>信息发布系统软件</b>
<img src="../../../assets/images/php.png" alt />
<b>v1.0.0</b>
<b>修复unit功能及部分鉴权问题</b>
<b>失效时间:2022-12-12</b>
<a-button> <a-icon type="download" />下载 </a-button>
</div>
<div class="title-box">
<span class="list_title">{{ curInfo.serviceName }}</span>
<span class="count primary">{{ curInfo.count }}</span>
</div>
<div class="list_box step_sign">
<h1 class="list_title">
背靠背评价系统
<span>1</span>
</h1>
<div class="list">
<b>背靠背评价系统软件</b>
<div
class="list flex aic jcb"
v-for="itm of curInfo.serviceList"
:key="itm.id"
>
<div class="app-name">{{ itm.packageName }}</div>
<img src="../../../assets/images/php.png" alt />
<b>v1.0.0</b>
<b>修复unit功能及部分鉴权问题</b>
<b>失效时间:2022-12-12</b>
<a-button> <a-icon type="download" />下载 </a-button>
<div>{{ itm.packageVersion }}</div>
<div class="">{{ itm.packageRemark }}</div>
<div v-if="itm.lapseTime">
失效时间:{{ $moment(itm.lapseTime).format("YYYY-MM-DD") }}
</div>
<a-button
type="primary"
@click="handleDowload(itm.packagePath, itm.systemServiceName)"
>
<a-icon type="download" />下载
</a-button>
</div>
<div class="list_box step_sign">
<h1 class="list_title">
存取件系统
<span>1</span>
</h1>
<div class="list">
<b>存取件系统软件</b>
<img src="../../../assets/images/php.png" alt />
<b>v1.0.0</b>
<b>修复unit功能及部分鉴权问题</b>
<b>失效时间:2022-12-12</b>
<a-button> <a-icon type="download" />下载 </a-button>
</div>
</div>
</el-scrollbar>
</div>
</div>
</template>
......@@ -122,49 +64,67 @@
<script>
import { serviceList } from "@/api/applService.js";
import common from "@/mixins/common";
import Vue from "vue";
import { Scrollbar } from "element-ui";
import "element-ui/lib/theme-chalk/index.css";
Vue.use(Scrollbar);
export default {
name: "PortalAdminVueApplService",
mixins: [common],
data() {
return {
searchVal: undefined,
api: process.env.VUE_APP_API_BASE_URL + "/",
searchVal: "",
stepsList: [],
active: 0,
curInfo: {}, // 当前选中设备信息
isSearch: false,
};
},
created() {
this.getServiceList();
},
mounted() {
this.$nextTick(() => {
this.handleScroll();
this.setContentHigh();
});
window.addEventListener("resize", this.setContentHigh);
},
destroyed() {
window.removeEventListener("resize", this.setContentHigh);
},
methods: {
getServiceList(packageName = undefined) {
getServiceList() {
serviceList({
page: 1,
size: 10, //每页条数
packageName,
size: -1, //每页条数
packageName: `%${this.searchVal}%`,
}).then((res) => {
let { code, data } = res;
if (code == 1) {
if (data.data.length) {
this.stepsList = data.data;
console.log(this.stepsList);
this.searchVal = undefined;
this.curInfo = data.data[0];
} else {
this.curInfo = {};
}
}
});
},
onSearch(value) {
this.getServiceList(value);
handleSearch() {
this.isSearch = !this.isSearch;
if (this.isSearch) {
this.active = -1;
this.getServiceList();
} else {
this.searchVal = "";
this.active = 0;
this.getServiceList();
}
},
// 切换设备
handleChange(row, index) {
this.active = index;
this.curInfo = row;
this.searchVal = "";
},
handleDowload(url, systemServiceName) {
console.log(url);
const a = document.createElement("a");
a.href = url;
a.download = systemServiceName;
a.click();
},
},
};
......@@ -174,190 +134,210 @@ export default {
@headerH: 4.5rem;
.application {
width: 100%;
height: 100%;
// padding-top: @headerH;
height: 100vh;
display: flex;
flex-direction: column;
background: #f5f5f5;
.appl_search {
width: 100%;
height: 400px;
height: 300px;
text-align: center;
align-items: center;
background: url("~@/assets/images/yingyongfw.png") center no-repeat;
background-size: 100% 100%;
background-size: cover;
display: flex;
flex-flow: column;
h1 {
font-size: 2.4rem;
color: #fff;
font-weight: bold;
padding: 4rem 0 2rem;
}
.search-box {
display: flex;
align-items: center;
}
/deep/.ant-input {
width: 30rem !important;
margin-right: 2rem;
height: 3rem !important;
}
.search_btn {
width: 9rem;
height: 3rem;
color: #fff;
padding: 10px 25px;
font-family: "Lato", sans-serif;
font-weight: 500;
background: transparent;
cursor: pointer;
transition: all 0.3s ease;
position: relative;
display: inline-block;
box-shadow: inset 2px 2px 2px 0px rgba(255, 255, 255, 0.5),
7px 7px 20px 0px rgba(0, 0, 0, 0.1), 4px 4px 5px 0px rgba(0, 0, 0, 0.1);
outline: none;
background: linear-gradient(0deg, #ff7200 0%, #ff7200 100%);
line-height: 42px;
padding: 0;
border: none;
& > span {
position: relative;
display: block;
width: 100%;
height: 100%;
}
.search {
&:before,
&:after {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
h1 {
font-weight: 700;
font-size: 40px;
color: #ffffff;
padding-bottom: 35px;
content: "";
right: 0;
bottom: 0;
background: rgba(251, 75, 2, 1);
box-shadow: -7px -7px 20px 0px rgba(255, 255, 255, 0.9),
-4px -4px 5px 0px rgba(255, 255, 255, 0.9),
7px 7px 20px 0px rgba(0, 0, 0, 0.2),
4px 4px 5px 0px rgba(0, 0, 0, 0.3);
transition: all 0.3s ease;
}
/deep/.ant-input-group .ant-input {
width: 480px;
height: 48px;
border-radius: 5px;
&:before {
height: 0%;
width: 2px;
}
.btn {
width: 150px;
height: 48px;
border: 0;
background-color: rgba(255, 114, 0, 1);
color: #ffffff;
margin-left: 20px;
border-radius: 5px;
&:after {
width: 0%;
height: 2px;
}
/deep/.ant-input-search-enter-button input + .ant-input-group-addon {
background-color: #ccc0;
&:hover {
color: rgba(251, 75, 2, 1);
background: transparent;
}
&:hover:before {
height: 100%;
}
&:hover:after {
width: 100%;
}
& > span:before,
& > span:after {
position: absolute;
content: "";
left: 0;
top: 0;
background: rgba(251, 75, 2, 1);
box-shadow: -7px -7px 20px 0px rgba(255, 255, 255, 0.9),
-4px -4px 5px 0px rgba(255, 255, 255, 0.9),
7px 7px 20px 0px rgba(0, 0, 0, 0.2),
4px 4px 5px 0px rgba(0, 0, 0, 0.3);
transition: all 0.3s ease;
}
// .appl_cont {
// width: 100%;
// height: 100%;
// background-color: rgba(245, 245, 245, 1);
& > span:before {
width: 2px;
height: 0%;
}
& > span:after {
height: 2px;
width: 0%;
}
& > span:hover:before {
height: 100%;
}
& > span:hover:after {
width: 100%;
}
}
}
// .ant-table-wrapper {
// width: 1200px;
// height: 100%;
// margin: auto;
// }
// .ant-table-thead > tr > th {
// height: 80px;
// text-align: center;
// font-weight: 700;
// font-size: 14px;
// color: #666666;
// background: #f5f5f5 !important;
// border: 0;
// }
// .ant-table-tbody > tr > td {
// border-bottom: 20px solid #f5f5f5;
// // border-radius: 5px;
// height: 80px;
// }
// .ant-table-tbody > tr {
// background: #ffffff;
// }
// .ant-table table {
// text-align: center;
// }
// .ant-btn {
// width: 120px;
// height: 36px;
// border: 0;
// background-color: rgba(12, 89, 230, 1);
// border: none;
// border-radius: 5px;
// color: #ffffff;
// }
// .ant-table-tbody > tr > td > span > .anticon {
// color: #0fc271;
// font-size: 28px;
// }
// //鼠标移入时的背景色取消掉了
// .ant-table-tbody {
// > tr:hover:not(.ant-table-expanded-row) > td,
// .ant-table-row-hover,
// .ant-table-row-hover > td {
// background: none !important;
// cursor: pointer;
// }
// }
// }
.stepbox {
background-color: rgba(245, 245, 245, 1);
flex: 1;
width: 90%;
margin-left: 5%;
display: flex;
overflow-y: auto;
overflow-x: hidden;
&::-webkit-scrollbar {
display: none !important;
/deep/.ant-steps-item-content {
cursor: pointer;
}
._left {
padding-top: 2rem;
width: 20rem;
.stepIcon {
height: 8px;
width: 8px;
display: inline-block;
background: #b3b3b3;
border-radius: 50%;
-webkit-box-shadow: 0 0 2px 5px rgb(231, 232, 236);
box-shadow: 0 0 2px 5px rgb(231, 232, 236);
width: 300px;
height: 100%;
padding: 20px;
margin-right: 20px;
overflow: auto;
&::-webkit-scrollbar {
width: 3px;
height: 3px;
overflow-y: auto;
}
&::-webkit-scrollbar-thumb {
border-radius: 3px;
background-color: rgba(144, 147, 153, 0.5);
}
&::-webkit-scrollbar-track {
border-radius: 3px;
background: #fff;
}
}
._right {
overflow: hidden !important;
flex: 1;
padding-left: 2rem;
.list_box {
padding-top: 2rem;
&:last-child {
margin-bottom: 10rem;
height: 100%;
padding: 20px;
overflow-y: auto;
&::-webkit-scrollbar {
width: 3px;
height: 3px;
overflow-y: auto;
}
&::-webkit-scrollbar-thumb {
border-radius: 3px;
background-color: rgba(144, 147, 153, 0.5);
}
&::-webkit-scrollbar-track {
border-radius: 3px;
background: #fff;
}
.title-box {
font-size: 24px;
.list_title {
font-weight: bold;
font-size: 1.2rem;
margin-bottom: 0.7rem;
span {
color: #1890ff;
margin-right: 10px;
font-weight: 600;
}
.count {
font-weight: 600;
}
}
.list {
margin-right: 2rem;
padding: 1rem;
background: #fff;
display: flex;
border-radius: 8px;
justify-content: space-between;
align-items: center;
& + .list {
margin-top: 1rem;
width: 100%;
height: 80px;
margin-top: 20px;
padding: 0px 20px;
background-color: #fff;
border-radius: 4px;
.app-name {
font-size: 16px;
font-weight: 600;
}
b {
color: #333333;
font-weight: 400;
.service-name {
font-size: 14px;
max-width: 300px;
text-align: justify;
hyphens: auto;
overflow: hidden;
line-height: 1.5em;
white-space: nowrap;
word-wrap: normal;
text-overflow: ellipsis;
}
img {
width: 40px;
height: 40px;
}
.ant-btn {
width: 120px;
height: 36px;
border: 0;
background-color: rgba(12, 89, 230, 1);
border: none;
border-radius: 5px;
color: #ffffff;
}
// span {
// color: #666;
// max-width: 500px;
// text-align: justify;
// hyphens: auto;
// overflow: hidden;
// line-height: 1.5em;
// display: -webkit-box;
// -webkit-line-clamp: 2;
// -webkit-box-orient: vertical;
// }
}
}
}
}
......@@ -384,33 +364,5 @@ export default {
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b87ff",endColorstr="#6c35f7",GradientType=1);
}
.el-scrollbar__wrap {
overflow-x: hidden !important;
}
.ant-steps-item-tail {
left: 288px !important ;
padding: 23px 0 1px !important;
}
.ant-steps-item-icon {
float: right;
margin-top: -8px;
}
.ant-steps-item-content {
text-align: right !important;
}
.ant-steps-item-finish {
.ant-steps-item-title {
color: #1890ff !important;
}
.stepIcon {
height: 8px;
width: 8px;
display: inline-block;
border-radius: 50%;
background: #1890ff !important;
-webkit-box-shadow: 0 0 2px 5px #c9dbff !important;
box-shadow: 0 0 2px 5px #c9dbff !important;
}
}
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment