Commit bcdcfa34 authored by 姬鋆屾's avatar 姬鋆屾

tui,修改按钮样式

parent 3ac6abce
/* 颜色 */
.primary {
color: #1890ff;
}
.delete {
color: #ff4d4f;
}
.green {
color: #1bbc9b;
}
.clofff {
color: #fff;
}
.orange {
color: orange;
}
.bgdel {
background-color: #ff4d4f;
}
.bgpr {
background-color: #1890ff;
}
.bgg {
background-color: #1bbc9b;
}
/* 版心 */
.container {
width: 1200px;
}
/* 弹性布局 */
.flex {
display: flex;
}
.flex1 {
flex: 1;
}
.flexc {
flex-direction: column;
}
.flexwrap {
flex-wrap: wrap;
}
.jcc {
justify-content: center;
}
.jca {
justify-content: space-around;
}
.jcb {
justify-content: space-between;
}
.jce {
justify-content: space-evenly;
}
.aic {
align-items: center;
}
.aca {
align-content: space-around;
}
.acb {
align-content: space-between;
}
.ace {
align-content: space-evenly;
}
/* margin */
.m10 {
margin: 10px;
}
.m15 {
margin: 15px;
}
.m20 {
margin: 20px;
}
.mt10 {
margin-top: 10px;
}
.mt15 {
margin-top: 15px;
}
.mt20 {
margin-top: 20px;
}
.mt50 {
margin-top: 50px;
}
.ml10 {
margin-left: 10px;
}
.ml15 {
margin-left: 15px;
}
.ml20 {
margin-left: 20px;
}
.ml25 {
margin-left: 25px;
}
.mr10 {
margin-right: 10px;
}
.mr15 {
margin-right: 15px;
}
.mr20 {
margin-right: 20px;
}
.mr25 {
margin-right: 25px;
}
.mr50 {
margin-right: 50px;
}
.mb10 {
margin-bottom: 10px;
}
.mb15 {
margin-bottom: 15px;
}
.mb20 {
margin-bottom: 20px;
}
.mb25 {
margin-bottom: 25px;
}
/* padding */
.pd10 {
padding: 10px;
}
.pd15 {
padding: 15px;
}
.pd20 {
padding: 20px;
}
.pdt10 {
padding-top: 10px;
}
.pdt15 {
padding-top: 15px;
}
.pdt20 {
padding-top: 20px;
}
.pdt30 {
padding-top: 30px;
}
.pdl8 {
padding-left: 8px;
}
.pdl10 {
padding-left: 10px;
}
.pdl15 {
padding-left: 15px;
}
.pdl20 {
padding-left: 20px;
}
.pdr10 {
padding-right: 10px;
}
.pdr15 {
padding-right: 15px;
}
.pdr20 {
padding-right: 20px;
}
.pdb10 {
padding-bottom: 10px;
}
.pdb15 {
padding-bottom: 15px;
}
.pdb20 {
padding-bottom: 20px;
}
/* 字体大小 */
.font16 {
font-size: 16px;
}
.font18 {
font-size: 18px;
}
.font20 {
font-size: 20px;
}
.font22 {
font-size: 22px;
}
.font24 {
font-size: 24px;
}
.font26 {
font-size: 26px;
}
.font28 {
font-size: 28px;
}
.font30 {
font-size: 30px;
}
/* 字体位置 */
.tac {
text-align: center;
}
.tal {
text-align: left;
}
.tar {
text-align: right;
}
/* 加粗 */
.fontw600 {
font-weight: 600;
}
.fontw700 {
font-weight: 700;
}
.fontw800 {
font-weight: 800;
}
/* 手型鼠标 */
.pointer {
cursor: pointer;
}
.pagination {
margin-top: 10px;
text-align: right;
}
.color_title {
margin-left: 15px;
position: relative;
margin-bottom: 15px;
color: #1890ff;
}
.color_title::before {
content: "";
width: 4px;
height: 20px;
position: absolute;
top: 0px;
left: -16px;
background-color: #0595fd;
}
::-webkit-scrollbar {
width: 6px;
height: 6px;
overflow-y: auto;
}
::-webkit-scrollbar-thumb {
border-radius: 6px;
background-color: rgba(144, 147, 153, 0.5);
}
::-webkit-scrollbar-track {
border-radius: 6px;
background: #fff;
}
.ant-modal-close {
color: #188fff !important;
}
.ant-modal-close svg {
font-size: 26px !important;
}
.ant-modal-title {
color: #1890ff !important;
font-size: 18px;
font-weight: bold;
}
.header_box {
padding-bottom: 1rem;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.header_box > div {
display: flex;
justify-content: flex-start;
align-items: center;
}
.header_box > div b {
font-style: normal;
font-weight: unset;
font-size: 16px;
margin-left: 20px;
}
.header_box > div b i {
color: #0595fd;
font-style: normal;
}
.header_box > div sub {
font-size: 14px;
font-style: normal;
bottom: unset;
margin-left: 20px;
}
.header_box > div .export_btn {
outline: none;
cursor: pointer;
border: none;
padding: 0.8rem 1.2rem;
margin: 0;
font-family: inherit;
font-size: inherit;
position: relative;
display: inline-block;
font-size: 0.8rem;
border-radius: 6px;
overflow: hidden;
background: #42dac8;
color: ghostwhite;
}
.header_box > div .export_btn span {
position: relative;
z-index: 10;
transition: color 0.4s;
}
.header_box > div .export_btn:hover span {
color: #fef2f2;
}
.header_box > div .export_btn::before,
.header_box > div .export_btn::after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
}
.header_box > div .export_btn::before {
content: "";
background: #08cfb8;
width: 120%;
left: -10%;
transform: skew(30deg);
transition: transform 0.4s cubic-bezier(0.3, 1, 0.8, 1);
}
.header_box > div .export_btn:hover::before {
transform: translate3d(100%, 0, 0);
}
.header_box > span {
display: flex;
justify-content: space-between;
align-items: center;
}
.header_box > span /deep/ .ant-input-affix-wrapper {
width: 15rem !important;
margin-right: 1rem !important;
}
.header_box > span /deep/ .ant-input {
height: 2.3rem !important;
}
.header_box > span /deep/ .ant-select-selection {
width: 170px !important;
height: 2.3rem !important;
margin-right: 1rem !important;
}
.header_box > span /deep/ .ant-select-selection__rendered {
height: 100% !important;
}
.header_box > span /deep/ .ant-select-selection-selected-value {
height: 100% !important;
line-height: 2.3rem !important;
}
.header_box > span .search_btn {
padding: 0.8rem 1.2rem;
border: 0;
border-radius: 5px;
background: #1890ff;
box-shadow: rgba(0, 0, 0, 0.05) 0 0 8px;
letter-spacing: 1.5px;
text-transform: uppercase;
font-size: 0.8rem;
color: hsl(0, 0%, 100%);
transition: all 0.5s ease;
cursor: pointer;
}
.header_box > span .search_btn:hover {
letter-spacing: 3px;
background-color: #7d5cf9;
color: hsl(0, 0%, 100%);
box-shadow: #5d18dc 0px 2px 10px 0px;
}
.header_box > span .search_btn:active {
letter-spacing: 3px;
background-color: #7d5cf9;
color: hsl(0, 0%, 100%);
box-shadow: #5d18dc 0px 0px 0px 0px;
transform: translateY(2px);
transition: 100ms;
}
.main .type0 {
color: #888888;
}
.main .type1 {
color: #f94545;
}
.main .type2 {
color: #04ca8f;
}
.main .ant-btn-link {
padding: 0 !important;
}
.main .ant-btn-link + .ant-btn-link {
margin-left: 1rem !important;
}
.main .ant-table-pagination {
float: right !important;
}
.ant-btn-success {
background-color: #04ca8f;
border-color: #04ca8f;
color: #fff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.12);
-webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.05);
box-shadow: 0 2px 0 rgba(0, 0, 0, 0.05);
}
.ant-btn-success:hover,
.ant-btn-success:focus {
color: #fff;
background-color: #42dac8;
border-color: #42dac8;
}
.ant-select {
min-width: 120px;
}
.ant-calendar-picker {
min-width: 270px;
}
.ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.addclass {
background: linear-gradient(90deg, #5ab6ff 0%, #2e9aff 100%) !important;
color: #fff !important;
}
......@@ -320,6 +320,7 @@
left: -16px;
background-color: rgba(5, 149, 253, 1);
}
::-webkit-scrollbar {
width: 6px;
height: 6px;
......@@ -335,24 +336,29 @@
border-radius: 6px;
background: #fff;
}
.ant-modal-close {
color: #188fff !important;
}
.ant-modal-close svg {
font-size: 26px !important;
}
.ant-modal-title {
color: #1890ff !important;
font-size: 18px;
font-weight: bold;
}
.header_box {
padding-bottom: 1rem;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
& > div {
&>div {
display: flex;
justify-content: flex-start;
align-items: center;
......@@ -362,17 +368,20 @@
font-weight: unset;
font-size: 16px;
margin-left: 20px;
i {
color: #0595fd;
font-style: normal;
}
}
sub {
font-size: 14px;
font-style: normal;
bottom: unset;
margin-left: 20px;
}
.export_btn {
outline: none;
cursor: pointer;
......@@ -388,6 +397,7 @@
overflow: hidden;
background: #42dac8;
color: ghostwhite;
& span {
position: relative;
z-index: 10;
......@@ -423,29 +433,35 @@
}
}
& > span {
&>span {
display: flex;
justify-content: space-between;
align-items: center;
/deep/.ant-input-affix-wrapper {
width: 15rem !important;
margin-right: 1rem !important;
}
/deep/.ant-input {
height: 2.3rem !important;
}
/deep/.ant-select-selection {
width: 170px !important;
height: 2.3rem !important;
margin-right: 1rem !important;
}
/deep/.ant-select-selection__rendered {
height: 100% !important;
}
/deep/.ant-select-selection-selected-value {
height: 100% !important;
line-height: 2.3rem !important;
}
.search_btn {
padding: 0.8rem 1.2rem;
border: 0;
......@@ -477,26 +493,33 @@
}
}
}
.main {
.type0 {
color: #888888;
}
.type1 {
color: #f94545;
}
.type2 {
color: #04ca8f;
}
.ant-btn-link {
padding: 0 !important;
& + .ant-btn-link {
&+.ant-btn-link {
margin-left: 1rem !important;
}
}
.ant-table-pagination {
float: right !important;
}
}
.ant-btn-success {
background-color: #04ca8f;
border-color: #04ca8f;
......@@ -505,18 +528,22 @@
-webkit-box-shadow: 0 2px 0 rgb(0 0 0 / 5%);
box-shadow: 0 2px 0 rgb(0 0 0 / 5%);
}
.ant-btn-success:hover,
.ant-btn-success:focus {
color: #fff;
background-color: #42dac8;
border-color: #42dac8;
}
.ant-select {
min-width: 120px;
}
.ant-calendar-picker {
min-width: 270px;
}
.ellipsis {
overflow: hidden;
text-overflow: ellipsis;
......@@ -526,4 +553,4 @@
.addclass {
background: linear-gradient(90deg, #5ab6ff 0%, #2e9aff 100%) !important;
color: #fff !important;
}
\ No newline at end of file
}
......@@ -3,34 +3,71 @@
<div class="content">
<div class="top">
<h1 class="title_text">{{ detailsForm.interfaceName }}</h1>
<button class="go_back" @click="$router.go(-1)">返回上一级</button>
<a-button
type="primary"
class="addclass"
@click="$router.go(-1)"
style="margin-bottom: 1rem"
>返回上一级</a-button
>
</div>
<a-card title="接口信息" :bordered="false" class="card_box">
<a-descriptions>
<a-descriptions-item label="接口名称">{{ detailsForm.interfaceName }}</a-descriptions-item>
<a-descriptions-item label="版本号">{{ detailsForm.versionNumber }}</a-descriptions-item>
<a-descriptions-item label="请求类型">{{ detailsForm.requestType == 1 ? 'GET' : 'POST' }}</a-descriptions-item>
<a-descriptions-item label="请求协议">{{ detailsForm.requestProtocol == 1 ? 'HTTP' : 'HTTPS'
<a-descriptions-item label="接口名称">{{
detailsForm.interfaceName
}}</a-descriptions-item>
<a-descriptions-item label="content-type">{{ detailsForm.contentType }}</a-descriptions-item>
<a-descriptions-item label="超时时长">{{ detailsForm.timeoutValue }}</a-descriptions-item>
<a-descriptions-item label="限流策略">{{ detailsForm.limitStrategy == 1 ? '分钟' : '小时' }}</a-descriptions-item>
<a-descriptions-item label="访问网络" v-if="detailsForm && detailsForm.network">
<span v-for="item, idx of dict.network" v-show="detailsForm.network.indexOf(idx) != -1" :key="idx"> {{ item }}
<a-descriptions-item label="版本号">{{
detailsForm.versionNumber
}}</a-descriptions-item>
<a-descriptions-item label="请求类型">{{
detailsForm.requestType == 1 ? "GET" : "POST"
}}</a-descriptions-item>
<a-descriptions-item label="请求协议">{{
detailsForm.requestProtocol == 1 ? "HTTP" : "HTTPS"
}}</a-descriptions-item>
<a-descriptions-item label="content-type">{{
detailsForm.contentType
}}</a-descriptions-item>
<a-descriptions-item label="超时时长"
>{{ detailsForm.timeoutValue }}</a-descriptions-item
>
<a-descriptions-item label="限流策略">{{
detailsForm.limitStrategy == 1 ? "分钟" : "小时"
}}</a-descriptions-item>
<a-descriptions-item
label="访问网络"
v-if="detailsForm && detailsForm.network"
>
<span
v-for="(item, idx) of dict.network"
v-show="detailsForm.network.indexOf(idx) != -1"
:key="idx"
>
{{ item }}
</span>
</a-descriptions-item>
<a-descriptions-item label="接口标签" v-if="dict.interfaceTag">{{ dict.interfaceTag[detailsForm.interfaceTag]
<a-descriptions-item label="接口标签" v-if="dict.interfaceTag">{{
dict.interfaceTag[detailsForm.interfaceTag]
}}</a-descriptions-item>
<a-descriptions-item label="接口来源" v-if="dict.interfaceSource">{{
dict.interfaceSource[detailsForm.interfaceSource] }}</a-descriptions-item>
<a-descriptions-item label="请求路径">{{ detailsForm.requestUrl }}</a-descriptions-item>
<br>
<a-descriptions-item label="描述" span="{3}">{{ detailsForm.description }}</a-descriptions-item>
dict.interfaceSource[detailsForm.interfaceSource]
}}</a-descriptions-item>
<a-descriptions-item label="请求路径">{{
detailsForm.requestUrl
}}</a-descriptions-item>
<br />
<a-descriptions-item label="描述" span="{3}">{{
detailsForm.description
}}</a-descriptions-item>
</a-descriptions>
</a-card>
<a-card title="请求参数" :bordered="false" class="card_box">
<div class="flex aic jcb mb10">
<a-radio-group v-model="requestPam.type" button-style="solid" disabled>
<a-radio-group
v-model="requestPam.type"
button-style="solid"
disabled
>
<a-radio-button value="path"> 路径参数 </a-radio-button>
<a-radio-button value="headers"> headers </a-radio-button>
<a-radio-button value="query"> query </a-radio-button>
......@@ -38,23 +75,37 @@
</a-radio-group>
<div class="flex aic">
<div class="mr10">入参是否加密</div>
<div>{{ detailsForm.inEncrypt == 1 ? '加密' : '不加密' }}</div>
<div>{{ detailsForm.inEncrypt == 1 ? "加密" : "不加密" }}</div>
</div>
</div>
<a-table size="middle" bordered :row-key="(record) => record.id" :locale="{ emptyText: '无' }" :pagination="false"
:columns="table_columns" :dataSource="requestPam.table">
<a-table
size="middle"
bordered
:row-key="(record) => record.id"
:locale="{ emptyText: '无' }"
:pagination="false"
:columns="table_columns"
:dataSource="requestPam.table"
>
</a-table>
</a-card>
<a-card title="响应数据" :bordered="false" class="card_box">
<div class="flex aic mb10" style="justify-content: flex-end;">
<div class="flex aic mb10" style="justify-content: flex-end">
<div class="flex aic">
<div class="mr10">出参是否加密</div>
<div>{{ detailsForm.outEncrypt == 1 ? '加密' : '不加密' }}</div>
<div>{{ detailsForm.outEncrypt == 1 ? "加密" : "不加密" }}</div>
</div>
</div>
<a-table size="middle" bordered :row-key="(record) => record.id" :locale="{ emptyText: '无' }" :pagination="false"
:columns="table_columns" :dataSource="responsePam.table">
<a-table
size="middle"
bordered
:row-key="(record) => record.id"
:locale="{ emptyText: '无' }"
:pagination="false"
:columns="table_columns"
:dataSource="responsePam.table"
>
</a-table>
</a-card>
......@@ -80,9 +131,7 @@
import Vue from "vue";
import hljs from "highlight.js";
import "highlight.js/styles/monokai-sublime.css";
import {
getInterfaceInfo
} from '@/api/thePlatformIsSet.js'
import { getInterfaceInfo } from "@/api/thePlatformIsSet.js";
Vue.directive("highlight", function (el) {
let blocks = el.querySelectorAll("pre code");
blocks.forEach((block) => {
......@@ -97,53 +146,54 @@ export default {
requestPam: {},
responsePam: {},
dict: {},
table_columns: [{
title: "参数名",
align: "center",
dataIndex: "name"
},
{
title: "参数值类型",
align: "center",
dataIndex: "type",
},
{
title: "默认值",
align: "center",
dataIndex: "default",
},
{
title: "是否必填",
align: "center",
dataIndex: "isMust",
customRender: (text, record, index) => `${text == 1 ? '' : ''}`,
},
{
title: "描述",
align: "center",
dataIndex: "describe",
width: 200
}
table_columns: [
{
title: "参数名",
align: "center",
dataIndex: "name",
},
{
title: "参数值类型",
align: "center",
dataIndex: "type",
},
{
title: "默认值",
align: "center",
dataIndex: "default",
},
{
title: "是否必填",
align: "center",
dataIndex: "isMust",
customRender: (text, record, index) => `${text == 1 ? "" : ""}`,
},
{
title: "描述",
align: "center",
dataIndex: "describe",
width: 200,
},
],
allResData: null,
errJson: { "msg": "请选择待查看产品接口信息", "code": -1 }
errJson: { msg: "请选择待查看产品接口信息", code: -1 },
};
},
mounted() {
this.getInfo()
this.getInfo();
},
methods: {
getInfo() {
getInterfaceInfo({ id: this.$route.query.id }).then(res => {
this.allResData = res
res.data.network = res.data.network.split(',')
this.detailsForm = res.data
this.requestPam = JSON.parse(res.data.requestParameters)
this.responsePam = JSON.parse(res.data.responseParameters)
this.dict = res.dict
})
getInterfaceInfo({ id: this.$route.query.id }).then((res) => {
this.allResData = res;
res.data.network = res.data.network.split(",");
this.detailsForm = res.data;
this.requestPam = JSON.parse(res.data.requestParameters);
this.responsePam = JSON.parse(res.data.responseParameters);
this.dict = res.dict;
});
},
toJson(res) {
return JSON.stringify(res);
......@@ -190,39 +240,39 @@ export default {
position: relative;
z-index: 1;
&:hover {
color: rgb(255, 255, 255);
}
// &:hover {
// color: rgb(255, 255, 255);
// }
&::before,
&::after {
content: "";
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background: rgba(128, 128, 128, 0.096);
backdrop-filter: blur(10px);
z-index: -1;
transition: all 0.4s;
}
// &::before,
// &::after {
// content: "";
// position: absolute;
// top: 0%;
// left: 0%;
// width: 100%;
// height: 100%;
// background: rgba(128, 128, 128, 0.096);
// backdrop-filter: blur(10px);
// z-index: -1;
// transition: all 0.4s;
// }
&::after {
z-index: -2;
transition: all 0.4s;
}
// &::after {
// z-index: -2;
// transition: all 0.4s;
// }
&:hover::before {
background: rgb(0, 0, 0, 0.315);
// border-radius: 10px;
}
// &:hover::before {
// background: rgb(0, 0, 0, 0.315);
// // border-radius: 10px;
// }
&:hover::after {
background: linear-gradient(to right, #cb6ce6, #38b6ff);
// border-radius: 10px;
transform: scale(1.07, 1.2) rotateX(180deg);
}
// &:hover::after {
// background: linear-gradient(to right, #cb6ce6, #38b6ff);
// // border-radius: 10px;
// transform: scale(1.07, 1.2) rotateX(180deg);
// }
}
}
......@@ -236,7 +286,7 @@ export default {
margin-bottom: 1rem;
}
&+.card_box {
& + .card_box {
margin-top: 1rem;
}
}
......@@ -248,16 +298,22 @@ export default {
width: 100%;
height: @headerH;
background: rgb(59, 135, 255);
background: -moz-linear-gradient(174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%);
background: -webkit-linear-gradient(174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%);
background: linear-gradient(174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%);
background: -moz-linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
background: -webkit-linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
background: linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b87ff", endColorstr="#6c35f7", GradientType=1);
}
}
</style>
\ No newline at end of file
</style>
......@@ -2,39 +2,73 @@
<div class="PoliticsShow-Container">
<div class="header_box">
<div>
<button class="add_btn" @click="openDetails()">
<span>新增</span>
</button>
<a-button type="primary" @click="openDetails()" class="addclass"
>新增</a-button
>
</div>
<span>
<a-input allowClear v-model="query.interfaceName" placeholder="请输入接口名称查询">
<a-input
allowClear
v-model="query.interfaceName"
placeholder="请输入接口名称查询"
>
<a-icon slot="prefix" type="search" />
</a-input>
<a-select v-model="query.interfaceSource">
<a-select-option value="">所有来源</a-select-option>
<a-select-option v-for="(item, index) of dict.interfaceSource" :key="index" :value="index">
<a-select-option
v-for="(item, index) of dict.interfaceSource"
:key="index"
:value="index"
>
{{ item }}
</a-select-option>
</a-select>
<a-select v-model="query.interfaceTag">
<a-select-option value="">所有标签</a-select-option>
<a-select-option v-for="(item, index) of dict.interfaceTag" :key="index" :value="index">
<a-select-option
v-for="(item, index) of dict.interfaceTag"
:key="index"
:value="index"
>
{{ item }}
</a-select-option>
</a-select>
<button class="search_btn" @click="getList()">搜索</button>
<a-button type="primary" class="addclass" @click="getList()"
>搜索</a-button
>
</span>
</div>
<div class="main">
<a-table size="small" bordered :row-key="(record) => record.id" :scroll="{ y: 590 }" :pagination="tablePagination"
@change="pagTableChange" :loading="tableLoading" :columns="tableHeaders" :dataSource="tableSourceData">
<template slot="network" slot-scope="text, record,index">
<span v-for="item, idx of dict.network" v-show="text.indexOf(idx) != -1" :key="idx"> {{ item }} </span>
<a-table
size="small"
bordered
:row-key="(record) => record.id"
:scroll="{ y: 590 }"
:pagination="tablePagination"
@change="pagTableChange"
:loading="tableLoading"
:columns="tableHeaders"
:dataSource="tableSourceData"
>
<template slot="network" slot-scope="text, record, index">
<span
v-for="(item, idx) of dict.network"
v-show="text.indexOf(idx) != -1"
:key="idx"
>
{{ item }}
</span>
</template>
<template slot="operation" slot-scope="text, record, index">
<a-button type="link" @click="openDetails(record)">编辑</a-button>
<a-popconfirm title="确定要删除此应用吗?" ok-text="确定" cancel-text="取消" @confirm="delRow(record)">
<a-popconfirm
title="确定要删除此应用吗?"
ok-text="确定"
cancel-text="取消"
@confirm="delRow(record)"
>
<a-button type="link" style="color: #ff4420">删除</a-button>
</a-popconfirm>
</template>
......@@ -47,7 +81,10 @@
<script>
import table from "@/mixins/table";
import Details from "./components/Details.vue";
import { getInterfaceList, getInterfaceDelete } from '@/api/thePlatformIsSet.js'
import {
getInterfaceList,
getInterfaceDelete,
} from "@/api/thePlatformIsSet.js";
export default {
mixins: [table],
name: "PortalAdminVueAlerting",
......@@ -71,19 +108,21 @@ export default {
title: "请求类型",
align: "center",
dataIndex: "requestType",
customRender: (text, record, index) => `${record.requestType == 1 ? 'POST' : 'GET'}`,
customRender: (text, record, index) =>
`${record.requestType == 1 ? "POST" : "GET"}`,
},
{
title: "标签",
align: "center",
dataIndex: "interfaceTag",
customRender: (text, record, index) => this.dict.interfaceTag[text]
customRender: (text, record, index) => this.dict.interfaceTag[text],
},
{
title: "请求协议",
align: "center",
dataIndex: "requestProtocol",
customRender: (text, record, index) => this.dict.requestProtocol[text]
customRender: (text, record, index) =>
this.dict.requestProtocol[text],
},
{
title: "版本",
......@@ -94,13 +133,15 @@ export default {
title: "来源",
align: "center",
dataIndex: "interfaceSource",
customRender: (text, record, index) => this.dict.interfaceSource[text]
customRender: (text, record, index) =>
this.dict.interfaceSource[text],
},
{
title: "策略",
align: "center",
dataIndex: "limitStrategy",
customRender: (text, record, index) => `${record.limitStrategy == 1 ? '分钟' : '小时'}`,
customRender: (text, record, index) =>
`${record.limitStrategy == 1 ? "分钟" : "小时"}`,
},
{
title: "访问网络",
......@@ -108,7 +149,7 @@ export default {
dataIndex: "network",
scopedSlots: {
customRender: "network",
}
},
},
{
......@@ -129,12 +170,10 @@ export default {
},
tablePagination: {
current: 1,
pageSize: 10
},
dict: {
pageSize: 10,
},
total: 0
dict: {},
total: 0,
};
},
components: {
......@@ -148,20 +187,16 @@ export default {
getInterfaceList({
page: this.tablePagination.current,
size: this.tablePagination.pageSize,
...this.query
}).then(res => {
...this.query,
}).then((res) => {
if (res.code == 1) {
let {
data,
total,
dict
} = res.data;
let { data, total, dict } = res.data;
this.dict = dict;
this.tableSourceData = data;
this.tablePagination.total = total;
return data
return data;
}
})
});
},
QueueState(type) {
switch (type) {
......@@ -176,21 +211,21 @@ export default {
},
delRow(item) {
getInterfaceDelete({
id: item.id
id: item.id,
}).then((res) => {
let { code, msg } = res
let { code, msg } = res;
if (code == 1) {
this.$message.success('删除成功');
this.getList()
this.$message.success("删除成功");
this.getList();
} else {
this.$message.error(msg);
}
})
});
},
openDetails(item) {
if (item) {
this.$refs.Details.modalInfo.title = "编辑接口";
this.$refs.Details.getInfo(item.id)
this.$refs.Details.getInfo(item.id);
} else {
this.$refs.Details.modalInfo.title = "新增接口";
}
......@@ -199,8 +234,8 @@ export default {
},
//分页
pagTableChange(page) {
this.tablePagination.current = page.current
this.tablePagination.pageSize = page.pageSize
this.tablePagination.current = page.current;
this.tablePagination.pageSize = page.pageSize;
this.getList();
},
},
......@@ -219,7 +254,7 @@ export default {
justify-content: space-between;
align-items: center;
&>div {
& > div {
display: flex;
justify-content: flex-start;
align-items: center;
......@@ -275,7 +310,7 @@ export default {
}
}
&>span {
& > span {
display: flex;
justify-content: space-between;
align-items: center;
......@@ -360,13 +395,10 @@ export default {
/deep/.ant-btn-link {
padding: 0 !important;
&+.ant-btn-link {
& + .ant-btn-link {
margin-left: 1rem !important;
}
}
}
}
</style>
......@@ -2,35 +2,70 @@
<div class="PoliticsShow-Container">
<div class="header_box">
<div>
<button class="add_btn" @click="openDetails()">
<a-button
type="primary"
class="addclass"
@click="openDetails()"
>
<span>新增</span>
</button>
</a-button>
</div>
<span>
<a-input allowClear v-model="searchForm.appName" placeholder="请输入应用名称查询">
<a-input
allowClear
v-model="searchForm.appName"
placeholder="请输入应用名称查询"
>
<a-icon slot="prefix" type="search" />
</a-input>
<a-select v-model="searchForm.deveLanguage">
<a-select-option value="">全部</a-select-option>
<a-select-option v-for="(item, index) of dict.deveLanguage" :key="index" :value="index">
<a-select-option
v-for="(item, index) of dict.deveLanguage"
:key="index"
:value="index"
>
{{ item }}
</a-select-option>
</a-select>
<button class="search_btn" @click="getList()">搜索</button>
<a-button
type="primary"
class="addclass"
@click="getList()"
>搜索</a-button
>
</span>
</div>
<div class="main">
<a-table size="small" bordered :row-key="(record) => record.id" :scroll="{ y: 590 }" :pagination="tablePagination"
@change="pagTableChange" :loading="tableLoading" :columns="tableHeaders" :dataSource="tableSourceData">
<a-table
size="small"
bordered
:row-key="(record) => record.id"
:scroll="{ y: 590 }"
:pagination="tablePagination"
@change="pagTableChange"
:loading="tableLoading"
:columns="tableHeaders"
:dataSource="tableSourceData"
>
<template slot="operation" slot-scope="text, record, index">
<a-button type="link" v-if="record.appFileUrl" @click="handleDowload(record.appFileUrl)">下载应用</a-button>
<a-button
type="link"
v-if="record.appFileUrl"
@click="handleDowload(record.appFileUrl)"
>下载应用</a-button
>
<a-button type="link" @click="openDetails(record)">编辑</a-button>
<a-popconfirm title="确定要删除此应用吗?" ok-text="确定" cancel-text="取消" @confirm="delRow(record)">
<a-popconfirm
title="确定要删除此应用吗?"
ok-text="确定"
cancel-text="取消"
@confirm="delRow(record)"
>
<a-button type="link" style="color: #ff4420">删除</a-button>
</a-popconfirm>
</template>
</a-table>
<Details ref="Details" :deveLanguage="dict.deveLanguage" />
......@@ -42,9 +77,7 @@
import { getApps, deleteApps } from "@/api/thePlatformIsSet.js";
import table from "@/mixins/table";
import Details from "./components/Details.vue";
let obj = {
}
let obj = {};
export default {
mixins: [table],
name: "PortalAdminVueAlerting",
......@@ -84,13 +117,14 @@ export default {
title: "是否启用",
align: "center",
dataIndex: "isEnable",
customRender: (text, record, index) => text == 1 ? '' : "",
customRender: (text, record, index) => (text == 1 ? "" : ""),
},
{
title: "上传时间",
align: "center",
dataIndex: "createTime",
customRender: (text, record, index) => this.$moment(text).format("YYYY年MM月DD日 HH:mm:ss"),
customRender: (text, record, index) =>
this.$moment(text).format("YYYY年MM月DD日 HH:mm:ss"),
},
{
title: "操作",
......@@ -104,7 +138,7 @@ export default {
],
tablePagination: {
current: 1,
pageSize: 10
pageSize: 10,
},
searchForm: {
deveLanguage: "",
......@@ -112,8 +146,8 @@ export default {
},
dict: {
deveLanguage: {},
isEnable: {}
}
isEnable: {},
},
};
},
components: {
......@@ -132,50 +166,45 @@ export default {
...search,
}).then((res) => {
if (res.code == 1) {
let {
data,
total,
dict
} = res.data;
let { data, total, dict } = res.data;
this.dict = dict;
this.tableSourceData = data;
this.tablePagination.total = total;
return data
return data;
}
})
});
},
//分页
pagTableChange(page) {
this.tablePagination.current = page.current
this.tablePagination.pageSize = page.pageSize
this.tablePagination.current = page.current;
this.tablePagination.pageSize = page.pageSize;
this.getList();
},
delRow(item) {
deleteApps({
id: item.id
id: item.id,
}).then((res) => {
console.log(res)
let { code, msg } = res
console.log(res);
let { code, msg } = res;
if (code == 1) {
this.$message.success('删除成功');
this.getList()
this.$message.success("删除成功");
this.getList();
} else {
this.$message.error(msg);
}
})
});
},
handleDowload(url) {
let arr = url.split('/')
let arr = url.split("/");
const a = document.createElement("a");
a.href = process.env.VUE_APP_API_BASE_URL + '/' + url;
a.href = process.env.VUE_APP_API_BASE_URL + "/" + url;
a.download = arr[arr.length - 1];
a.click();
},
openDetails(item) {
if (item) {
this.$refs.Details.modalInfo.title = "编辑应用";
this.$refs.Details.getInfo(item.id)
this.$refs.Details.getInfo(item.id);
} else {
this.$refs.Details.modalInfo.title = "新增应用";
}
......@@ -188,11 +217,10 @@ export default {
versionInfo: "",
appFileUrl: "",
isEnable: false,
}
this.$refs.Details.uploadInfo.fileList = []
};
this.$refs.Details.uploadInfo.fileList = [];
// this.$refs.Details.appForm.resetFields()
this.$refs.Details.modalInfo.width = "30%";
},
},
};
......@@ -210,7 +238,7 @@ export default {
justify-content: space-between;
align-items: center;
&>div {
& > div {
display: flex;
justify-content: flex-start;
align-items: center;
......@@ -266,7 +294,7 @@ export default {
}
}
&>span {
& > span {
display: flex;
justify-content: space-between;
align-items: center;
......@@ -351,13 +379,10 @@ export default {
/deep/.ant-btn-link {
padding: 0 !important;
&+.ant-btn-link {
& + .ant-btn-link {
margin-left: 1rem !important;
}
}
}
}
</style>
......@@ -2,24 +2,49 @@
<div class="PoliticsShow-Container">
<div class="header_box">
<div>
<button class="add_btn" @click="openDetails()">
<a-button type="primary" class="addclass" @click="openDetails()">
<span>新增</span>
</button>
</a-button>
</div>
<span>
<a-input allowClear v-model="searchName" placeholder="请输入资料名称查询">
<a-input
allowClear
v-model="searchName"
placeholder="请输入资料名称查询"
>
<a-icon slot="prefix" type="search" />
</a-input>
<button class="search_btn" @click="getList()">搜索</button>
<a-button type="primary" class="addclass" @click="getList()"
>搜索</a-button
>
</span>
</div>
<div class="main">
<a-table size="small" bordered :row-key="(record) => record.id" :scroll="{ y: 590 }" :pagination="tablePagination"
@change="pagTableChange" :loading="tableLoading" :columns="tableHeaders" :dataSource="tableSourceData">
<a-table
size="small"
bordered
:row-key="(record) => record.id"
:scroll="{ y: 590 }"
:pagination="tablePagination"
@change="pagTableChange"
:loading="tableLoading"
:columns="tableHeaders"
:dataSource="tableSourceData"
>
<template slot="operation" slot-scope="text, record, index">
<a-button type="link" v-if="record.docFileUrl" @click="handleDowload(record.docFileUrl)">下载</a-button>
<a-button
type="link"
v-if="record.docFileUrl"
@click="handleDowload(record.docFileUrl)"
>下载</a-button
>
<a-button type="link" @click="openDetails(record)">编辑</a-button>
<a-popconfirm title="确定要删除此应用吗?" ok-text="确定" cancel-text="取消" @confirm="delRow(record)">
<a-popconfirm
title="确定要删除此应用吗?"
ok-text="确定"
cancel-text="取消"
@confirm="delRow(record)"
>
<a-button type="link" style="color: #ff4420">删除</a-button>
</a-popconfirm>
</template>
......@@ -68,7 +93,8 @@ export default {
title: "上传时间",
align: "center",
dataIndex: "createTime",
customRender: (text, record, index) => this.$moment(text).format("YYYY年MM月DD日 HH:mm:ss"),
customRender: (text, record, index) =>
this.$moment(text).format("YYYY年MM月DD日 HH:mm:ss"),
},
{
......@@ -84,7 +110,7 @@ export default {
searchName: undefined,
tablePagination: {
current: 1,
pageSize: 10
pageSize: 10,
},
};
},
......@@ -105,49 +131,45 @@ export default {
...search,
}).then((res) => {
if (res.code == 1) {
let {
data,
total,
dict
} = res.data;
let { data, total, dict } = res.data;
this.dict = dict;
this.tableSourceData = data;
this.tablePagination.total = total;
return data
return data;
}
})
});
},
//分页
pagTableChange(page) {
this.tablePagination.current = page.current
this.tablePagination.pageSize = page.pageSize
this.tablePagination.current = page.current;
this.tablePagination.pageSize = page.pageSize;
this.getList();
},
delRow(item) {
deleteDocument({
id: item.id
id: item.id,
}).then((res) => {
console.log(res)
let { code, msg } = res
console.log(res);
let { code, msg } = res;
if (code == 1) {
this.$message.success('删除成功');
this.getList()
this.$message.success("删除成功");
this.getList();
} else {
this.$message.error(msg);
}
})
});
},
handleDowload(url) {
let arr = url.split('/')
let arr = url.split("/");
const a = document.createElement("a");
a.href = process.env.VUE_APP_API_BASE_URL + '/' + url;
a.href = process.env.VUE_APP_API_BASE_URL + "/" + url;
a.download = arr[arr.length - 1];
a.click();
},
openDetails(item) {
if (item) {
this.$refs.Details.modalInfo.title = "编辑材料";
this.$refs.Details.getInfo(item.id)
this.$refs.Details.getInfo(item.id);
} else {
this.$refs.Details.modalInfo.title = "新增材料";
}
......@@ -170,7 +192,7 @@ export default {
justify-content: space-between;
align-items: center;
&>div {
& > div {
display: flex;
justify-content: flex-start;
align-items: center;
......@@ -226,7 +248,7 @@ export default {
}
}
&>span {
& > span {
display: flex;
justify-content: space-between;
align-items: center;
......@@ -311,13 +333,10 @@ export default {
/deep/.ant-btn-link {
padding: 0 !important;
&+.ant-btn-link {
& + .ant-btn-link {
margin-left: 1rem !important;
}
}
}
}
</style>
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