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

Merge remote-tracking branch 'origin/master'

parents dec0d1a7 3d6a38fa
...@@ -2,17 +2,17 @@ import http from "../request/http"; ...@@ -2,17 +2,17 @@ import http from "../request/http";
// 1.10.1. 查询应用服务列表 // 1.10.1. 查询应用服务列表
export function serviceList(params) { export function serviceList(params) {
return http.post("/zwfwsystem/service/list", params); return http.post("/zwfw/system/service/list", params);
} }
// 1.10.2. 查看应用服务 // 1.10.2. 查看应用服务
export function serviceInfo(params) { export function serviceInfo(params) {
return http.get("/zwfwsystem/service/info", params); return http.get("/zwfw/system/service/info", params);
} }
// 1.10.3. 保存更新应用服务 // 1.10.3. 保存更新应用服务
export function serviceSave(params) { export function serviceSave(params) {
return http.post("/zwfwsystem/service/save", params); return http.post("/zwfw/system/service/save", params);
} }
// 1.10.4. 删除应用服务 // 1.10.4. 删除应用服务
export function serviceDelete(params) { 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( ...@@ -20,6 +20,7 @@ service.interceptors.request.use(
const Authorization = JSON.parse(localStorage.getItem("Authorization")); const Authorization = JSON.parse(localStorage.getItem("Authorization"));
if (Authorization) { if (Authorization) {
config.headers.Authorization = Authorization; config.headers.Authorization = Authorization;
config.headers.Authtoken = Authorization;
} }
return config; return config;
}, },
...@@ -36,11 +37,13 @@ service.interceptors.response.use( ...@@ -36,11 +37,13 @@ service.interceptors.response.use(
message.error({ message.error({
content: msg, content: msg,
maxCount: 1, maxCount: 1,
duration: 1,
}); });
} else if (code === 401) { } else if (code === 401) {
message.error({ message.error({
message: msg, message: msg,
maxCount: 1, maxCount: 1,
duration: 1,
}); });
Storage.clear(2); Storage.clear(2);
// Storage.remove(2, "siteId"); // Storage.remove(2, "siteId");
......
<template> <template>
<div class="application"> <div class="application">
<div class="appl_search" ref="search_box"> <div class="appl_search">
<div class="search"> <div class="search">
<h1>应用服务</h1> <h1>应用服务</h1>
<a-input-search <div class="search-box">
<a-input
placeholder="请输入API名称搜索"
v-model="searchVal" v-model="searchVal"
placeholder="请输入应用名称搜索" @pressEnter="handleSearch"
@search="onSearch" />
onfocus="this.placeholder=''" <button class="search_btn btn" @click="handleSearch">
onblur="this.placeholder='请输入应用名称搜索'" <span>{{ isSearch ? "重置" : "搜索" }}</span>
> </button>
<a-button slot="enterButton" class="btn">搜索</a-button> </div>
</a-input-search>
</div> </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="stepbox" :style="{ height: contentHigh + 'px' }">
<div class="_left"> <div class="_left">
<a-steps direction="vertical" status="wait" v-model="activeStep"> <a-steps progress-dot direction="vertical">
<a-step <a-step
v-for="(item, index) in stepsList" v-for="(item, index) in stepsList"
:status="active === index ? 'process' : 'wait'"
:key="index" :key="index"
@click.native="stepChange(index)"
> >
<span slot="title">{{ item.serviceName }}</span> <span slot="title" @click="handleChange(item, index)">{{
<span class="stepIcon" slot="icon"></span> item.serviceName
</a-step> }}</span>
<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>
</a-step> </a-step>
</a-steps> </a-steps>
</div> </div>
<el-scrollbar class="_right" ref="scroll"> <div class="_right">
<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="list_box step_sign"> <div class="list_box step_sign">
<h1 class="list_title"> <div class="title-box">
信息发布系统 <span class="list_title">{{ curInfo.serviceName }}</span>
<span>1</span> <span class="count primary">{{ curInfo.count }}</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> </div>
<div class="list_box step_sign"> <div
<h1 class="list_title"> class="list flex aic jcb"
背靠背评价系统 v-for="itm of curInfo.serviceList"
<span>1</span> :key="itm.id"
</h1> >
<div class="list"> <div class="app-name">{{ itm.packageName }}</div>
<b>背靠背评价系统软件</b>
<img src="../../../assets/images/php.png" alt /> <img src="../../../assets/images/php.png" alt />
<b>v1.0.0</b> <div>{{ itm.packageVersion }}</div>
<b>修复unit功能及部分鉴权问题</b> <div class="">{{ itm.packageRemark }}</div>
<b>失效时间:2022-12-12</b> <div v-if="itm.lapseTime">
<a-button> <a-icon type="download" />下载 </a-button> 失效时间:{{ $moment(itm.lapseTime).format("YYYY-MM-DD") }}
</div> </div>
<a-button
type="primary"
@click="handleDowload(itm.packagePath, itm.systemServiceName)"
>
<a-icon type="download" />下载
</a-button>
</div> </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>
</div> </div>
</el-scrollbar>
</div> </div>
</div> </div>
</template> </template>
...@@ -122,49 +64,67 @@ ...@@ -122,49 +64,67 @@
<script> <script>
import { serviceList } from "@/api/applService.js"; import { serviceList } from "@/api/applService.js";
import common from "@/mixins/common"; 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 { export default {
name: "PortalAdminVueApplService", name: "PortalAdminVueApplService",
mixins: [common], mixins: [common],
data() { data() {
return { return {
searchVal: undefined, api: process.env.VUE_APP_API_BASE_URL + "/",
searchVal: "",
stepsList: [], stepsList: [],
active: 0,
curInfo: {}, // 当前选中设备信息
isSearch: false,
}; };
}, },
created() { created() {
this.getServiceList(); this.getServiceList();
}, },
mounted() { mounted() {
this.$nextTick(() => {
this.handleScroll();
this.setContentHigh(); this.setContentHigh();
});
window.addEventListener("resize", this.setContentHigh);
},
destroyed() {
window.removeEventListener("resize", this.setContentHigh);
}, },
methods: { methods: {
getServiceList(packageName = undefined) { getServiceList() {
serviceList({ serviceList({
page: 1, page: 1,
size: 10, //每页条数 size: -1, //每页条数
packageName, packageName: `%${this.searchVal}%`,
}).then((res) => { }).then((res) => {
let { code, data } = res; let { code, data } = res;
if (code == 1) { if (code == 1) {
if (data.data.length) {
this.stepsList = data.data; this.stepsList = data.data;
console.log(this.stepsList); this.curInfo = data.data[0];
this.searchVal = undefined; } else {
this.curInfo = {};
}
} }
}); });
}, },
onSearch(value) { handleSearch() {
this.getServiceList(value); 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 { ...@@ -174,190 +134,210 @@ export default {
@headerH: 4.5rem; @headerH: 4.5rem;
.application { .application {
width: 100%; width: 100%;
height: 100%; height: 100vh;
// padding-top: @headerH; display: flex;
flex-direction: column;
background: #f5f5f5;
.appl_search { .appl_search {
width: 100%; height: 300px;
height: 400px; text-align: center;
align-items: center;
background: url("~@/assets/images/yingyongfw.png") center no-repeat; 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; position: relative;
display: block;
width: 100%;
height: 100%;
}
.search { &:before,
&:after {
position: absolute; position: absolute;
top: 50%; content: "";
left: 50%; right: 0;
transform: translate(-50%, -50%); bottom: 0;
text-align: center; background: rgba(251, 75, 2, 1);
h1 { box-shadow: -7px -7px 20px 0px rgba(255, 255, 255, 0.9),
font-weight: 700; -4px -4px 5px 0px rgba(255, 255, 255, 0.9),
font-size: 40px; 7px 7px 20px 0px rgba(0, 0, 0, 0.2),
color: #ffffff; 4px 4px 5px 0px rgba(0, 0, 0, 0.3);
padding-bottom: 35px; transition: all 0.3s ease;
} }
/deep/.ant-input-group .ant-input { &:before {
width: 480px; height: 0%;
height: 48px; width: 2px;
border-radius: 5px;
} }
.btn { &:after {
width: 150px; width: 0%;
height: 48px; height: 2px;
border: 0;
background-color: rgba(255, 114, 0, 1);
color: #ffffff;
margin-left: 20px;
border-radius: 5px;
} }
/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 { & > span:before {
// width: 100%; width: 2px;
// height: 100%; height: 0%;
// background-color: rgba(245, 245, 245, 1); }
& > 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 { .stepbox {
background-color: rgba(245, 245, 245, 1); flex: 1;
width: 90%;
margin-left: 5%;
display: flex; display: flex;
overflow-y: auto; /deep/.ant-steps-item-content {
overflow-x: hidden; cursor: pointer;
&::-webkit-scrollbar {
display: none !important;
} }
._left { ._left {
padding-top: 2rem; width: 300px;
width: 20rem; height: 100%;
.stepIcon { padding: 20px;
height: 8px; margin-right: 20px;
width: 8px; overflow: auto;
display: inline-block; &::-webkit-scrollbar {
background: #b3b3b3; width: 3px;
border-radius: 50%; height: 3px;
-webkit-box-shadow: 0 0 2px 5px rgb(231, 232, 236); overflow-y: auto;
box-shadow: 0 0 2px 5px rgb(231, 232, 236); }
&::-webkit-scrollbar-thumb {
border-radius: 3px;
background-color: rgba(144, 147, 153, 0.5);
}
&::-webkit-scrollbar-track {
border-radius: 3px;
background: #fff;
} }
} }
._right { ._right {
overflow: hidden !important;
flex: 1; flex: 1;
padding-left: 2rem; height: 100%;
.list_box { padding: 20px;
padding-top: 2rem; overflow-y: auto;
&:last-child { &::-webkit-scrollbar {
margin-bottom: 10rem; 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 { .list_title {
font-weight: bold; margin-right: 10px;
font-size: 1.2rem; font-weight: 600;
margin-bottom: 0.7rem; }
span { .count {
color: #1890ff; font-weight: 600;
} }
} }
.list { .list {
margin-right: 2rem; width: 100%;
padding: 1rem; height: 80px;
background: #fff; margin-top: 20px;
display: flex; padding: 0px 20px;
border-radius: 8px; background-color: #fff;
justify-content: space-between; border-radius: 4px;
align-items: center; .app-name {
& + .list { font-size: 16px;
margin-top: 1rem; font-weight: 600;
} }
.service-name {
b {
color: #333333;
font-weight: 400;
font-size: 14px; 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 { img {
width: 40px; width: 40px;
height: 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 { ...@@ -384,33 +364,5 @@ export default {
); );
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b87ff",endColorstr="#6c35f7",GradientType=1); 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> </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