chenzihao/sac
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: chenzihao:ca_router
Branches Tags
chenzihao:ca_router
chenzihao:sac_ca_router_merge_test
chenzihao:sac_ca_router_merge_test_1
chenzihao:chenzihao-patch-1
..
compare: chenzihao:chenzihao-patch-1
Branches Tags
chenzihao:ca_router
chenzihao:sac_ca_router_merge_test
chenzihao:sac_ca_router_merge_test_1
chenzihao:chenzihao-patch-1

No commits in common. "ca_router" and "chenzihao-patch-1" have entirely different histories.
ca_router ... chenzihao-

226 changed files with 17363 additions and 22688 deletions
Show Stats Expand all files Collapse all files

1
pom.xml
View File

@ -28,7 +28,6 @@
<velocity.version>2.3</velocity.version>
<jwt.version>0.9.1</jwt.version>
<hutool.version>5.8.22</hutool.version>
<pagehelper.boot.version>1.4.6</pagehelper.boot.version>
</properties>
<!-- 依赖声明 -->

1
sf-admin/src/main/resources/application.yml
View File

@ -151,5 +151,4 @@ sac:
# port: 5566
host: 192.168.1.23
port: 1775
url_pre: /gateway

12
sf-common/pom.xml
View File

@ -26,12 +26,6 @@
<artifactId>commons-fileupload</artifactId>
<version>1.4</version>
</dependency>
<!-- pagehelper 分页插件 -->
<dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper-spring-boot-starter</artifactId>
<version>${pagehelper.boot.version}</version>
</dependency>
<!-- Spring框架基本的核心工具 -->
<dependency>
<groupId>org.springframework</groupId>
@ -50,16 +44,10 @@
<artifactId>spring-boot-starter-security</artifactId>
</dependency>
<dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper</artifactId>
<version>5.1.9</version>
</dependency>
<!-- pagehelper 分页插件 -->
<dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper-spring-boot-starter</artifactId>
<version>${pagehelper.boot.version}</version>
</dependency>
<!-- 自定义验证注解 -->

22
sf-framework/pom.xml
View File

@ -77,33 +77,13 @@
<groupId>io.springfox</groupId>
<artifactId>springfox-boot-starter</artifactId>
</dependency>
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis</artifactId>
<version>3.5.16</version>
</dependency>
<!-- 防止进入swagger页面报类型转换错误，排除3.0.0中的引用，手动增加1.6.2版本 -->
<dependency>
<groupId>io.swagger</groupId>
<artifactId>swagger-models</artifactId>
<version>1.6.2</version>
</dependency>
<dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper</artifactId>
<version>5.1.9</version>
</dependency>
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis-spring</artifactId>
<version>2.1.2</version>
</dependency>
<dependency>
<groupId>org.mybatis.spring.boot</groupId>
<artifactId>mybatis-spring-boot-autoconfigure</artifactId>
<version>2.3.2</version>
</dependency>
</dependencies>
</project>

28
sf-framework/src/main/java/com/sf/apijson/config/ApijsonInitUtil.java
View File

@ -78,20 +78,20 @@ public class ApijsonInitUtil {
GenTableColumnServiceImpl genTableColumnService = SpringUtils.getBean("genTableColumnServiceImpl", GenTableColumnServiceImpl.class);
int pageNum = 1;
// while (true) {
// PageHelper.startPage(pageNum, 50, "table_id");
// GenTable genTableSearch = new GenTable();
// List<GenTable> list = genTableService.selectGenTableList(genTableSearch);
// if (list.size() == 0) {
// break;
// }
// for (GenTable genTable : list) {
// // 查询表字段
// List<GenTableColumn> listColumn = genTableColumnService.selectGenTableColumnListByTableId(genTable.getTableId());
// initConfigTableUserId(genTable.getTableName(), genTable.getUserId() , listColumn);
// }
// pageNum++;
// }
while (true) {
PageHelper.startPage(pageNum, 50, "table_id");
GenTable genTableSearch = new GenTable();
List<GenTable> list = genTableService.selectGenTableList(genTableSearch);
if (list.size() == 0) {
break;
}
for (GenTable genTable : list) {
// 查询表字段
List<GenTableColumn> listColumn = genTableColumnService.selectGenTableColumnListByTableId(genTable.getTableId());
initConfigTableUserId(genTable.getTableName(), genTable.getUserId() , listColumn);
}
pageNum++;
}
}
public static void deleteTablePkConfig(String tableName) {

5
sf-service/src/main/java/com/sf/service/gateway/service/impl/GatewayConfigServiceImpl.java
View File

@ -47,9 +47,6 @@ public class GatewayConfigServiceImpl implements IGatewayConfigService {
@Value("${sac.gateway.port:5566}")
private Integer sacGatewayPort;
@Value("${sac.gateway.url_pre:}")
private String urlPre;
private static final String SYNC_CONFIG_PATH = "/vertx/app/config";
private static final Long DEFAULT_API_TIMEOUT = 3000L;
@ -104,7 +101,7 @@ public class GatewayConfigServiceImpl implements IGatewayConfigService {
public void synchronization(String appCode) {
Assert.hasText(sacGatewayHost, "网关地址未配置");
Assert.notNull(sacGatewayPort, "网关端口未配置");
String urlStr = "http://" + sacGatewayHost + ":" + sacGatewayPort + urlPre + SYNC_CONFIG_PATH;
String urlStr = "http://" + sacGatewayHost + ":" + sacGatewayPort + SYNC_CONFIG_PATH;
AppConfig appConfig = new AppConfig();
appConfig.setAppCode(appCode);
GatewayConfig gatewayConfig = selectGatewayConfigByAppCode(appCode);

5
sf-system/pom.xml
View File

@ -26,11 +26,6 @@
<groupId>com.smarterFramework</groupId>
<artifactId>sf-file</artifactId>
</dependency>
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis</artifactId>
<version>3.5.16</version>
</dependency>
</dependencies>

2
sf-ui/Dockerfile
View File

@ -1,7 +1,7 @@
FROM node:24-alpine AS builder
WORKDIR /app
COPY . .
ENV NODE_OPTIONS=--openssl-legacy-provider
RUN npm install --registry=https://registry.npmmirror.com && npm run build:stage
FROM registry.zsmarter.com/public/nginx:1.22.1

9
sf-ui/nginx.conf
View File

@ -1,3 +1,4 @@
worker_processes 1;
events {
@ -28,6 +29,14 @@ http {
rewrite ^.*$ /index.html last;
}
location /stage-api/ {
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://zt-sac-java:7781/;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;

BIN
sf-ui/public/favicon.ico
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 5.5 KiB

69
sf-ui/src/api/FDS/whiteList.js
View File

@ -42,72 +42,3 @@ export function delWhitelist (id) {
method: 'delete'
})
}
// 查询白名单成员列列表
export function listWhitelistMember (query) {
return request({
url: '/deployment/whitelistMember/list',
method: 'get',
params: query
})
}
// 查询白名单成员列详细
export function getWhitelistMember (id) {
return request({
url: '/deployment/whitelistMember/' + id,
method: 'get'
})
}
// 新增白名单成员列
export function addWhitelistMember (data) {
return request({
url: '/deployment/whitelistMember',
method: 'post',
data: data
})
}
// 修改白名单成员列
export function updateWhitelistMember (data) {
return request({
url: '/deployment/whitelistMember',
method: 'put',
data: data
})
}
// 删除白名单成员列
export function delWhitelistMember (id) {
return request({
url: '/deployment/whitelistMember/' + id,
method: 'delete'
})
}
// 发布白名单
export function publishWhitelist (id) {
return request({
url: '/deployment/whitelist/publish/' + id,
method: 'get',
})
}
// 下架白名单
export function soldOutWhitelist (id) {
return request({
url: '/deployment/whitelist/sold/out/' + id,
method: 'get',
})
}
// 批量上传白名单
export function importWhitelist (data) {
return request({
url: 'deployment/whitelistMember/batch/import',
method: 'post',
data: data
})
}

28
sf-ui/src/api/gateway/config.js
View File

@ -1,28 +0,0 @@
import request from '@/utils/request'
// 查询网关配置信息
export function getGatewayConfig(params) {
return request({
url: '/gateway/config',
method: 'get',
params
})
}
// 更新网关配置
export function updateGatewayConfig(data) {
return request({
url: '/gateway/config',
method: 'put',
data
})
}
// 同步网关配置
export function updateGatewaySync(data) {
return request({
url: '/gateway/config/sync',
method: 'post',
data
})
}

9
sf-ui/src/api/gateway/route.js
View File

@ -42,12 +42,3 @@ export function delRoute(id) {
method: 'delete'
})
}
// 查询可绑定的路由列表（不分页）
export function getBindableList(params) {
return request({
url: '/gateway/route/bindableList',
method: 'get',
params
})
}

9
sf-ui/src/api/gateway/server.js
View File

@ -51,12 +51,3 @@ export function changeServerStatus(data) {
data: data
})
}
// 查询可绑定的服务列表（状态为启用的,不分页）
export function bindableServerList(params) {
return request({
url: '/gateway/server/bindableList',
method: 'get',
params
})
}

9
sf-ui/src/api/gateway/strategy.js
View File

@ -51,12 +51,3 @@ export function changeStrategyStatus(data) {
data: data
})
}
// 查询可绑定的策略列表（状态为启用的,不分页）
export function bindableStrategyList(params) {
return request({
url: '/gateway/strategy/bindableList',
method: 'get',
params
})
}

66
sf-ui/src/api/mandate/appMandate.js
View File

@ -1,66 +0,0 @@
import request from '@/utils/request'
// 查询应用授权列表
export function listAppMandate (query) {
return request({
url: '/mandate/appMandate/list',
method: 'get',
params: query
})
}
// 查询应用授权详细
export function getAppMandate (id) {
return request({
url: '/mandate/appMandate/' + id,
method: 'get'
})
}
// 新增应用授权
export function addAppMandate (data) {
return request({
url: '/mandate/appMandate',
method: 'post',
data: data
})
}
// 新增应用授权批量
export function addAppMandateList (data) {
return request({
url: '/mandate/appMandate/addList',
method: 'post',
data: data
})
}
// 修改应用授权
export function updateAppMandate (data) {
return request({
url: '/mandate/appMandate',
method: 'put',
data: data
})
}
// 删除应用授权
export function delAppMandate (id) {
return request({
url: '/mandate/appMandate/' + id,
method: 'delete'
})
}
// 查询应用授权列表
export function appMandateUser () {
return request({
url: '/mandate/appMandate/queryUser',
method: 'get',
})
}

BIN
sf-ui/src/assets/images/filter_icon.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 575 B

BIN
sf-ui/src/assets/images/login-background.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 4.5 MiB

BIN
sf-ui/src/assets/images/profile.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 29 KiB

27
sf-ui/src/assets/logo/logo.svg
View File

@ -1,27 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="104px" height="30px" viewBox="0 0 104 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>SAC</title>
<defs>
<linearGradient x1="50%" y1="12.1751553%" x2="57.1919171%" y2="87.8248447%" id="linearGradient-1">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#E5F1FF" offset="100%"></stop>
</linearGradient>
<linearGradient x1="89.6896665%" y1="8.24507501%" x2="11.6260569%" y2="79.7724897%" id="linearGradient-2">
<stop stop-color="#79C3FF" offset="0%"></stop>
<stop stop-color="#4490FE" offset="100%"></stop>
</linearGradient>
<linearGradient x1="50%" y1="17.0179916%" x2="57.1919171%" y2="82.9820084%" id="linearGradient-3">
<stop stop-color="#FFFFFF" offset="0%"></stop>
<stop stop-color="#E5F1FF" offset="100%"></stop>
</linearGradient>
</defs>
<g id="官网" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="首页" transform="translate(-262, -23)" fill-rule="nonzero">
<g id="logo" transform="translate(262, 23)">
<path d="M32.7865113,0.35850417 L30.7865113,6.44149583 L9.48530263,6.44149583 C8.1356254,6.44149583 7.04149583,7.5356254 7.04149583,8.88530263 C7.04149583,10.2349799 8.1356254,11.3291094 9.48530263,11.3291094 L23.8419133,11.3291094 C28.4569114,11.3291094 32.1981065,15.0703046 32.1981065,19.6853026 C32.1981065,24.3003007 28.4569114,28.0414958 23.8419133,28.0414958 L1.31479405,28.0414958 L3.31479405,21.9585042 L23.8419133,21.9585042 C25.0973678,21.9585042 26.1151148,20.9407572 26.1151148,19.6853026 C26.1151148,18.4298481 25.0973678,17.4121011 23.8419133,17.4121011 L9.48530263,17.4121011 C4.77608188,17.4121011 0.95850417,13.5945234 0.95850417,8.88530263 C0.95850417,4.17608188 4.77608188,0.35850417 9.48530263,0.35850417 L32.7865113,0.35850417 Z" id="路径-9" fill="url(#linearGradient-1)"></path>
<path d="M38.8681484,0.0454698506 L50.8563478,21.0969657 L59.5873478,6.61496568 L47.4598541,6.61559281 L44.4598541,0.532601149 L64.9730561,0.532601149 C67.3400843,0.532601149 68.7999234,3.11736276 67.5777828,5.14447769 L55.2888271,25.5276696 C54.8343051,26.2815668 54.1956757,26.9076108 53.4328824,27.3470396 C50.9465576,28.7793575 47.76987,27.9249162 46.337552,25.4385914 L31.7387233,0.0819362866 L38.8681484,0.0454698506 Z" id="路径-27" fill="url(#linearGradient-2)" transform="translate(49.879, 14.0435) scale(1, -1) translate(-49.879, -14.0435)"></path>
<path d="M94.832475,0.35850417 L96.832475,6.44149583 L82.7982917,6.44149583 C78.5133882,6.44149583 75.0397876,9.91509647 75.0397876,14.2 C75.0397876,18.4849035 78.5133882,21.9585042 82.7982917,21.9585042 L101.041496,21.9585042 L103.041496,28.0414958 L82.7982917,28.0414958 C75.1538447,28.0414958 68.9567959,21.8444471 68.9567959,14.2 C68.9567959,6.55555294 75.1538447,0.35850417 82.7982917,0.35850417 L94.832475,0.35850417 Z" id="路径-28" fill="url(#linearGradient-3)"></path>
</g>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 3.1 KiB

18
sf-ui/src/assets/styles/btn.scss
View File

@ -1,4 +1,4 @@
@import "./variables.scss";
@import './variables.scss';
@mixin colorBtn($color) {
background: $color;
@ -14,31 +14,31 @@
}
.blue-btn {
@include colorBtn($blue);
@include colorBtn($blue)
}
.light-blue-btn {
@include colorBtn($light-blue);
@include colorBtn($light-blue)
}
.red-btn {
@include colorBtn($red);
@include colorBtn($red)
}
.pink-btn {
@include colorBtn($pink);
@include colorBtn($pink)
}
.green-btn {
@include colorBtn($green);
@include colorBtn($green)
}
.tiffany-btn {
@include colorBtn($tiffany);
@include colorBtn($tiffany)
}
.yellow-btn {
@include colorBtn($yellow);
@include colorBtn($yellow)
}
.pan-btn {
@ -64,7 +64,7 @@
&:before,
&:after {
content: "";
content: '';
position: absolute;
top: 0;
right: 0;

50
sf-ui/src/assets/styles/element-ui.scss
View File

@ -52,19 +52,6 @@
left: 0;
position: relative;
margin: 0 auto;
.el-dialog__header {
padding: 20px 24px;
}
.el-dialog__header {
padding: 20px 24px;
}
.el-dialog__body {
padding: 24px;
}
.el-dialog__footer {
padding: 24px;
padding-top: 0px;
}
}
// refine element ui upload
@ -82,7 +69,7 @@
// dropdown
.el-dropdown-menu {
a {
display: block;
display: block
}
}
@ -103,38 +90,3 @@
.el-submenu__icon-arrow {
display: none;
}
.el-table {
.el-dropdown-menu {
display: flex;
}
.el-dropdown-menu__item {
display: flex;
flex: 1; /* 让所有项均分空间 */
justify-content: center; /* 水平居中 */
}
.el-dropdown-menu--mini .el-dropdown-menu__item {
padding: 0px;
margin-right: 12px;
}
.el-dropdown-menu--mini .el-dropdown-menu__item:first-child {
padding: 0px;
margin-left: 12px;
}
}
.el-table__column-filter-trigger {
position: relative;
.el-icon-arrow-down {
background: url("../images/filter_icon.png") no-repeat;
width: 15px;
height: 15px;
background-size: 100% 100%;
position: absolute;
top: -12px;
&::before {
display: none;
}
// display: none;
}
}

11
sf-ui/src/assets/styles/element-variables.scss
View File

@ -4,15 +4,10 @@
**/
/* theme color */
$--color-primary: #3F68FF;
$--color-success: #67C23A;
$--color-primary: #1890ff;
$--color-success: #13ce66;
$--color-warning: #ffba00;
$--color-danger: #FA5555;
// $--color-info: #1E1E1E;
// $--color-primary: #1890ff;
// $--color-success: #13ce66;
// $--color-warning: #ffba00;
// $--color-danger: #ff4949;
$--color-danger: #ff4949;
// $--color-info: #1E1E1E;
$--button-font-weight: 400;

12
sf-ui/src/assets/styles/index.scss
View File

@ -122,12 +122,6 @@ aside {
//main-container全局样式
.app-container {
padding: 20px;
&-flex {
padding: 20px;
height: 100%;
display: flex;
flex-direction: column;
}
}
.components-container {
@ -186,9 +180,3 @@ aside {
margin-bottom: 10px;
}
}
.required-asterisk::before {
content: "*";
color: #ff4949;
margin-right: 4px;
}

284
sf-ui/src/assets/styles/ruoyi.scss
View File

@ -1,150 +1,129 @@
/**
/**
* 通用css样式布局处理
* Copyright (c) 2019 ruoyi
*/
/** 基础通用 **/
/** 基础通用 **/
.pt5 {
padding-top: 5px;
padding-top: 5px;
}
.pr5 {
padding-right: 5px;
padding-right: 5px;
}
.pb5 {
padding-bottom: 5px;
padding-bottom: 5px;
}
.mt5 {
margin-top: 5px;
margin-top: 5px;
}
.mr5 {
margin-right: 5px;
margin-right: 5px;
}
.mb5 {
margin-bottom: 5px;
margin-bottom: 5px;
}
.mb8 {
margin-bottom: 8px;
margin-bottom: 8px;
}
.ml5 {
margin-left: 5px;
margin-left: 5px;
}
.mt10 {
margin-top: 10px;
margin-top: 10px;
}
.mr10 {
margin-right: 10px;
margin-right: 10px;
}
.mb10 {
margin-bottom: 10px;
margin-bottom: 10px;
}
.ml10 {
margin-left: 10px;
margin-left: 10px;
}
.mt20 {
margin-top: 20px;
margin-top: 20px;
}
.mr20 {
margin-right: 20px;
}
.mb14 {
margin-bottom: 14px;
}
.mb16 {
margin-bottom: 16px;
margin-right: 20px;
}
.mb20 {
margin-bottom: 20px;
margin-bottom: 20px;
}
.ml20 {
margin-left: 20px;
margin-left: 20px;
}
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: inherit;
font-weight: 500;
line-height: 1.1;
color: inherit;
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
font-family: inherit;
font-weight: 500;
line-height: 1.1;
color: inherit;
}
.el-message-box__status + .el-message-box__message {
word-break: break-word;
.el-message-box__status + .el-message-box__message{
word-break: break-word;
}
.el-dialog:not(.is-fullscreen) {
margin-top: 6vh !important;
margin-top: 6vh !important;
}
.el-dialog__wrapper.scrollbar .el-dialog .el-dialog__body {
overflow: auto;
overflow-x: hidden;
max-height: 70vh;
padding: 10px 20px 0;
overflow: auto;
overflow-x: hidden;
max-height: 70vh;
padding: 10px 20px 0;
}
.el-table th {
background-color: #f0f0f0; /* 你想要的颜色 */
}
// .has
.el-table {
.el-table__header-wrapper,
.el-table__fixed-header-wrapper {
th {
word-break: break-word;
background-color: #d4e1ff !important;
color: #4169ff;
height: 40px;
font-size: 13px;
}
}
.el-table__body-wrapper {
.el-button [class*="el-icon-"] + span {
margin-left: 1px;
}
}
.el-table__header-wrapper, .el-table__fixed-header-wrapper {
th {
word-break: break-word;
background-color: #f8f8f9;
color: #515a6e;
height: 40px;
font-size: 13px;
}
}
.el-table__body-wrapper {
.el-button [class*="el-icon-"] + span {
margin-left: 1px;
}
}
}
/** 表单布局 **/
.form-header {
font-size: 15px;
color: #6379bb;
border-bottom: 1px solid #ddd;
margin: 8px 10px 25px 10px;
padding-bottom: 5px;
font-size:15px;
color:#6379bb;
border-bottom:1px solid #ddd;
margin:8px 10px 25px 10px;
padding-bottom:5px
}
/** 表格布局 **/
.pagination-container {
position: relative;
height: 25px;
margin-bottom: 10px;
margin-top: 15px;
padding: 10px 20px !important;
position: relative;
height: 25px;
margin-bottom: 10px;
margin-top: 15px;
padding: 10px 20px !important;
}
/* tree border */
.tree-border {
margin-top: 5px;
border: 1px solid #e5e6e7;
background: #ffffff none;
border-radius: 4px;
margin-top: 5px;
border: 1px solid #e5e6e7;
background: #FFFFFF none;
border-radius:4px;
}
.pagination-container .el-pagination {
right: 0;
position: absolute;
right: 0;
position: absolute;
}
@media (max-width: 768px) {
@media ( max-width : 768px) {
.pagination-container .el-pagination > .el-pagination__jump {
display: none !important;
}
@ -154,160 +133,145 @@ h6 {
}
.el-table .fixed-width .el-button--mini {
padding-left: 0;
padding-right: 0;
width: inherit;
padding-left: 0;
padding-right: 0;
width: inherit;
}
/** 表格更多操作下拉样式 */
.el-table .el-dropdown-link,
.el-table .el-dropdown-selfdefine {
cursor: pointer;
margin-left: 5px;
.el-table .el-dropdown-link,.el-table .el-dropdown-selfdefine {
cursor: pointer;
margin-left: 5px;
}
.el-table .el-dropdown,
.el-icon-arrow-down {
font-size: 12px;
.el-table .el-dropdown, .el-icon-arrow-down {
font-size: 12px;
}
.el-tree-node__content > .el-checkbox {
margin-right: 8px;
margin-right: 8px;
}
.list-group-striped > .list-group-item {
border-left: 0;
border-right: 0;
border-radius: 0;
padding-left: 0;
padding-right: 0;
border-left: 0;
border-right: 0;
border-radius: 0;
padding-left: 0;
padding-right: 0;
}
.list-group {
padding-left: 0px;
list-style: none;
padding-left: 0px;
list-style: none;
}
.list-group-item {
border-bottom: 1px solid #e7eaec;
border-top: 1px solid #e7eaec;
margin-bottom: -1px;
padding: 11px 0px;
font-size: 13px;
border-bottom: 1px solid #e7eaec;
border-top: 1px solid #e7eaec;
margin-bottom: -1px;
padding: 11px 0px;
font-size: 13px;
}
.pull-right {
float: right !important;
float: right !important;
}
.el-card__header {
padding: 14px 15px 7px;
min-height: 40px;
padding: 14px 15px 7px;
min-height: 40px;
}
.el-card__body {
padding: 15px 20px 20px 20px;
padding: 15px 20px 20px 20px;
}
.card-box {
padding-right: 15px;
padding-left: 15px;
margin-bottom: 10px;
padding-right: 15px;
padding-left: 15px;
margin-bottom: 10px;
}
/* button color */
.el-button--cyan.is-active,
.el-button--cyan:active {
background: #20b2aa;
border-color: #20b2aa;
color: #ffffff;
background: #20B2AA;
border-color: #20B2AA;
color: #FFFFFF;
}
.el-button--cyan:focus,
.el-button--cyan:hover {
background: #48d1cc;
border-color: #48d1cc;
color: #ffffff;
background: #48D1CC;
border-color: #48D1CC;
color: #FFFFFF;
}
.el-button--cyan {
background-color: #20b2aa;
border-color: #20b2aa;
color: #ffffff;
background-color: #20B2AA;
border-color: #20B2AA;
color: #FFFFFF;
}
/* text color */
.text-navy {
color: #1ab394;
color: #1ab394;
}
.text-primary {
color: inherit;
color: inherit;
}
.text-success {
color: #1c84c6;
color: #1c84c6;
}
.text-info {
color: #23c6c8;
color: #23c6c8;
}
.text-warning {
color: #f8ac59;
color: #f8ac59;
}
.text-danger {
color: #ed5565;
color: #ed5565;
}
.text-muted {
color: #888888;
color: #888888;
}
/* image */
.img-circle {
border-radius: 50%;
border-radius: 50%;
}
.img-lg {
width: 120px;
height: 120px;
width: 120px;
height: 120px;
}
.avatar-upload-preview {
position: relative;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 200px;
height: 200px;
border-radius: 50%;
box-shadow: 0 0 4px #ccc;
overflow: hidden;
position: relative;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 200px;
height: 200px;
border-radius: 50%;
box-shadow: 0 0 4px #ccc;
overflow: hidden;
}
/* 拖拽列样式 */
.sortable-ghost {
opacity: 0.8;
color: #fff !important;
background: #42b983 !important;
.sortable-ghost{
opacity: .8;
color: #fff!important;
background: #42b983!important;
}
.top-right-btn {
position: relative;
float: right;
}
.dropdown-max {
max-width: 600px;
display: flex;
flex-flow: row wrap;
padding-left: 5px;
li {
margin-right: 5px;
white-space: nowrap;
}
}
.el-radio {
margin-right: 20px;
position: relative;
float: right;
}

9
sf-ui/src/components/DictData/index.js
View File

@ -3,7 +3,7 @@ import store from '@/store'
import DataDict from '@/utils/dict'
import { getDicts as getDicts } from '@/api/system/dict/data'
function searchDictByKey (dict, key) {
function searchDictByKey(dict, key) {
if (key == null && key == "") {
return null
}
@ -18,21 +18,20 @@ function searchDictByKey (dict, key) {
}
}
function install () {
function install() {
Vue.use(DataDict, {
metas: {
'*': {
labelField: 'dictLabel',
valueField: 'dictValue',
request (dictMeta) {
request(dictMeta) {
const storeDict = searchDictByKey(store.getters.dict, dictMeta.type)
if (storeDict) {
return new Promise(resolve => { resolve(storeDict) })
} else {
return new Promise((resolve, reject) => {
getDicts(dictMeta.type).then(res => {
console.log(res);
store.dispatch('dict/setDict', { key: dictMeta.type, value: res.data, text: res.data.dictLabel })
store.dispatch('dict/setDict', { key: dictMeta.type, value: res.data })
resolve(res.data)
}).catch(error => {
reject(error)

54
sf-ui/src/components/DictTag/index.vue
View File

@ -5,19 +5,19 @@
<span
v-if="item.raw.listClass == 'default' || item.raw.listClass == ''"
:key="item.value"
:index="index"
:class="item.raw.cssClass"
>{{ item.label + " " }}</span
:index="index"
>{{ item.label + ' ' }}</span
>
<el-tag
v-else
:disable-transitions="true"
:key="item.value"
:class="item.raw.cssClass"
:disable-transitions="true"
:index="index"
:type="item.raw.listClass == 'primary' ? '' : item.raw.listClass"
:class="item.raw.cssClass"
>
{{ item.label + " " }}
{{ item.label + ' ' }}
</el-tag>
</template>
</template>
@ -29,61 +29,63 @@
<script>
export default {
name: "DictTag",
name: 'DictTag',
props: {
options: {
type: Array,
default: null,
default: null
},
value: [Number, String, Array],
// 当未找到匹配的数据时，显示value
showValue: {
type: Boolean,
default: true,
default: true
}
},
data() {
return {
unmatchArray: [], // 记录未匹配的项
unmatchArray: [] // 记录未匹配的项
}
},
computed: {
values() {
if (this.value !== null && typeof this.value !== "undefined") {
return Array.isArray(this.value) ? this.value : [String(this.value)];
if (this.value !== null && typeof this.value !== 'undefined') {
console.log(this.value)
return Array.isArray(this.value) ? this.value : [String(this.value)]
} else {
return [];
return []
}
},
unmatch() {
this.unmatchArray = [];
if (this.value !== null && typeof this.value !== "undefined") {
this.unmatchArray = []
if (this.value !== null && typeof this.value !== 'undefined') {
// 传入值为非数组
if (!Array.isArray(this.value)) {
if (this.options.some((v) => v.value == this.value)) return false;
this.unmatchArray.push(this.value);
return true;
if (this.options.some((v) => v.value == this.value)) return false
this.unmatchArray.push(this.value)
return true
}
// 传入值为Array
this.value.forEach((item) => {
if (!this.options.some((v) => v.value == item))
this.unmatchArray.push(item);
});
return true;
if (!this.options.some((v) => v.value == item)) {
this.unmatchArray.push(item)
}
})
return true
}
// 没有value不显示
return false;
},
return false
}
},
filters: {
handleArray(array) {
if (array.length === 0) return "";
if (array.length === 0) return ''
return array.reduce((pre, cur) => {
return pre + " " + cur;
return pre + ' ' + cur
})
}
}
};
}
</script>
<style scoped>
.el-tag + .el-tag {

79
sf-ui/src/components/DropDown/MyDropDown.vue
View File

@ -1,79 +0,0 @@
<template>
<div     class="my-dropdown"     @click.stop="trigger == 'click' ? (showMenu = !showMenu) : ''"
    @mouseenter="trigger == 'hover' ? (showMenu = true) : ''"
    @mouseleave="trigger == 'hover' ? (showMenu = false) : ''"     ref="myDropDdown"   >
    <div class="tip-text" ref="tipText">
      <slot></slot>
    </div>
    <slot name="list"></slot>
  </div>
</template>
<script>
import emitter from "./emitter";
export default {
name: "MyDropdown",
componentName: "MyDropdown",
mixins: [emitter],
props: {
// 触发显示方式
trigger: {
type: String,
default: "click",
},
// 下来菜单的出现位置（上方，下方）
placement: {
type: String,
default: "bottom",
validator: function (value) {
// 这个值必须匹配下列字符串中的一个
return ["bottom", "top"].includes(value);
},
},
},
data () {
return {
//控制菜单是否显示
showMenu: false,
};
},
mounted () {
//初始化自定义事件
this.initEvent();
},
methods: {
// 初始化
initEvent () {
//订阅当item点击的时候，发布on-click事件，告知外部
this.$on("item-click", (params) => {
this.$emit("on-click", params);
this.showMenu = false;
});
//空白点击要隐藏菜单，需要执行的函数需要绑定this指向
this.handleEmptyDomElementClickBindThis =
this.handleEmptyDomElementClick.bind(this);
window.addEventListener("click", this.handleEmptyDomElementClickBindThis);
},
// 处理空白区域点击，隐藏菜单列表
handleEmptyDomElementClick (e) {
if (!Array.from(this.$refs.myDropDdown.childNodes).includes(e.target)) {
this.showMenu = false;
}
},
},
beforeDestroy () {
// 移除window上面的事件
window.removeEventListener(this.handleEmptyDomElementClickBindThis);
},
watch: {
//变化的时候，通知子组件隐藏菜单列表
showMenu () {
this.broadcast("MyDropdownMenu", "set-menu-status", this.showMenu);
},
},
};
</script>
<style lang="scss" scoped>
.my-dropdown {
position: relative;
}
</style>

75
sf-ui/src/components/DropDown/MyDropDownItem.vue
View File

@ -1,75 +0,0 @@
<template>
<div     :class="[
      'my-dropdownItem',
      divided ? 'my-dropdownItem-divided' : '',
      disabled ? 'my-dropdownItem-disabled' : '',
    ]"     @click.stop="handleItemClick"   >
    <slot></slot>
  </div>
</template>
<script>
import emitter from "./emitter";
export default {
name: "MyDropdownItem",
componentName: "MyDropdownItem",
mixins: [emitter],
props: {
divided: {
type: Boolean,
default: false,
},
disabled: {
type: Boolean,
default: false,
},
name: {
type: String,
default: "",
},
},
data () {
return {};
},
methods: {
handleItemClick () {
if (this.disabled) return;
// item项点击通知dropdown组件派发到外部的自定义事件
this.dispatch("MyDropdown", "item-click", this.name);
},
},
};
</script>
<style lang="scss" scoped>
.my-dropdownItem {
margin: 0;
line-height: normal;
padding: 7px 16px;
clear: both;
color: #515a6e;
font-size: 14px !important;
white-space: nowrap;
list-style: none;
cursor: pointer;
transition: background 0.2s ease-in-out;
&:hover {
background: #f3f3f3;
}
}
.my-dropdownItem-divided {
border-bottom: 1px solid #eee
}
.my-dropdownItem-disabled {
color: #cacdd2;
cursor: not-allowed;
&:hover {
background: #fff;
}
}
</style>

96
sf-ui/src/components/DropDown/MyDropDownMenu.vue
View File

@ -1,96 +0,0 @@
<template>
<!-- 涉及到高度，位移，过渡使用js钩子函数的方式比较好处理些 -->
  <transition @before-enter="beforeEnter" @enter="enter" @leave="leave"     v-bind:css="false">
<div class="my-dropdown-menu" v-if="showMenue" ref="myDroupdownMenu">
<slot></slot>
</div>
</transition>
</template>
<script>
import emitter from "./emitter";
export default {
name: "MyDropdownMenu",
componentName: "MyDropdownMenu",
mixins: [emitter],
data () {
return {
showMeune: false,
timer: null,
};
},
mounted () {
this.$on("set-menu-status", (status) => {
this.showMeune = status;
});
},
methods: {
//进入前，初始化需要过渡的属性
beforeEnter: function (el) {
// 初始化
el.style.opacity = 0;
el.style.transform = "scaleY(0)";
el.style.transformOrigin = "top center";
},
//dom进入
enter: function (el, done) {
console.log(el);
//获取文档可视区高度
const htmlClientHeight = document.documentElement.clientHeight;
//菜单列表相对于父元素的top偏移量
const offsetTop = el.offsetTop;
const scrollHeight = el.scrollHeight;
//获取当前元素和可视区的一些长度（top,left,bottom等）
const { bottom } = el.getBoundingClientRect();
// 说明底部高度不够显示菜单了,这时候我们需要调整菜单朝上面显示
if (htmlClientHeight - bottom < scrollHeight) {
el.style.transformOrigin = "bottom center";
el.style.top = -(scrollHeight + 20) + "px";
} else {
//查看是否placement属性，是的话我们主动处理
if (this.$parent.placement == "top") {
el.style.transformOrigin = "bottom center";
el.style.top = -(scrollHeight + 20) + "px";
} else {
el.style.top = offsetTop + "px";
}
}
el.style.transform = "scaleY(1)";
el.style.opacity = 1;
//根据官网事例，必须在enter和leave里面调用done函数，不然过渡动画不生效（切记）
done();
},
//dom元素离开 
leave: function (el, done) {
el.style.transform = "scaleY(0)";
el.style.opacity = 0;
clearTimeout(this.timer);
this.timer = setTimeout(() => {
//根据官网事例，必须在enter和leave里面调用done函数，不然过渡动画不生效（切记）
done();
}, 250);
},
},
};
</script>
<style lang="scss" scoped>
.my-dropdown-menu {
min-width: 100px;
max-height: 200px;
overflow: auto;
margin: 5px 0;
padding: 5px 0;
background-color: #fff;
box-sizing: border-box;
border-radius: 4px;
box-shadow: 0 1px 6px rgb(0 0 0 / 20%);
z-index: 999;
transform-origin: top center;
position: absolute;
transition: transform .25s ease, opacity 0.25s ease;
}
</style>

45
sf-ui/src/components/DropDown/emitter.js
View File

@ -1,45 +0,0 @@
/**
* @Description 由于涉及到跨组件之间通信，因此我们只有自己实现发布订阅的模式，来实现组件之间通信,灵感主要来源于element-ui组件库源码中跨层级父子组件通信方案，本质上也是发布订阅和$emit和$on
* @param { String } componentName 组件名
* @param { String } eventName 事件名
* @param { argument } params 参数
**/
// 广播通知事件
function _broadcast (componentName, eventName, params) {
// 遍历当前组件的子组件
this.$children.forEach(function (child) {
// 取出componentName,组件options上面可以自己配置
var name = child.$options.componentName;
// 如果找到了需要通知的组件名，触发组件上面的$eimit方法，触发自定义事件
if (name === componentName) {
child.$emit.apply(child, [eventName].concat(params));
} else {
// 没找到，递归往下找
_broadcast.apply(child, [componentName, eventName].concat([params]));
}
});
}
const emiiter = {
methods: {
// 派发事件（通知父组件）
dispatch (componentName, eventName, params) {
var parent = this.$parent || this.$root;
var name = parent.$options.componentName;
// 循环往上层父组件，知道知道组件名和需要触发的组件名相同即可，然后触发对应组件的事件
while (parent && (!name || name !== componentName)) {
parent = parent.$parent;
if (parent) {
name = parent.$options.componentName;
}
}
if (parent) {
parent.$emit.apply(parent, [eventName].concat(params));
}
},
// 广播事件（通知子组件）
broadcast (componentName, eventName, params) {
_broadcast.call(this, componentName, eventName, params);
},
},
};
export default emiiter;

58
sf-ui/src/components/FileUpload/index.vue
View File

@ -2,7 +2,7 @@
<div class="upload-file">
<el-upload
ref="fileUpload"
:accept="suffixArr.join(',')"
:accept="accept"
:action="baseUrl+uploadFileUrl"
:before-upload="handleBeforeUpload"
:file-list="fileList"
@ -13,17 +13,16 @@
:on-success="handleUploadSuccess"
:show-file-list="false"
class="upload-file-uploader"
:multiple="multiple"
multiple
>
<!-- 上传按钮 -->
<el-button size="mini" type="default" icon="el-icon-upload2">选取文件</el-button>
<el-button size="mini" type="primary">选取文件</el-button>
<!-- 上传提示 -->
<div v-if="showTip" slot="tip" class="el-upload__tip">
<!-- 请上传
请上传
<template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b></template>
<template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join('/') }}</b></template>
的文件 -->
<span style="color: #999;">支持扩展名：{{ suffixArr.join(' ') }}...</span>
的文件
</div>
</el-upload>
@ -31,7 +30,7 @@
<transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul">
<li v-for="(file, index) in fileList" :key="file.url" class="el-upload-list__item ele-upload-list__item-content">
<el-link :href="`${baseUrl}${file.url}`" :underline="false" target="_blank">
<span class="el-icon-document"> {{ getFileName(file) }} </span>
<span class="el-icon-document"> {{ getFileName(file.name) }} </span>
</el-link>
<div class="ele-upload-list__item-content-action">
<el-link :underline="false" type="danger" @click="handleDelete(index)">删除</el-link>
@ -73,12 +72,12 @@ export default {
type: String,
default: () => '/system/oss/zip/upload'
},
multiple: {
type: Boolean,
default: true
accept: {
type: Array,
default: () => []
}
},
data () {
data() {
return {
number: 0,
uploadList: [],
@ -92,9 +91,8 @@ export default {
},
watch: {
value: {
handler (val) {
handler(val) {
if (val) {
console.log(val)
let temp = 1
// 首先将值转为数组
const list = Array.isArray(val) ? val : this.value.split(',')
@ -117,23 +115,18 @@ export default {
},
computed: {
// 是否显示提示
showTip () {
showTip() {
return this.isShowTip && (this.fileType || this.fileSize)
},
suffixArr() {
return this.fileType.map(item => {
return `.${item}`
})
}
},
methods: {
// 上传前校检格式和大小
handleBeforeUpload (file) {
handleBeforeUpload(file) {
// 校检文件类型
if (this.fileType) {
const fileName = file.name.split('.')
const fileExt = fileName[fileName.length - 1]
const isTypeOk = this.fileType.indexOf(fileExt.toLocaleUpperCase()) >= 0 || this.fileType.indexOf(fileExt.toLocaleLowerCase()) >= 0
const isTypeOk = this.fileType.indexOf(fileExt) >= 0
if (!isTypeOk) {
this.$modal.msgError(`文件格式不正确, 请上传${this.fileType.join('/')}格式文件!`)
return false
@ -152,20 +145,18 @@ export default {
return true
},
// 文件个数超出
handleExceed () {
handleExceed() {
this.$modal.msgError(`上传文件数量不能超过 ${this.limit} 个!`)
},
// 上传失败
handleUploadError (err) {
handleUploadError(err) {
this.$modal.msgError('上传文件失败，请重试')
this.$modal.closeLoading()
},
// 上传成功回调
handleUploadSuccess (res, file) {
handleUploadSuccess(res, file) {
if (res.code === 200) {
const { data } = res;
data.name = data.url;
this.uploadList.push(data)
this.uploadList.push({ name: res.data.url, url: res.data.url, size: res.data.size })
this.uploadedSuccessfully()
} else {
@ -177,28 +168,23 @@ export default {
}
},
// 删除文件
handleDelete (index) {
handleDelete(index) {
this.fileList.splice(index, 1)
this.$emit('input', this.listToString(this.fileList))
this.$emit('change', this.fileList)
this.$emit('getSize', this.fileList)
},
// 上传结束处理
uploadedSuccessfully () {
uploadedSuccessfully() {
if (this.number > 0 && this.uploadList.length === this.number) {
this.fileList = this.fileList.concat(this.uploadList)
this.uploadList = []
this.number = 0
this.$emit('input', this.listToString(this.fileList))
this.$emit('change', this.fileList)
this.$emit('getSize', this.fileList)
this.$modal.closeLoading()
}
},
// 获取文件名称
getFileName(file) {
const {name, originalName} = file;
if (originalName) return originalName;
getFileName(name) {
if (name.lastIndexOf('/') > -1) {
return name.slice(name.lastIndexOf('/') + 1)
} else {
@ -206,7 +192,7 @@ export default {
}
},
// 对象转成指定字符串分隔
listToString (list, separator) {
listToString(list, separator) {
let strs = ''
separator = separator || ','
for (let i in list) {

71
sf-ui/src/components/ImageUpload/index.vue
View File

@ -1,23 +1,44 @@
<template>
<div class="component-upload-image">
<el-upload ref="imageUpload" :action="baseUrl + uploadImgUrl" :before-upload="handleBeforeUpload"
:class="{ hide: this.fileList.length >= this.limit }" :file-list="fileList" :headers="headers" :accept="accept"
:limit="limit" :list-type="listType" :on-error="handleUploadError" :on-exceed="handleExceed"
:on-preview="handlePictureCardPreview" :on-remove="handleDelete" :on-success="handleUploadSuccess"
:show-file-list="true" multiple>
<i v-if="listType == 'picture-card'" class="el-icon-plus"></i>
<el-upload
ref="imageUpload"
:action="baseUrl+uploadImgUrl"
:before-upload="handleBeforeUpload"
:class="{hide: this.fileList.length >= this.limit}"
:file-list="fileList"
:headers="headers"
:limit="limit"
:list-type="listType"
:on-error="handleUploadError"
:on-exceed="handleExceed"
:on-preview="handlePictureCardPreview"
:on-remove="handleDelete"
:on-success="handleUploadSuccess"
:show-file-list="true"
multiple
>
<i v-if="listType=='picture-card'" class="el-icon-plus"></i>
<el-button v-else icon="el-icon-upload" size="small" type="primary">上传文件</el-button>
</el-upload>
<!-- 上传提示 -->
<div v-if="showTip" slot="tip" class="el-upload__tip">
请上传<template v-if="fileSize">大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b></template>
请上传
<template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b></template>
<template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join('/') }}</b></template>
的文件
</div>
<el-dialog :visible.sync="dialogVisible" append-to-body title="预览" width="800">
<img :src="dialogImageUrl" style="display: block; max-width: 100%; margin: 0 auto" />
<el-dialog
:visible.sync="dialogVisible"
append-to-body
title="预览"
width="800"
>
<img
:src="dialogImageUrl"
style="display: block; max-width: 100%; margin: 0 auto"
/>
</el-dialog>
</div>
</template>
@ -55,13 +76,9 @@ export default {
uploadImgUrl: {
type: String,
default: () => '/system/oss/upload'
},
accept: {
type: String,
default: () => ".png,.jpg,.jpeg"
}
},
data () {
data() {
return {
number: 0,
uploadList: [],
@ -78,16 +95,19 @@ export default {
},
watch: {
value: {
handler (val) {
handler(val) {
if (val) {
// 首先将值转为数组
const list = Array.isArray(val) ? val : this.value.split(',')
// 然后将数组转为对象数组
this.fileList = list.map(item => {
if (typeof item === 'string') {
console.log(333333)
if (item.indexOf(this.baseUrl) === -1) {
item = { name: item, url: item }
console.log(item)
} else {
console.log(7777)
item = { name: item, url: item }
}
}
@ -104,13 +124,13 @@ export default {
},
computed: {
// 是否显示提示
showTip () {
showTip() {
return this.isShowTip && (this.fileType || this.fileSize)
}
},
methods: {
// 上传前loading加载
handleBeforeUpload (file) {
handleBeforeUpload(file) {
let isImg = false
if (this.fileType.length) {
let fileExtension = ''
@ -141,11 +161,11 @@ export default {
this.number++
},
// 文件个数超出
handleExceed () {
handleExceed() {
this.$modal.msgError(`上传文件数量不能超过 ${this.limit} 个!`)
},
// 上传成功回调
handleUploadSuccess (res, file) {
handleUploadSuccess(res, file) {
if (res.code === 200) {
this.uploadList.push({ name: res.data.url, url: res.data.url, size: res.fileSize })
this.uploadedSuccessfully()
@ -158,7 +178,7 @@ export default {
}
},
// 删除图片
handleDelete (file) {
handleDelete(file) {
const findex = this.fileList.map(f => f.name).indexOf(file.name)
if (findex > -1) {
this.fileList.splice(findex, 1)
@ -166,12 +186,12 @@ export default {
}
},
// 上传失败
handleUploadError () {
handleUploadError() {
this.$modal.msgError('上传图片失败，请重试')
this.$modal.closeLoading()
},
// 上传结束处理
uploadedSuccessfully () {
uploadedSuccessfully() {
if (this.number > 0 && this.uploadList.length === this.number) {
this.fileList = this.fileList.concat(this.uploadList)
console.log(this.fileList, '313211321312')
@ -183,12 +203,12 @@ export default {
}
},
// 预览
handlePictureCardPreview (file) {
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url
this.dialogVisible = true
},
// 对象转成指定字符串分隔
listToString (list, separator) {
listToString(list, separator) {
let strs = ''
separator = separator || ','
for (let i in list) {
@ -214,8 +234,7 @@ export default {
transition: all 0s;
}
::v-deep .el-list-enter,
.el-list-leave-active {
::v-deep .el-list-enter, .el-list-leave-active {
opacity: 0;
transform: translateY(0);
}

12
sf-ui/src/components/SizeSelect/index.vue
View File

@ -1,10 +1,10 @@
<template>
<el-dropdown trigger="hover" @command="handleSetSize">
<el-dropdown trigger="click" @command="handleSetSize">
<div>
<svg-icon class-name="size-icon" icon-class="size" />
</div>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item v-for="item of sizeOptions" :key="item.value" :disabled="size === item.value" :command="item.value">
<el-dropdown-item v-for="item of sizeOptions" :key="item.value" :disabled="size===item.value" :command="item.value">
{{ item.label }}
</el-dropdown-item>
</el-dropdown-menu>
@ -13,7 +13,7 @@
<script>
export default {
data () {
data() {
return {
sizeOptions: [
{ label: 'Default', value: 'default' },
@ -24,12 +24,12 @@ export default {
}
},
computed: {
size () {
size() {
return this.$store.getters.size
}
},
methods: {
handleSetSize (size) {
handleSetSize(size) {
this.$ELEMENT.size = size
this.$store.dispatch('app/setSize', size)
this.refreshView()
@ -38,7 +38,7 @@ export default {
type: 'success'
})
},
refreshView () {
refreshView() {
// In order to make the cached page re-rendered
this.$store.dispatch('tagsView/delAllCachedViews', this.$route)

4
sf-ui/src/layout/components/AppMain.vue
View File

@ -30,10 +30,9 @@ export default {
.app-main {
/* 50= navbar 50 */
min-height: calc(100vh - 50px);
height: calc(100vh - 50px);
width: 100%;
position: relative;
overflow: auto;
overflow: hidden;
}
.fixed-header + .app-main {
@ -44,7 +43,6 @@ export default {
.app-main {
/* 84 = navbar + tags-view = 50 + 34 */
min-height: calc(100vh - 84px);
height: calc(100vh - 84px);
}
.fixed-header + .app-main {

51
sf-ui/src/layout/components/Navbar.vue
View File

@ -1,35 +1,36 @@
<template>
<div class="navbar">
<hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container"
@toggleClick="toggleSideBar" />
<!-- <div style="float: left; line-height: 50px;" class="sidebar-logo-container">
<Logo :collapse="true" />
</div> -->
<hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
<breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav" />
<top-nav id="topmenu-container" class="topmenu-container" v-if="topNav" />
<breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/>
<top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/>
<div class="right-menu">
<!-- <template v-if="device !== 'mobile'">
<template v-if="device!=='mobile'">
<search id="header-search" class="right-menu-item" />
<el-tooltip content="源码地址" effect="dark" placement="bottom">
<!-- <el-tooltip content="源码地址" effect="dark" placement="bottom">
<ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />
</el-tooltip>
<el-tooltip content="文档地址" effect="dark" placement="bottom">
<ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />
</el-tooltip>
</el-tooltip> -->
<screenfull id="screenfull" class="right-menu-item hover-effect" />
<el-tooltip content="布局大小" effect="dark" placement="bottom">
<!-- <el-tooltip content="布局大小" effect="dark" placement="bottom">
<size-select id="size-select" class="right-menu-item hover-effect" />
</el-tooltip>
</el-tooltip> -->
</template> -->
</template>
<el-dropdown class="avatar-container right-menu-item hover-effect" trigger="hover">
<el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
<div class="avatar-wrapper">
<img :src="avatar" class="user-avatar">
<span class="ml10">{{ name }}</span>
<i class="el-icon-caret-bottom" />
</div>
<el-dropdown-menu slot="dropdown">
@ -50,6 +51,7 @@
<script>
import { mapGetters } from 'vuex'
import Logo from "../components/Sidebar/Logo";
import Breadcrumb from '@/components/Breadcrumb'
import TopNav from '@/components/TopNav'
import Hamburger from '@/components/Hamburger'
@ -61,6 +63,7 @@ import RuoYiDoc from '@/components/RuoYi/Doc'
export default {
components: {
Logo,
Breadcrumb,
TopNav,
Hamburger,
@ -74,14 +77,13 @@ export default {
...mapGetters([
'sidebar',
'avatar',
'device',
'name'
'device'
]),
setting: {
get () {
get() {
return this.$store.state.settings.showSettings
},
set (val) {
set(val) {
this.$store.dispatch('settings/changeSetting', {
key: 'showSettings',
value: val
@ -89,16 +91,16 @@ export default {
}
},
topNav: {
get () {
get() {
return this.$store.state.settings.topNav
}
}
},
methods: {
toggleSideBar () {
toggleSideBar() {
this.$store.dispatch('app/toggleSideBar')
},
async logout () {
async logout() {
this.$confirm('确定注销并退出系统吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
@ -107,7 +109,7 @@ export default {
this.$store.dispatch('LogOut').then(() => {
location.href = '/index';
})
}).catch(() => { });
}).catch(() => {});
}
}
}
@ -119,7 +121,7 @@ export default {
overflow: hidden;
position: relative;
background: #fff;
box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
box-shadow: 0 1px 4px rgba(0,21,41,.08);
.hamburger-container {
line-height: 46px;
@ -127,7 +129,7 @@ export default {
float: left;
cursor: pointer;
transition: background .3s;
-webkit-tap-highlight-color: transparent;
-webkit-tap-highlight-color:transparent;
&:hover {
background: rgba(0, 0, 0, .025)
@ -181,9 +183,6 @@ export default {
.avatar-wrapper {
margin-top: 5px;
position: relative;
display: flex;
align-items: center;
line-height: initial;
.user-avatar {
cursor: pointer;
@ -196,7 +195,7 @@ export default {
cursor: pointer;
position: absolute;
right: -20px;
// top: 25px;
top: 25px;
font-size: 12px;
}
}

2
sf-ui/src/layout/components/Sidebar/Logo.vue
View File

@ -14,7 +14,7 @@
</template>
<script>
import logoImg from '@/assets/logo/logo.svg'
import logoImg from '@/assets/logo/logo.png'
import variables from '@/assets/styles/variables.scss'
export default {

1
sf-ui/src/layout/components/index.js
View File

@ -1,5 +1,6 @@
export { default as AppMain } from './AppMain'
export { default as Navbar } from './Navbar'
// export { default as NavbarNew } from './NavbarNew'
export { default as Settings } from './Settings'
export { default as Sidebar } from './Sidebar/index.vue'
export { default as TagsView } from './TagsView/index.vue'

8
sf-ui/src/main.js
View File

@ -18,7 +18,7 @@ import './assets/icons' // icon
import './permission' // permission control
import { getDicts } from "@/api/system/dict/data";
import { getConfigKey } from "@/api/system/config";
import { parseTime, resetForm, addDateRange, selectDictLabel, selectDictLabels, handleTree, addDateRange2 } from "@/utils/ruoyi";
import { parseTime, resetForm, addDateRange, selectDictLabel, selectDictLabels, handleTree } from "@/utils/ruoyi";
// 分页组件
import Pagination from "@/components/Pagination";
// 自定义表格工具组件
@ -48,7 +48,6 @@ Vue.prototype.selectDictLabel = selectDictLabel
Vue.prototype.selectDictLabels = selectDictLabels
Vue.prototype.download = download
Vue.prototype.handleTree = handleTree
Vue.prototype.addDateRange2 = addDateRange2
// 全局组件挂载
Vue.component('DictTag', DictTag)
@ -72,10 +71,7 @@ DictData.install()
* Currently MockJs will be used in the production environment,
* please remove it before going online! ! !
*/
Element.Table.props.stripe = { type: Boolean, default: true }
Element.Dialog.props.closeOnPressEscape = { type: Boolean, default: false }
// Element.Dialog.props.width = { type: Boolean, default: '700' }
// Element.Radio.props.border = { type: Boolean, default: true }
Vue.use(Element, {
size: Cookies.get('size') || 'medium' // set element-ui default size
})

5
sf-ui/src/permission.js
View File

@ -10,7 +10,7 @@ import { getApplicationId } from './utils/application'
NProgress.configure({ showSpinner: false })
const whiteList = ['/login', '/register']
const needApplicationList = ['/build', '/gateway']
const needApplicationList = ['/build/installationList', '/build/whiteListManagement', '/build/publish']
router.beforeEach((to, from, next) => {
NProgress.start()
@ -65,8 +65,7 @@ router.beforeEach((to, from, next) => {
})
function checkApplication(path) {
return needApplicationList.some(item => path.startsWith(item)) && !getApplicationId()
// return needApplicationList.includes(path) && !getApplicationId();
return needApplicationList.includes(path) && !getApplicationId();
}
router.afterEach(() => {

203
sf-ui/src/router/index.js
View File

@ -19,12 +19,12 @@ Vue.use(Router)
* roles: ['admin', 'common'] // 访问路由的角色权限
* permissions: ['a:a:a', 'b:b:b'] // 访问路由的菜单权限
* meta : {
noCache: true // 如果设置为true，则不会被 <keep-alive> 缓存(默认 false)
title: 'title' // 设置该路由在侧边栏和面包屑中展示的名字
icon: 'svg-name' // 设置该路由的图标，对应路径src/assets/icons/svg
breadcrumb: false // 如果设置为false，则不会在breadcrumb面包屑中显示
activeMenu: '/system/user' // 当路由设置了该属性，则会高亮相对应的侧边栏。
}
noCache: true // 如果设置为true，则不会被 <keep-alive> 缓存(默认 false)
title: 'title' // 设置该路由在侧边栏和面包屑中展示的名字
icon: 'svg-name' // 设置该路由的图标，对应路径src/assets/icons/svg
breadcrumb: false // 如果设置为false，则不会在breadcrumb面包屑中显示
activeMenu: '/system/user' // 当路由设置了该属性，则会高亮相对应的侧边栏。
}
*/
// 公共路由
@ -88,44 +88,20 @@ export const constantRoutes = [
]
},
// 本地测试-----------
// {
// path: '/gateway',
// component: Layout,
// hidden: true,
// redirect: 'server-config',
// children: [
// // {
// // path: 'server-config',
// // component: () => import('@/views/gateway/server/config/index'),
// // name: 'serverConfig',
// // meta: { title: '新增服务配置', breadcrumb: false, }
// // },
// // {
// // path: 'server-detail',
// // component: () => import('@/views/gateway/server/detail'),
// // name: 'serverDetail',
// // meta: { title: '服务详情', breadcrumb: false, }
// // },
// // {
// // path: 'route-edit',
// // component: () => import('@/views/gateway/route/edit'),
// // name: 'routeEdit',
// // meta: { title: '路由配置', breadcrumb: false, }
// // },
// // {
// // path: 'strategy-edit',
// // component: () => import('@/views/gateway/strategy/edit'),
// // name: 'strategyEdit',
// // meta: { title: '策略配置', breadcrumb: false, }
// // },
// // {
// // path: 'interface-edit',
// // component: () => import('@/views/gateway/interface/edit'),
// // name: 'interfaceEdit',
// // meta: { title: '接口配置', breadcrumb: false, }
// // }
// ]
// },
{
path: '/gateway',
component: Layout,
hidden: true,
redirect: 'server-config',
children: [
{
path: 'server-config',
component: () => import('@/views/gateway/server/config/index'),
name: 'serverConfig',
meta: { title: '新增服务配置', breadcrumb: false, }
}
]
},
// 本地测试-----------
]
@ -139,7 +115,8 @@ export const dynamicRoutes = [
children: [
{
path: 'role/:userId(\\d+)',
component: () => import('@/views/system/user/authRole'),
// component: () => import('@/views/system/user/authRole'),
component: (resolve) => require(['@/views/system/user/authRole'], resolve),
name: 'AuthRole',
meta: { title: '分配角色', activeMenu: '/system/user' }
}
@ -201,7 +178,139 @@ export const dynamicRoutes = [
}
]
},
{
path: '/build/install',
component: Layout,
hidden: true,
permissions: ['build:install:add'],
children: [
{
path: 'add',
component: () => import('@/views/FDS/installationList/add'),
name: 'InstallAdd',
meta: { title: '新增安装包', activeMenu: '/build/installationList' }
}
]
},
{
path: '/build/install',
component: Layout,
hidden: true,
permissions: ['build:install:edit'],
children: [
{
path: 'edit',
component: () => import('@/views/FDS/installationList/edit'),
name: 'InstallEdit',
meta: { title: '编辑安装包', activeMenu: '/build/installationList' }
}
]
},
{
path: '/build/install',
component: Layout,
hidden: true,
permissions: ['build:install:detail'],
children: [
{
path: 'detail',
component: () => import('@/views/FDS/installationList/detail'),
name: 'InstallDetail',
meta: { title: '安装包详情', activeMenu: '/build/installationList' }
}
]
},
{
path: '/build/publishList',
component: Layout,
hidden: true,
permissions: ['build:publishList:add'],
children: [
{
path: 'add',
component: () => import('@/views/FDS/publishList/add'),
name: 'PublishAdd',
meta: { title: '新增发布', activeMenu: '/build/publish' }
}
]
},
{
path: '/build/publishList',
component: Layout,
hidden: true,
permissions: ['build:publishList:detail'],
children: [
{
path: 'detail',
component: () => import('@/views/FDS/publishList/detail'),
name: 'PublishDetail',
meta: { title: '发布详情', activeMenu: '/build/publish' }
}
]
},
{
path: '/build/whiteList',
component: Layout,
hidden: true,
permissions: ['build:whiteListManagement:add'],
children: [
{
path: 'add',
component: () => import('@/views/FDS/whiteListManagement/add'),
name: 'WhiteListManagementAdd',
meta: { title: '新增白名单', activeMenu: '/build/whiteListManagement' }
}
]
},
{
path: '/build/whiteList',
component: Layout,
hidden: true,
permissions: ['build:whiteListManagement:detail'],
children: [
{
path: 'detail',
component: () => import('@/views/FDS/whiteListManagement/detail'),
name: 'WhiteListManagementDetail',
meta: { title: '白名单详情', activeMenu: '/build/whiteListManagement' }
}
]
},
{
path: '/build/whiteList',
component: Layout,
hidden: true,
permissions: ['build:whiteListManagement:equepDetail'],
children: [
{
path: 'equepDetail',
component: () => import('@/views/FDS/whiteListManagement/equepDetail'),
name: 'WhiteListManagementEquepDetail',
meta: { title: '白名单设备详情', activeMenu: '/build/whiteListManagement' }
}
]
},
{
path: '/build/whiteList',
component: Layout,
hidden: true,
permissions: ['build:whiteListManagement:addConfig'],
children: [
{
path: 'addConfig',
component: () => import('@/views/FDS/whiteListManagement/addConfig'),
name: 'WhiteListManagementConfigAdd',
meta: { title: '新增白名单配置', activeMenu: '/build/whiteListManagement' }
}
]
}
]
@ -209,11 +318,11 @@ export const dynamicRoutes = [
let routerPush = Router.prototype.push
let routerReplace = Router.prototype.replace
// push
Router.prototype.push = function push (location) {
Router.prototype.push = function push(location) {
return routerPush.call(this, location).catch(err => err)
}
// replace
Router.prototype.replace = function push (location) {
Router.prototype.replace = function push(location) {
return routerReplace.call(this, location).catch(err => err)
}

2
sf-ui/src/store/modules/settings.js
View File

@ -5,7 +5,7 @@ const { sideTheme, showSettings, topNav, tagsView, fixedHeader, sidebarLogo, dyn
const storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || ''
const state = {
title: '',
theme: storageSetting.theme || '#3F68FF',
theme: storageSetting.theme || '#409EFF',
sideTheme: storageSetting.sideTheme || sideTheme,
showSettings: showSettings,
topNav: storageSetting.topNav === undefined ? topNav : storageSetting.topNav,

30
sf-ui/src/store/modules/user.js
View File

@ -37,15 +37,15 @@ const user = {
state.permissions = permissions
},
SET_APPLICATION: (state, applicationInfo) => {
const { appCode } = applicationInfo
state.applicationId = appCode || ''
const { id } = applicationInfo
state.applicationId = id || ''
state.applicationInfo = applicationInfo
}
},
actions: {
// 登录
Login ({ commit }, userInfo) {
Login({ commit }, userInfo) {
const username = userInfo.username.trim()
const password = userInfo.password
const code = userInfo.code
@ -62,11 +62,11 @@ const user = {
},
// 获取用户信息
GetInfo ({ commit, state }) {
GetInfo({ commit, state }) {
return new Promise((resolve, reject) => {
getInfo().then(res => {
const user = res.user
const avatar = (user.avatar == '' || user.avatar == null) ? require('@/assets/images/profile.png') : process.env.VUE_APP_BASE_API + user.avatar
const avatar = (user.avatar == '' || user.avatar == null) ? require('@/assets/images/profile.jpg') : process.env.VUE_APP_BASE_API + user.avatar
if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组
commit('SET_ROLES', res.roles)
commit('SET_PERMISSIONS', res.permissions)
@ -83,7 +83,7 @@ const user = {
},
// 退出系统
LogOut ({ commit, state }) {
LogOut({ commit, state }) {
return new Promise((resolve, reject) => {
logout(state.token).then(() => {
commit('SET_TOKEN', '')
@ -100,7 +100,7 @@ const user = {
},
// 前端 登出
FedLogOut ({ commit }) {
FedLogOut({ commit }) {
return new Promise(resolve => {
commit('SET_TOKEN', '')
commit('SET_APPLICATION', {})
@ -111,11 +111,11 @@ const user = {
},
// 设置选中的项目应用信息
SetApplication ({ commit }, applicationInfo) {
SetApplication({ commit }, applicationInfo) {
commit('SET_APPLICATION', applicationInfo)
const { appCode, appName, isAdmin } = applicationInfo || {}
if (appCode) {
setApplicationId(appCode)
const { id, appName } = applicationInfo || {}
if (id) {
setApplicationId(applicationInfo.id)
Cookies.set('Admin-Application-appCode', applicationInfo.appCode)
} else {
removeApplicationId()
@ -126,14 +126,6 @@ const user = {
} else {
removeApplicationName()
}
if (isAdmin) {
Cookies.set('Admin-isAdmin', isAdmin)
} else {
Cookies.set('Admin-isAdmin', 0)
}
}
}
}

12
sf-ui/src/utils/application.js
View File

@ -8,7 +8,7 @@ const ApplicationKeywords = 'Admin-Application-Name'
* 该函数从Cookie中检索与应用项目相关的关键信息。
* @returns {string} 返回从Cookie中获取的应用项目ID。
*/
export function getApplicationId () {
export function getApplicationId() {
return Cookies.get(ApplicationKey)
}
@ -17,7 +17,7 @@ export function getApplicationId () {
* 该函数从Cookie中检索与应用项目相关的关键信息。
* @returns {string} 返回从Cookie中获取的应用项目ID。
*/
export function getApplicationName () {
export function getApplicationName() {
return Cookies.get(ApplicationKeywords)
}
@ -26,7 +26,7 @@ export function getApplicationName () {
* @param {string} ApplicationId - 需要设置的应用项目ID。
* @return {boolean|Object} 返回Cookie设置的结果。成功则返回true，失败则返回设置失败的对象。
*/
export function setApplicationId (ApplicationId) {
export function setApplicationId(ApplicationId) {
return Cookies.set(ApplicationKey, ApplicationId)
}
@ -35,7 +35,7 @@ export function setApplicationId (ApplicationId) {
* @param {string} ApplicationId - 需要设置的应用项目名称。
* @return {boolean|Object} 返回Cookie设置的结果。成功则返回true，失败则返回设置失败的对象。
*/
export function setApplicationName (ApplicationName) {
export function setApplicationName(ApplicationName) {
return Cookies.set(ApplicationKeywords, ApplicationName)
}
@ -44,7 +44,7 @@ export function setApplicationName (ApplicationName) {
* 本函数用于删除与应用相关的ID Cookie。
* @returns {boolean} 返回删除操作的结果。如果删除成功，则返回true；如果删除失败，则返回false。
*/
export function removeApplicationId () {
export function removeApplicationId() {
return Cookies.remove(ApplicationKey)
}
@ -53,7 +53,7 @@ export function removeApplicationId () {
* 本函数用于删除与应用相关的Name Cookie。
* @returns {boolean} 返回删除操作的结果。如果删除成功，则返回true；如果删除失败，则返回false。
*/
export function removeApplicationName () {
export function removeApplicationName() {
return Cookies.remove(ApplicationKeywords)
}

3
sf-ui/src/utils/eventBus.js
View File

@ -1,3 +0,0 @@
import vue from 'vue'
const EventBus = new vue();
export default EventBus;

88
sf-ui/src/utils/request.js
View File

@ -7,7 +7,6 @@ import { blobValidate, tansParams } from '@/utils/ruoyi'
import cache from '@/plugins/cache'
import { saveAs } from 'file-saver'
import Cookies from 'js-cookie'
import router from '@/router'
let downloadLoadingInstance
// 是否显示重新登录
@ -73,53 +72,44 @@ service.interceptors.request.use(config => {
// 响应拦截器
service.interceptors.response.use(res => {
// 未设置状态码则默认成功状态
const code = res.data.code || 200
// 获取错误信息
const msg = errorCode[code] || res.data.msg || errorCode['default']
// 二进制数据则直接返回
if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') {
return res.data
}
if (code === 401) {
if (!isRelogin.show) {
isRelogin.show = true
MessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', {
confirmButtonText: '重新登录',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
isRelogin.show = false
store.dispatch('LogOut').then(() => {
location.href = '/index'
})
}).catch(() => {
isRelogin.show = false
})
// 未设置状态码则默认成功状态
const code = res.data.code || 200
// 获取错误信息
const msg = errorCode[code] || res.data.msg || errorCode['default']
// 二进制数据则直接返回
if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') {
return res.data
}
return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
} else if (code === 4030) {
MessageBox.confirm('AppCode未找到，请重新选择项目。', '系统提示', {
confirmButtonText: '重新选择',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
router.push('/')
})
return Promise.reject('AppCode未找到，请重新选择项目。')
} else if (code === 500) {
Message({ message: msg, type: 'error' })
return Promise.reject(new Error(msg))
} else if (code === 601) {
Message({ message: msg, type: 'warning' })
return Promise.reject('error')
} else if (code !== 200) {
Notification.error({ title: msg })
return Promise.reject('error')
} else {
return res.data
}
},
if (code === 401) {
if (!isRelogin.show) {
isRelogin.show = true
MessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', {
confirmButtonText: '重新登录',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
isRelogin.show = false
store.dispatch('LogOut').then(() => {
location.href = '/index'
})
}).catch(() => {
isRelogin.show = false
})
}
return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
} else if (code === 500) {
Message({ message: msg, type: 'error' })
return Promise.reject(new Error(msg))
} else if (code === 601) {
Message({ message: msg, type: 'warning' })
return Promise.reject('error')
} else if (code !== 200) {
Notification.error({ title: msg })
return Promise.reject('error')
} else {
return res.data
}
},
error => {
console.log('err' + error)
let { message } = error
@ -136,7 +126,7 @@ service.interceptors.response.use(res => {
)
// 通用下载方法
export function download (url, params, filename, config) {
export function download(url, params, filename, config) {
downloadLoadingInstance = Loading.service({
text: '正在下载数据，请稍候',
spinner: 'el-icon-loading',
@ -149,7 +139,7 @@ export function download (url, params, filename, config) {
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
responseType: 'blob',
...config
}).then(async (data) => {
}).then(async(data) => {
const isBlob = blobValidate(data)
if (isBlob) {
const blob = new Blob([data])

45
sf-ui/src/utils/ruoyi.js
View File

@ -6,7 +6,7 @@
*/
// 日期格式化
export function parseTime (time, pattern) {
export function parseTime(time, pattern) {
if (arguments.length === 0 || !time) {
return null
}
@ -47,14 +47,14 @@ export function parseTime (time, pattern) {
}
// 表单重置
export function resetForm (refName) {
export function resetForm(refName) {
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
}
// 添加日期范围
export function addDateRange (params, dateRange, propName) {
export function addDateRange(params, dateRange, propName) {
let search = params;
search.params = typeof (search.params) === 'object' && search.params !== null && !Array.isArray(search.params) ? search.params : {};
dateRange = Array.isArray(dateRange) ? dateRange : [];
@ -68,27 +68,8 @@ export function addDateRange (params, dateRange, propName) {
return search;
}
// 添加日期范围
export function addDateRange2 (params, dateRange, propName) {
let search = params;
search.params = typeof (search.params) === 'object' && search.params !== null && !Array.isArray(search.params) ? search.params : {};
dateRange = Array.isArray(dateRange) ? dateRange : [];
if (typeof (propName) === 'undefined') {
search.beginTime = dateRange[0];
search.endTime = dateRange[1];
} else {
search.params['begin' + propName] = dateRange[0];
search.params['end' + propName] = dateRange[1];
}
return search;
}
// 回显数据字典
export function selectDictLabel (datas, value) {
export function selectDictLabel(datas, value) {
if (value === undefined) {
return "";
}
@ -106,8 +87,8 @@ export function selectDictLabel (datas, value) {
}
// 回显数据字典（字符串、数组）
export function selectDictLabels (datas, value, separator) {
if (value === undefined || value.length === 0) {
export function selectDictLabels(datas, value, separator) {
if (value === undefined || value.length ===0) {
return "";
}
if (Array.isArray(value)) {
@ -132,7 +113,7 @@ export function selectDictLabels (datas, value, separator) {
}
// 字符串格式化(%s )
export function sprintf (str) {
export function sprintf(str) {
var args = arguments, flag = true, i = 1;
str = str.replace(/%s/g, function () {
var arg = args[i++];
@ -146,7 +127,7 @@ export function sprintf (str) {
}
// 转换字符串，undefined,null等转化为""
export function parseStrEmpty (str) {
export function parseStrEmpty(str) {
if (!str || str == "undefined" || str == "null") {
return "";
}
@ -154,7 +135,7 @@ export function parseStrEmpty (str) {
}
// 数据合并
export function mergeRecursive (source, target) {
export function mergeRecursive(source, target) {
for (var p in target) {
try {
if (target[p].constructor == Object) {
@ -176,7 +157,7 @@ export function mergeRecursive (source, target) {
* @param {*} parentId 父节点字段 默认 'parentId'
* @param {*} children 孩子节点字段 默认 'children'
*/
export function handleTree (data, id, parentId, children) {
export function handleTree(data, id, parentId, children) {
let config = {
id: id || 'id',
parentId: parentId || 'parentId',
@ -207,7 +188,7 @@ export function handleTree (data, id, parentId, children) {
adaptToChildrenList(t);
}
function adaptToChildrenList (o) {
function adaptToChildrenList(o) {
if (childrenListMap[o[config.id]] !== null) {
o[config.childrenList] = childrenListMap[o[config.id]];
}
@ -224,7 +205,7 @@ export function handleTree (data, id, parentId, children) {
* 参数处理
* @param {*} params 参数
*/
export function tansParams (params) {
export function tansParams(params) {
let result = ''
for (const propName of Object.keys(params)) {
const value = params[propName];
@ -247,6 +228,6 @@ export function tansParams (params) {
}
// 验证是否为blob格式
export function blobValidate (data) {
export function blobValidate(data) {
return data.type !== 'application/json'
}

37
sf-ui/src/views/FDS/installationList/add.vue
View File

@ -8,29 +8,25 @@
<el-main>
<div class="form-main">
<el-form ref="elForm" :model="formData" :rules="rules" label-width="100px" size="medium">
<el-form-item label="上传方式" prop="uploadingType">
<el-radio-group v-model="formData.uploadingType" size="medium">
<el-radio v-for="(item, index) in dict.type.sys_apk_uploading_type" :key="index"
:disabled="item.disabled"
:label="item.value"
>{{ item.label }}
</el-radio>
</el-radio-group>
</el-form-item>
<!-- <el-form-item label="上传方式" prop="uploadingType">-->
<!-- <el-radio-group v-model="formData.uploadingType" size="medium">-->
<!-- <el-radio v-for="(item, index) in dict.type.sys_apk_uploading_type" :key="index"-->
<!-- :disabled="item.disabled"-->
<!-- :label="item.value"-->
<!-- >{{ item.label }}-->
<!-- </el-radio>-->
<!-- </el-radio-group>-->
<!-- </el-form-item>-->
<el-form-item v-if="activeTabs==='1'" label="安装包名称" prop="sysApkName">
<el-input v-model="formData.sysApkName" :style="{width: '100%'}" clearable placeholder="请输入安装包名称">
</el-input>
</el-form-item>
<!-- <el-form-item v-else label="模块包名称" prop="field107">-->
<!-- <el-input v-model="formData.field107" :style="{width: '100%'}" clearable placeholder="请输入模块包名称">-->
<!-- </el-input>-->
<!-- </el-form-item>-->
<el-form-item label="版本号" prop="version">
<el-input v-model="formData.version" :style="{width: '100%'}" clearable placeholder="请输入版本号">
</el-input>
</el-form-item>
<el-form-item label="安装包文件" prop="sysApk">
<file-upload v-model="formData.sysApk" :fileType="['apk','txt']" :limit="1"
<file-upload v-model="formData.sysApk" :fileSize="50" :fileType="['apk','hap','iap','zip']" :limit="1"
@getSize="getSize"
/>
@ -47,16 +43,6 @@
</el-radio>
</el-radio-group>
</el-form-item>
<!-- <el-form-item v-if="activeTabs!='1'" label="适用模块" prop="configName">-->
<!-- <el-select v-model="formData.field108" clearable placeholder="请选择对应的模块">-->
<!-- <el-option-->
<!-- v-for="dict in dict.type.sys_yes_no"-->
<!-- :key="dict.value"-->
<!-- :label="dict.label"-->
<!-- :value="dict.value"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item size="large">
<el-button type="primary" @click="submitForm">提交</el-button>
<el-button @click="cancel">取 消</el-button>
@ -77,7 +63,7 @@ export default {
data() {
return {
formData: {
uploadingType: 'OffLineUploading',
uploadingType: 'OnLineUploading',
sysApkName: undefined,
version: undefined,
sysApk: null,
@ -123,6 +109,7 @@ export default {
})
},
getSize(e) {
console.log(e)
this.formData.sysApkSize = e[0].size + 'kb'
},
cancel() {

8
sf-ui/src/views/FDS/installationList/detail.vue
View File

@ -27,11 +27,11 @@
</el-form-item>
<el-form-item v-if="activeTabs!='1'" label="适用模块：">登录模块</el-form-item>
<el-form-item label="上传时间：">{{ form.createTime }}</el-form-item>
<el-form-item label="上传状态：">
<dict-tag :options="dict.type.uploading_status" :value="form.uploadingStatus"/>
</el-form-item>
<!-- <el-form-item label="上传状态：">-->
<!-- <dict-tag :options="dict.type.uploading_status" :value="form.uploadingStatus"/>-->
<!-- </el-form-item>-->
<el-form-item label="上传人员：">{{ form.created }}</el-form-item>
<el-form-item label="上传日志：">日志日志</el-form-item>
<!-- <el-form-item label="上传日志："></el-form-item>-->
<el-form-item size="large">
<el-button @click="cancel">关 闭</el-button>
</el-form-item>

35
sf-ui/src/views/FDS/installationList/edit.vue
View File

@ -8,30 +8,27 @@
<el-main>
<div class="form-main">
<el-form ref="elForm" :model="formData" :rules="rules" label-width="100px" size="medium">
<el-form-item label="上传方式" prop="uploadingType">
<el-radio-group v-model="formData.uploadingType" size="medium">
<el-radio v-for="(item, index) in dict.type.sys_apk_uploading_type" :key="index"
:disabled="item.disabled"
:label="item.value"
>{{ item.label }}
</el-radio>
</el-radio-group>
</el-form-item>
<!-- <el-form-item label="上传方式" prop="uploadingType">-->
<!-- <el-radio-group v-model="formData.uploadingType" size="medium">-->
<!-- <el-radio v-for="(item, index) in dict.type.sys_apk_uploading_type" :key="index"-->
<!-- :disabled="item.disabled"-->
<!-- :label="item.value"-->
<!-- >{{ item.label }}-->
<!-- </el-radio>-->
<!-- </el-radio-group>-->
<!-- </el-form-item>-->
<el-form-item v-if="activeTabs==='1'" label="安装包名称" prop="sysApkName">
<el-input v-model="formData.sysApkName" :style="{width: '100%'}" clearable placeholder="请输入安装包名称">
</el-input>
</el-form-item>
<!-- <el-form-item v-else label="模块包名称" prop="field107">-->
<!-- <el-input v-model="formData.field107" :style="{width: '100%'}" clearable placeholder="请输入模块包名称">-->
<!-- </el-input>-->
<!-- </el-form-item>-->
<el-form-item label="版本号" prop="version">
<el-input v-model="formData.version" :style="{width: '100%'}" clearable placeholder="请输入版本号">
</el-input>
</el-form-item>
<el-form-item label="安装包文件" prop="sysApk">
<file-upload v-model="formData.sysApk" :fileType="['apk','txt']" :limit="1"
<file-upload v-model="formData.sysApk" :fileSize="50" :fileType="['apk','hap','iap','zip']" :limit="1"
:uploadFileUrl="formData.uploadingType==='OffLineUploading'?'/system/oss/zip/upload':'/system/oss/upload'"
@getSize="getSize"
/>
@ -48,16 +45,6 @@
</el-radio>
</el-radio-group>
</el-form-item>
<!-- <el-form-item v-if="activeTabs!='1'" label="适用模块" prop="configName">-->
<!-- <el-select v-model="formData.field108" clearable placeholder="请选择对应的模块">-->
<!-- <el-option-->
<!-- v-for="dict in dict.type.sys_yes_no"-->
<!-- :key="dict.value"-->
<!-- :label="dict.label"-->
<!-- :value="dict.value"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item size="large">
<el-button type="primary" @click="submitForm">提交</el-button>
<el-button @click="cancel">取 消</el-button>

489
sf-ui/src/views/FDS/installationList/index.vue
View File

@ -1,68 +1,39 @@
<template>
<div class="app-container">
<el-tabs v-model="activeTabs" type="card" @tab-click="handleClickTabs">
<el-tab-pane
v-for="item in packTabs"
:key="item.name"
:label="item.title"
:name="item.name"
>
</el-tab-pane>
</el-tabs>
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="90px" size="small">
<el-form-item label="上传类型" prop="uploadingType">
<el-select v-model="queryParams.uploadingType" clearable placeholder="请选择上传类型">
<el-option
v-for="dict in dict.type.sys_apk_uploading_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="120px" size="small">
<!-- <el-form-item label="上传类型" prop="uploadingType">-->
<!-- <el-select v-model="queryParams.uploadingType" placeholder="请选择上传类型" clearable>-->
<!-- <el-option-->
<!-- v-for="dict in dict.type.sys_apk_uploading_type"-->
<!-- :key="dict.value"-->
<!-- :label="dict.label"-->
<!-- :value="dict.value"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item label="安装包名称" prop="sysApkName">
<el-input
v-model="queryParams.sysApkName"
clearable
placeholder="请输入安装包名称"
@keyup.enter.native="handleQuery"
/>
<el-input v-model="queryParams.sysApkName" clearable placeholder="请输入安装包名称" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="版本号" prop="version">
<el-input
v-model="queryParams.version"
clearable
placeholder="请输入版本号"
@keyup.enter.native="handleQuery"
/>
<el-input v-model="queryParams.version" clearable placeholder="请输入版本号" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="安装包类型" prop="sysType">
<el-select v-model="queryParams.sysType" clearable placeholder="请选择安装包类型">
<el-option
v-for="dict in dict.type.sys_apk_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item label="上传状态" prop="uploadingStatus">
<el-select v-model="queryParams.uploadingStatus" clearable placeholder="请选择上传状态">
<el-option
v-for="dict in dict.type.uploading_status"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
<el-option v-for="dict in dict.type.sys_apk_type" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<!-- <el-form-item label="上传状态" prop="uploadingStatus">-->
<!-- <el-select v-model="queryParams.uploadingStatus" clearable placeholder="请选择上传状态">-->
<!-- <el-option-->
<!-- v-for="dict in dict.type.uploading_status"-->
<!-- :key="dict.value"-->
<!-- :label="dict.label"-->
<!-- :value="dict.value"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item label="创建人" prop="created">
<el-input
v-model="queryParams.created"
clearable
placeholder="请输入创建人"
@keyup.enter.native="handleQuery"
/>
<el-input v-model="queryParams.created" clearable placeholder="请输入创建人" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
@ -72,120 +43,159 @@
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
v-hasPermi="['system:config:add']"
icon="el-icon-plus"
plain
size="mini"
type="primary"
@click="handleAdd"
>新建
<el-button v-hasPermi="['deploy:INFO:add']" icon="el-icon-plus" plain size="mini" type="primary"
@click="handleAdd">新增
</el-button>
</el-col>
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- v-hasPermi="['deploy:INFO:edit']"-->
<!-- :disabled="single"-->
<!-- icon="el-icon-edit"-->
<!-- plain-->
<!-- size="mini"-->
<!-- type="success"-->
<!-- @click="handleUpdate"-->
<!-- >修改-->
<!-- </el-button>-->
<!-- </el-col>-->
<el-col :span="1.5">
<el-button
v-hasPermi="['system:config:delete']"
:disabled="multiple"
icon="el-icon-plus"
plain
size="mini"
type="info"
@click="handleDelete"
>批量删除
<el-button v-hasPermi="['deploy:INFO:remove']" :disabled="multiple" icon="el-icon-delete" plain size="mini"
type="danger" @click="handleDelete">批量删除
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="INFOList" @selection-change="handleSelectionChange">
<el-table-column align="center" type="selection" width="55"/>
<template v-if="activeTabs=='1'">
<el-table-column align="center" label="上传类型" prop="uploadingType">
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_apk_uploading_type" :value="scope.row.uploadingType"/>
</template>
</el-table-column>
<el-table-column align="center" label="安装包名称" prop="sysApkName"/>
<el-table-column align="center" label="版本号" prop="version"/>
<el-table-column align="center" label="安装包" prop="sysApk"/>
<el-table-column align="center" label="安装包大小" prop="sysApkSize"/>
<el-table-column align="center" label="安装包类型" prop="sysType">
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_apk_type" :value="scope.row.sysType"/>
</template>
</el-table-column>
<el-table-column align="center" label="创建人" prop="created"/>
</template>
<template v-if="activeTabs=='2'">
<el-table-column align="center" label="安装包名称" prop="configId"/>
<el-table-column :show-overflow-tooltip="true" align="center" label="版本号" prop="version"/>
<el-table-column :show-overflow-tooltip="true" align="center" label="安装包大小" prop="sys_apk_size"/>
<el-table-column :show-overflow-tooltip="true" align="center" label="上传方式" prop="uploading_type"/>
<el-table-column :show-overflow-tooltip="true" align="center" label="创建人" prop="created"/>
<el-table-column align="center" label="创建时间" prop="create_time" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
</template>
<el-table-column align="center" label="状态" prop="uploading_status">
<template slot-scope="scopeA">
<dict-tag :options="dict.type.uploading_status" :value="scopeA.row.uploadingStatus"/>
<el-table-column align="center" type="selection" width="55" />
<el-table-column align="center" label="安装包名称" prop="sysApkName" />
<el-table-column align="center" label="版本号" prop="version" />
<el-table-column align="center" label="安装包" prop="sysApk">
<template slot="header" slot-scope="scope">
<span>安装包</span>
<el-tooltip placement="top">
<div slot="content">复制当前的安装包地址</div>
<i class="el-icon-warning-outline" size="20"></i>
</el-tooltip>
</template>
<template slot-scope="scope">
<el-button icon="el-icon-copy" type="primary" @click="copyIt(scope.row.sysApk)">复制</el-button>
</template>
</el-table-column>
<el-table-column align="center" class-name="small-padding fixed-width" label="操作" width="250">
<el-table-column align="center" label="安装包大小" prop="sysApkSize" />
<el-table-column align="center" label="安装包类型" prop="sysType">
<template slot-scope="scope">
<el-button
v-hasPermi="['system:config:dowmload']"
icon="el-icon-download"
size="mini"
type="text"
@click="handleDownload(scope.row)"
>下载安装包
<dict-tag :options="dict.type.sys_apk_type" :value="scope.row.sysType" />
</template>
</el-table-column>
<el-table-column align="center" label="创建人" prop="created" />
<el-table-column align="center" class-name="small-padding fixed-width" fixed="right" label="操作">
<template slot-scope="scope">
<el-button icon="el-icon-download" size="mini" type="text" @click="handleDownload(scope.row)">下载安装包
</el-button>
<el-button
v-hasPermi="['system:config:edit']"
icon="el-icon-edit"
size="mini"
type="text"
@click="handleEdit(scope.row)"
>编辑
<el-button v-hasPermi="['deploy:INFO:edit']" icon="el-icon-edit" size="mini" type="text"
@click="handleUpdate(scope.row)">修改
</el-button>
<el-button
v-hasPermi="['system:config:detail']"
icon="el-icon-view"
size="mini"
type="text"
@click="handleDetail(scope.row)"
>详情
<el-button icon="el-icon-view" size="mini" type="text" @click="handleDetail(scope.row)">详情
</el-button>
<el-button
v-hasPermi="['system:config:delete']"
icon="el-icon-delete"
size="mini"
type="text"
@click="handleDelete(scope.row)"
>删除
<el-button v-hasPermi="['deploy:INFO:remove']" icon="el-icon-delete" size="mini" type="text"
@click="handleDelete(scope.row)">删除
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:limit.sync="queryParams.pageSize"
:page.sync="queryParams.pageNum"
:total="total"
@pagination="getList"
/>
<pagination v-show="total > 0" :limit.sync="queryParams.pageSize" :page.sync="queryParams.pageNum" :total="total"
@pagination="getList" />
<!-- 添加或修改安装包管理（新）对话框 -->
<el-dialog :title="title" :visible.sync="open" append-to-body width="700px">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-form-item label="安装包名称" prop="sysApkName">
<el-input v-model="form.sysApkName" placeholder="请输入安装包名称" />
</el-form-item>
<el-form-item label="版本号" prop="version">
<el-input v-model="form.version" placeholder="请输入版本号" />
</el-form-item>
<el-form-item label="安装包" prop="sysApk">
<file-upload v-model="form.sysApk" :accept="['.zip', '.apk', '.hap', '.iap']" :fileSize="50"
:fileType="['apk', 'hap', 'iap', 'zip']" :limit="1" uploadFileUrl="/system/oss/upload" @getSize="getSize" />
</el-form-item>
<el-form-item label="安装包大小" prop="sysApkSize">
<el-input v-model="form.sysApkSize" placeholder="请输入安装包大小" readonly />
</el-form-item>
<el-form-item label="安装包类型" prop="sysType">
<el-select v-model="form.sysType" placeholder="请选择安装包类型">
<el-option v-for="dict in dict.type.sys_apk_type" :key="dict.value" :label="dict.label"
:value="dict.value"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<el-dialog :title="title" :visible.sync="openDetail" append-to-body width="700px">
<el-form ref="form" :model="form" label-width="120px">
<el-form-item label="安装包名称" prop="moduleName">
{{ form.sysApkName }}
</el-form-item>
<el-form-item label="版本号" prop="version">
{{ form.version }}
</el-form-item>
<el-form-item label="安装包" prop="moduleUrl">
{{ form.sysApk }}
</el-form-item>
<el-form-item label="安装包大小" prop="moduleSize">
{{ form.sysApkSize }}
</el-form-item>
<el-form-item label="系统类型" prop="sysType">
{{ form.sysType }}
</el-form-item>
<el-form-item label="下载地址：">
<el-input v-model="form.sysApk" class="input-with-select" readonly>
<el-button slot="append" @click="copyIt(form.sysApk)">复制</el-button>
</el-input>
</el-form-item>
<el-form-item label="上传时间：">{{ form.createTime }}</el-form-item>
<el-form-item label="上传人员：">{{ form.created }}</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelDetail">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { delINFO, listINFO } from '@/api/FDS/installList'
import { addINFO, delINFO, getINFO, listINFO, updateINFO } from '@/api/FDS/installList'
import Cookies from 'js-cookie'
export default {
name: 'InstallationList',
name: 'INFO',
dicts: ['sys_apk_uploading_type', 'uploading_status', 'sys_apk_type'],
data() {
data () {
return {
form: {
uploadingType: 'OnLineUploading',
sysApkName: undefined,
version: undefined,
sysApk: null,
sysApkSize: undefined,
sysType: '',
appCode: Cookies.get('Admin-Application-appCode')
},
// 遮罩层
loading: true,
// 选中数组
@ -200,15 +210,11 @@ export default {
total: 0,
// 安装包管理（新）表格数据
INFOList: [],
packTabs: [{
name: '1',
title: 'APP安装包'
}, {
name: '2',
title: 'H5模块包'
}],
// 日期范围
create_time: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
openDetail: false,
// 查询参数
queryParams: {
pageNum: 1,
@ -220,108 +226,157 @@ export default {
uploadingStatus: null,
created: null
},
// 表单参数
form: {},
activeTabs: '1'
// 表单校验
rules: {
uploadingType: [
{ required: true, message: '上传类型不能为空', trigger: 'change' }
],
sysApkName: [
{ required: true, message: '安装包名称不能为空', trigger: 'blur' }
],
version: [
{ required: true, message: '版本号不能为空', trigger: 'blur' }
],
sysType: [
{ required: true, message: '安装包类型不能为空', trigger: 'change' }
],
sysApk: [
{ required: true, message: '安装包不能为空', trigger: 'change' }
]
}
}
},
watch: {
$route(to, from) {
if (to) this.getList()
}
},
created() {
created () {
this.getList()
},
methods: {
/** 查询安装包管理（新）列表 */
getList() {
this.loading = false
getList () {
this.loading = true
listINFO(this.queryParams).then(response => {
this.INFOList = response.rows
this.total = response.total
this.loading = false
})
},
// 取消按钮
cancel () {
this.open = false
this.reset()
},
// 表单重置
reset () {
this.form = {
uploadingType: 'OnLineUploading',
sysApkName: undefined,
version: undefined,
sysApk: null,
sysApkSize: undefined,
sysType: '',
appCode: Cookies.get('Admin-Application-appCode')
}
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery() {
handleQuery () {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.create_time = []
resetQuery () {
this.resetForm('queryForm')
this.handleQuery()
},
/** 新增按钮操作 */
handleAdd() {
const query = {
activeTabs: this.activeTabs
}
this.$router.push({
path: '/build/install/add/',
query: query
})
// this.$tab.openPage('新增安装包', '/build/install/add/', params)
},
// 多选框选中数据
handleSelectionChange(selection) {
handleSelectionChange (selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length != 1
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd () {
this.reset()
this.open = true
this.title = '添加安装包管理'
},
/** 修改按钮操作 */
handleUpdate (row) {
this.reset()
const id = row.id || this.ids
getINFO(id).then(response => {
this.form = response.data
this.open = true
this.title = '修改安装包管理'
})
},
/** 详情按钮操作 */
handleDetail (row) {
this.reset()
const id = row.id || this.ids
getINFO(id).then(response => {
this.form = response.data
this.openDetail = true
this.title = '安装包详情'
this.type = 'detail'
})
},
/** 提交按钮 */
submitForm () {
this.$refs['form'].validate(valid => {
if (valid) {
if (this.form.id != null) {
let data = Object.assign({}, this.form)
data.appCode = Cookies.get('Admin-Application-appCode')
delete data.explain
updateINFO(data).then(response => {
this.$modal.msgSuccess('修改成功')
this.open = false
this.getList()
})
} else {
addINFO(this.form).then(response => {
this.$modal.msgSuccess('新增成功')
this.open = false
this.getList()
})
}
}
})
},
/** 删除按钮操作 */
handleDelete(row) {
const configIds = row.id || this.ids
this.$modal.confirm('是否确认删除编号为"' + configIds + '"的数据项？').then(function() {
return delINFO(configIds)
handleDelete (row) {
const ids = row.id || this.ids
this.$modal.confirm('是否确认删除安装包管理编号为"' + ids + '"的数据项？').then(function () {
return delINFO(ids)
}).then(() => {
this.getList()
this.$modal.msgSuccess('删除成功')
}).catch(() => {
})
},
/** 修改按钮操作 */
handleEdit(row) {
const query = {
activeTabs: this.activeTabs,
id: row.id
}
this.$router.push({
path: '/build/install/edit/',
query: query
})
// this.$tab.openPage('编辑安装包', '/build/install/add/', params)
getSize (e) {
this.form.sysApkSize = e[0].size + 'kb'
},
/** 查看详情弹窗 **/
handleDetail(row) {
// /** 导出按钮操作 */
// handleExport() {
// this.download('deploy/INFO/export', {
// ...this.queryParams
// }, `INFO_${new Date().getTime()}.xlsx`)
// },
const params = {
id: row.id
}
this.$tab.openPage('安装包详情', '/build/install/detail/', params)
/**下载安装包*/
handleDownload (row) {
window.open(row.sysApk)
},
/** 切换TAB触发的事件 */
handleClickTabs() {
this.getList()
cancelDetail () {
this.openDetail = false
this.reset()
},
/** 下载按钮 */
handleDownload(row) {
const configIds = row.id || this.ids
this.$modal.confirm('是否确认下载编号为"' + configIds + '"的数据项？').then(function() {
return delConfig(configIds)
}).then(() => {
this.getList()
this.$modal.msgSuccess('下载成功')
}).catch(() => {
})
copyIt (url) {
navigator.clipboard.writeText(url)
this.$message.success('复制成功')
}
}
}

103
sf-ui/src/views/FDS/publishList/components/addPack.vue
View File

@ -1,120 +1,119 @@
<template>
<el-dialog :modal-append-to-body="false" :title="title" v-bind="$attrs" width="700px"
@close="onClose"
@open="onOpen"
v-on="$listeners"
>
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="90px"
size="small"
>
<el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :modal-append-to-body="false" :title="title"
:visible.sync="open" v-bind="$attrs" width="700px" @close="onClose" @open="onOpen" v-on="$listeners">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="90px" size="small">
<el-form-item label="安装包名称" prop="installpackName">
<el-input
v-model="queryParams.installpackName"
clearable
placeholder="请输入安装包名称"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
<el-input v-model="queryParams.sysApkName" clearable placeholder="请输入安装包名称" style="width: 240px"
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-table v-loading="loading" :data="dataList">
<el-table-column align="center" label="安装包名称" prop="configId"/>
<el-table-column :show-overflow-tooltip="true" align="center" label="版本号" prop="configName"/>
<el-table-column :show-overflow-tooltip="true" align="center" label="安装包大小" prop="configName"/>
<el-table-column :show-overflow-tooltip="true" align="center" label="适用系统" prop="configValue"/>
<el-table-column align="center" label="状态" prop="configType">
<template slot-scope="scopeA">
<dict-tag :options="dict.type.sys_yes_no" :value="scopeA.row.type"/>
</template>
</el-table-column>
<el-table v-loading="loading" :data="moduleList">
<el-table-column align="center" label="安装包名称" prop="sysApkName" />
<el-table-column :show-overflow-tooltip="true" align="center" label="版本号" prop="version" />
<el-table-column :show-overflow-tooltip="true" align="center" label="安装包大小" prop="sysApkSize" />
<el-table-column :show-overflow-tooltip="true" align="center" label="适用系统" prop="sysType" />
<!-- <el-table-column align="center" label="状态" prop="uploadingStatus">-->
<!-- <template slot-scope="scopeA">-->
<!-- <dict-tag :options="dict.type.sys_yes_no" :value="scopeA.row.type"/>-->
<!-- </template>-->
<!-- </el-table-column>-->
<el-table-column align="center" class-name="small-padding fixed-width" label="操作" width="50">
<template slot-scope="scope">
<el-button circle icon="el-icon-plus" size="20" type="primary" @click="addPack"
></el-button>
<el-button circle icon="el-icon-plus" size="20" type="primary" @click="addPack(scope.row)"></el-button>
</template>
</el-table-column>
</el-table>
<!-- <div slot="footer" class="dialog-footer">-->
<!-- <el-button type="primary" @click="submitAddForm()">确 定</el-button>-->
<!-- </div>-->
</el-dialog>
</template>
<script>
import { listConfig } from '@/api/system/config'
import { listINFO } from '@/api/FDS/installList'
import Cookies from 'js-cookie'
export default {
name: 'AddPack',
dicts: ['sys_yes_no'],
data() {
props: {
systemType: {
type: String,
default: ''
}
},
data () {
return {
// 遮罩层
title: '添加安装包',
loading: true,
configName: undefined,
form: {},
dataList: [],
moduleList: [],
// 显示搜索条件
showSearch: true,
total: 0,
open: true,
// 白名单配置表单验证
queryParams: {
pageNum: 1,
pageSize: 10,
installpackName: undefined
sysApkName: null,
appCode: Cookies.get('Admin-Application-appCode')
}
}
},
created() {
created () {
this.getList()
},
methods: {
/** 查询参数列表 */
getList() {
getList () {
this.loading = true
listConfig(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
this.dataList = response.rows
listINFO(
{
...this.queryParams,
sysType: this.systemType
}).then(response => {
this.moduleList = response.rows
this.total = response.total
this.loading = false
}
)
})
},
/** 搜索按钮操作 */
handleQuery() {
handleQuery () {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
resetQuery () {
this.dateRange = []
this.resetForm('queryForm')
this.handleQuery()
},
// 确定安装包
submitAddForm() {
},
/** 新增当前包的按钮 */
addPack() {
addPack (row) {
this.$emit('addPack', {
apkId: row.id,
version: row.version,
sysType: row.sysType,
sysApkName: row.sysApkName,
sysApk: row.sysApk
})
},
closeModal() {
closeModal () {
this.$emit('close')
},
onOpen() {
onOpen () {
this.active = this.current
this.key = ''
},
onClose() {
onClose () {
}
}
}

185
sf-ui/src/views/FDS/publishList/index.vue
View File

@ -3,43 +3,21 @@
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="90px" size="small">
<el-form-item label="选择APP" prop="configName">
<el-select v-model="queryParams.configType" clearable placeholder="请选择APP">
<el-option
v-for="dict in dict.type.sys_yes_no"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
<el-option v-for="dict in dict.type.sys_yes_no" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="版本号" prop="version">
<el-input
v-model="queryParams.version"
clearable
placeholder="请输入版本号"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
<el-input v-model="queryParams.version" clearable placeholder="请输入版本号" style="width: 240px"
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="公开时间">
<el-date-picker
v-model="dateRange"
end-placeholder="结束日期"
range-separator="-"
start-placeholder="开始日期"
style="width: 240px"
type="daterange"
value-format="yyyy-MM-dd"
></el-date-picker>
<el-date-picker v-model="dateRange" end-placeholder="结束日期" range-separator="-" start-placeholder="开始日期"
style="width: 240px" type="daterange" value-format="yyyy-MM-dd"></el-date-picker>
</el-form-item>
<el-form-item label="状态" prop="configType">
<el-select v-model="queryParams.configType" clearable placeholder="请选择状态">
<el-option
v-for="dict in dict.type.sys_yes_no"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
<el-option v-for="dict in dict.type.sys_yes_no" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item>
@ -50,66 +28,42 @@
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
v-hasPermi="['system:config:add']"
icon="el-icon-plus"
plain
size="mini"
type="primary"
@click="handleAdd"
>新增
<el-button v-hasPermi="['system:config:add']" icon="el-icon-plus" plain size="mini" type="primary"
@click="handleAdd">新增
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
:disabled="multiple"
icon="el-icon-plus"
plain
size="mini"
type="info"
@click="handlePublish"
>批量发布
<el-button :disabled="multiple" icon="el-icon-plus" plain size="mini" type="info" @click="handlePublish">批量发布
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
v-hasPermi="['system:config:add']"
:disabled="multiple"
icon="el-icon-plus"
plain
size="mini"
type="info"
@click="handleDelete"
>批量删除
<el-button v-hasPermi="['system:config:add']" :disabled="multiple" icon="el-icon-plus" plain size="mini"
type="info" @click="handleDelete">批量删除
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="configList" @selection-change="handleSelectionChange">
<el-table-column align="center" type="selection" width="55"/>
<el-table-column align="center" label="APP" prop="configId"/>
<el-table-column :show-overflow-tooltip="true" align="center" label="文件类型" prop="configName"/>
<el-table-column :show-overflow-tooltip="true" align="center" label="版本号" prop="version"/>
<el-table-column :show-overflow-tooltip="true" align="center" label="子版本号" prop="configValue"/>
<el-table-column
label="系统"
min-width="80"
prop="platform"
>
<template scope="scope">
<el-table-column align="center" type="selection" width="55" />
<el-table-column align="center" label="APP" prop="configId" />
<el-table-column :show-overflow-tooltip="true" align="center" label="文件类型" prop="configName" />
<el-table-column :show-overflow-tooltip="true" align="center" label="版本号" prop="version" />
<el-table-column :show-overflow-tooltip="true" align="center" label="子版本号" prop="configValue" />
<el-table-column label="系统" min-width="80" prop="platform">
<template slot-scope="scope">
<div>{{ scope.row.platform === '0' ? '安卓' : 'IOS' }}</div>
</template>
</el-table-column>
<el-table-column align="center" label="公开版" prop="createTime" width="180">
<template slot-scope="scope">
<el-switch v-model="scope.row.tagsView" class="drawer-switch" disabled/>
<el-switch v-model="scope.row.tagsView" class="drawer-switch" disabled />
</template>
</el-table-column>
<el-table-column align="center" label="强制更新" prop="createTime" width="180">
<template slot-scope="scope">
<el-switch v-model="scope.row.tagsView" class="drawer-switch" disabled/>
<el-switch v-model="scope.row.tagsView" class="drawer-switch" disabled />
</template>
</el-table-column>
@ -118,10 +72,10 @@
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" align="center" label="发布环境" prop="configValue"/>
<el-table-column :show-overflow-tooltip="true" align="center" label="发布环境" prop="configValue" />
<el-table-column align="center" label="发布状态" prop="configType">
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_yes_no" :value="scope.row.configType"/>
<dict-tag :options="dict.type.sys_yes_no" :value="scope.row.configType" />
</template>
</el-table-column>
@ -131,19 +85,11 @@
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" align="center" label="更新说明" prop="remark"/>
<el-table-column
align="center"
label="二维码"
min-width="80"
>
<el-table-column :show-overflow-tooltip="true" align="center" label="更新说明" prop="remark" />
<el-table-column align="center" label="二维码" min-width="80">
<template slot-scope="scope">
<el-image
:preview-src-list="srcList"
:src="url"
style="width: 80px; height: 80px"
>
<el-image :preview-src-list="srcList" :src="url" style="width: 80px; height: 80px">
</el-image>
<!-- <el-popover-->
@ -162,39 +108,21 @@
</el-table-column>
<el-table-column align="center" class-name="small-padding fixed-width" label="操作" width="150">
<template slot-scope="scope">
<el-button
v-hasPermi="['system:config:edit']"
icon="el-icon-bottom"
size="mini"
type="text"
@click="handleDown(scope.row)"
>下架
<el-button v-hasPermi="['system:config:edit']" icon="el-icon-bottom" size="mini" type="text"
@click="handleDown(scope.row)">下架
</el-button>
<el-button
v-hasPermi="['system:config:edit']"
icon="el-icon-edit"
size="mini"
type="text"
@click="handleEdit(scope.row)"
>修改
<el-button v-hasPermi="['system:config:edit']" icon="el-icon-edit" size="mini" type="text"
@click="handleEdit(scope.row)">修改
</el-button>
<el-dropdown size="mini"
@command="(command) => handleCommand(command, scope.row)"
>
<el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)">
<el-button icon="el-icon-d-arrow-right" size="mini" type="text">更多</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item v-hasPermi="['system:user:resetPwd']" command="handleDetail"
icon="el-icon-view"
>详情
<el-dropdown-item v-hasPermi="['system:user:resetPwd']" command="handleDetail" icon="el-icon-view">详情
</el-dropdown-item>
<el-dropdown-item v-hasPermi="['system:user:edit']" command="handleDownload"
icon="el-icon-download"
>下载安装包
<el-dropdown-item v-hasPermi="['system:user:edit']" command="handleDownload" icon="el-icon-download">下载安装包
</el-dropdown-item>
<el-dropdown-item v-hasPermi="['system:user:edit']" command="handleDelete"
icon="el-icon-delete"
>删除
<el-dropdown-item v-hasPermi="['system:user:edit']" command="handleDelete" icon="el-icon-delete">删除
</el-dropdown-item>
</el-dropdown-menu>
@ -203,13 +131,8 @@
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:limit.sync="queryParams.pageSize"
:page.sync="queryParams.pageNum"
:total="total"
@pagination="getList"
/>
<pagination v-show="total > 0" :limit.sync="queryParams.pageSize" :page.sync="queryParams.pageNum" :total="total"
@pagination="getList" />
</div>
</template>
@ -220,7 +143,7 @@ import { delConfig, listConfig } from '@/api/system/config'
export default {
name: 'PublishList',
dicts: ['sys_yes_no'],
data() {
data () {
return {
// 遮罩层
loading: true,
@ -264,56 +187,56 @@ export default {
}
},
computed: {
applicationInfo: function() {
applicationInfo: function () {
return this.$store.state.applicationInfo
}
},
created() {
created () {
this.getList()
},
mounted() {
mounted () {
console.log(this.$store.getters.applicationId)
console.log(this.applicationInfo)
},
methods: {
/** 查询参数列表 */
getList() {
getList () {
this.loading = true
listConfig(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
this.configList = response.rows
this.total = response.total
this.loading = false
}
this.configList = response.rows
this.total = response.total
this.loading = false
}
)
},
/** 搜索按钮操作 */
handleQuery() {
handleQuery () {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
resetQuery () {
this.dateRange = []
this.resetForm('queryForm')
this.handleQuery()
},
/** 新增按钮操作 */
handleAdd() {
handleAdd () {
const params = {
type: 'add'
}
this.$tab.openPage('新增发布', '/build/publishList/add/', params)
},
// 多选框选中数据
handleSelectionChange(selection) {
handleSelectionChange (selection) {
this.ids = selection.map(item => item.configId)
this.single = selection.length != 1
this.multiple = !selection.length
},
/** 删除按钮操作 */
async handleDelete(row) {
async handleDelete (row) {
const configIds = row.configId || this.ids
try {
await this.$modal.confirm('是否确认删除参数编号为"' + configIds + '"的数据项？')
@ -326,25 +249,25 @@ export default {
}
},
/**查看详情*/
handleDetail() {
handleDetail () {
this.$tab.openPage('发布详情', '/build/publishList/detail/', '')
},
/**下载安装包*/
handleDownload() {
handleDownload () {
},
/**********编辑*******/
handleEdit() {
handleEdit () {
const params = {
type: 'edit'
}
this.$tab.openPage('编辑发布', '/build/publishList/add/', params)
},
/** 发布操作*/
handlePublish() {
handlePublish () {
},
// 更多操作触发
handleCommand(command, row) {
handleCommand (command, row) {
switch (command) {
case 'handleDetail':
this.handleDetail(row)

12
sf-ui/src/views/FDS/whiteListManagement/add.vue
View File

@ -8,17 +8,17 @@
<el-main>
<div class="form-main">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-form-item label="白名单名称" prop="whiteListName">
<el-form-item label="白名单名称" prop="whitelistName">
<el-input v-model="form.whiteListName" placeholder="请输入白名单名称"/>
</el-form-item>
<el-form-item label="白名单类型" prop="whiteListType">
<el-form-item label="白名单类型" prop="whitelistType">
<el-select v-model="form.whiteListType" clearable placeholder="请选择白名单类型">
<el-option label="白名单人员" value="0"/>
<el-option label="白名单设备" value="1"/>
</el-select>
</el-form-item>
<el-form-item label="白名单模式" prop="whitePattern">
<el-form-item label="白名单模式" prop="whitelistMode">
<el-select v-model="form.whitePattern" clearable placeholder="请选择白名单模式">
<el-option label="正则模式" value="0"/>
<el-option label="普通模式" value="1"/>
@ -27,7 +27,7 @@
<el-form-item label="备注">
<el-input v-model="form.remark" placeholder="请输入内容" type="textarea"/>
<el-input v-model="form.remarks" placeholder="请输入内容" type="textarea"/>
</el-form-item>
</el-form>
</div>
@ -41,7 +41,7 @@
</template>
<script>
import { addConfig } from '@/api/system/config'
import { addWhitelist } from '@/api/FDS/whiteList'
export default {
name: 'WhiteAdd',
@ -85,7 +85,7 @@ export default {
this.$refs['form'].validate(valid => {
if (valid) {
addConfig(this.form).then(response => {
addWhitelist(this.form).then(response => {
this.$modal.msgSuccess('新增成功')
})
this.$router.push({ path: '/build/whiteListManagement' })

4
sf-ui/src/views/FDS/whiteListManagement/edit.vue
View File

@ -43,7 +43,7 @@
</template>
<script>
import { updateConfig } from '@/api/system/config'
import { updateConfig } from '@/api/FDS/whiteList'
export default {
name: 'WhiteAdd',
@ -84,7 +84,7 @@ export default {
this.$refs['form'].validate(valid => {
if (valid) {
if (this.form.configId != undefined) {
updateConfig(this.form).then(response => {
updateWhitelist(this.form).then(response => {
this.$modal.msgSuccess('修改成功')
})
}

6
sf-ui/src/views/FDS/whiteListManagement/index.vue
View File

@ -168,7 +168,7 @@
</template>
<script>
import { delConfig, getConfig, listConfig } from '@/api/system/config'
import { listWhitelist,delWhitelist} from '@/api/FDS/whiteList'
export default {
name: 'WhiteList',
dicts: ['sys_yes_no'],
@ -222,7 +222,7 @@ export default {
/** 查询参数列表 */
getList() {
this.loading = true
listConfig(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
listWhitelist(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
this.configList = response.rows
this.total = response.total
this.loading = false
@ -288,7 +288,7 @@ export default {
handleDelete(row) {
const configIds = row.configId || this.ids
this.$modal.confirm('是否确认删除编号为"' + configIds + '"的数据项？').then(function() {
return delConfig(configIds)
return delWhitelist(configIds)
}).then(() => {
this.getList()
this.$modal.msgSuccess('删除成功')

134
sf-ui/src/views/deployment/environment/index.vue
View File

@ -1,8 +1,13 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="环境名称" prop="name">
<el-input v-model="queryParams.name" placeholder="请输入环境名称" clearable @keyup.enter.native="handleQuery" />
<el-input
v-model="queryParams.name"
placeholder="请输入环境名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
@ -12,41 +17,87 @@
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['deployment:environment:add']">新增</el-button>
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['deployment:environment:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
v-hasPermi="['deployment:environment:edit']">修改</el-button>
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['deployment:environment:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
v-hasPermi="['deployment:environment:remove']">删除</el-button>
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['deployment:environment:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['deployment:environment:export']"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="environmentList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="主键" align="center" prop="id" />
<el-table-column label="环境名称" align="center" prop="name" />
<el-table-column label="服务器地址" align="center" prop="serverAddress" />
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right">
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['deployment:environment:edit']">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['deployment:environment:remove']">删除</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['deployment:environment:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['deployment:environment:remove']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改环境维护对话框 -->
<el-dialog :title="title" :visible.sync="open" width="550px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="应用id" prop="appId">
<el-input v-model="form.appId" placeholder="请输入应用id" />
</el-form-item>
@ -61,8 +112,8 @@
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
@ -73,7 +124,7 @@ import { listEnvironment, getEnvironment, delEnvironment, addEnvironment, update
export default {
name: "Environment",
data () {
data() {
return {
// 遮罩层
loading: true,
@ -112,12 +163,12 @@ export default {
}
};
},
created () {
created() {
this.getList();
},
methods: {
/** 查询环境维护列表 */
getList () {
getList() {
this.loading = true;
listEnvironment(this.queryParams).then(response => {
this.environmentList = response.rows;
@ -126,12 +177,12 @@ export default {
});
},
// 取消按钮
cancel () {
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset () {
reset() {
this.form = {
id: null,
appId: null,
@ -149,29 +200,29 @@ export default {
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery () {
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery () {
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange (selection) {
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length !== 1
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd () {
handleAdd() {
this.reset();
this.open = true;
this.title = "添加环境维护";
},
/** 修改按钮操作 */
handleUpdate (row) {
handleUpdate(row) {
this.reset();
const id = row.id || this.ids
getEnvironment(id).then(response => {
@ -181,12 +232,12 @@ export default {
});
},
/** 提交按钮 */
submitForm () {
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
let data = Object.assign({}, this.form)
delete data.explain
let data = Object.assign({},this.form)
delete data.explain
updateEnvironment(data).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
@ -203,17 +254,17 @@ export default {
});
},
/** 删除按钮操作 */
handleDelete (row) {
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal.confirm('是否确认删除环境维护编号为"' + ids + '"的数据项？').then(function () {
this.$modal.confirm('是否确认删除环境维护编号为"' + ids + '"的数据项？').then(function() {
return delEnvironment(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => { });
}).catch(() => {});
},
/** 导出按钮操作 */
handleExport () {
handleExport() {
this.download('deployment/environment/export', {
...this.queryParams
}, `environment_${new Date().getTime()}.xlsx`)
@ -221,14 +272,3 @@ export default {
}
};
</script>
<style lang="scss" scoped>
::v-deep .el-dialog .el-form {
.el-input,
.el-select,
.el-textarea {
width: 100%;
}
}
</style>

403
sf-ui/src/views/deployment/install/index.vue
View File

@ -1,403 +0,0 @@
<template>
<div class="app-container">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="" size="small">
<el-form-item label="安装包名称" prop="sysApkName">
<el-input v-model="queryParams.sysApkName" clearable placeholder="请输入安装包名称" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="版本号" prop="version">
<el-input v-model="queryParams.version" clearable placeholder="请输入版本号" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="安装包类型" prop="sysType">
<el-select v-model="queryParams.sysType" clearable placeholder="请选择安装包类型">
<el-option v-for="dict in dict.type.sys_apk_type" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="创建人" prop="created">
<el-input v-model="queryParams.created" clearable placeholder="请输入创建人" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button v-hasPermi="['deployment:install:add']" icon="el-icon-plus" plain size="mini" type="primary"
@click="handleAdd">新增
</el-button>
</el-col>
<el-col :span="1.5">
<el-button v-hasPermi="['deploy:INFO:remove']" :disabled="multiple" icon="el-icon-delete" plain size="mini"
type="danger" @click="handleDelete">批量删除
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="INFOList" @selection-change="handleSelectionChange">
<el-table-column align="center" type="selection" width="55" />
<el-table-column align="center" label="安装包名称" prop="sysApkName" />
<el-table-column align="center" label="版本号" prop="version" />
<el-table-column align="center" label="安装包" prop="sysApk">
<template slot="header" slot-scope="scope">
<span>安装包</span>
<el-popover placement="top-start" width="180" trigger="hover">
<span slot="reference"><i class="el-icon-info ml10"></i></span>
<p class="tip">复制当前的安装包地址</p>
</el-popover>
</template>
<template slot-scope="scope">
<el-button icon="el-icon-copy" type="text" @click="copyIt(scope.row.sysApk)">复制</el-button>
</template>
</el-table-column>
<el-table-column align="center" label="安装包大小" prop="sysApkSize" />
<el-table-column align="center" label="安装包类型" prop="sysType" :filters="dict.type.sys_apk_type.map(item => ({
...item,
text: item.label
}))" :filter-method="filterTagSysType">
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_apk_type" :value="scope.row.sysType" />
</template>
</el-table-column>
<el-table-column align="center" label="创建人" prop="created" />
<el-table-column align="center" class-name="small-padding fixed-width" fixed="right" label="操作">
<template slot-scope="scope">
<el-popover placement="left" width="" trigger="hover">
<div>
<div style="margin-bottom: 10px;color:#000;font-size:14px">操作</div>
<div style="text-align: right; margin: 0">
<el-button @click="handleDownload(scope.row)" size="mini">下载</el-button>
<el-button v-hasPermi="['deployment:install:edit']" plain size="mini"
@click="handleUpdate(scope.row)">修改</el-button>
<el-button v-hasPermi="['deployment:install:detail']" plain size="mini"
@click="handleDetail(scope.row)">详情</el-button>
<el-button v-hasPermi="['deployment:install:remove']" plain type="danger" size="mini"
@click="handleDelete(scope.row)">删除</el-button>
</div>
</div>
<el-button slot="reference" size="mini" type="text">更多<i class="el-icon-caret-right"></i></el-button>
</el-popover>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :limit.sync="queryParams.pageSize" :page.sync="queryParams.pageNum" :total="total"
@pagination="getList" />
<!-- 添加或修改安装包管理（新）对话框 -->
<el-dialog :title="title" :visible.sync="open" append-to-body width="550px">
<el-form ref="form" :model="form" :rules="rules" label-width="100px" labelPosition="left">
<el-form-item label="安装包名称" prop="sysApkName">
<el-input v-model="form.sysApkName" placeholder="请输入安装包名称" />
</el-form-item>
<el-form-item label="版本号" prop="version">
<el-input v-model="form.version" placeholder="请输入版本号" />
</el-form-item>
<el-form-item label="安装包" prop="sysApk">
<file-upload v-model="form.sysApk" :accept="'.zip,.apk,.hap, .iap'" :fileSize="50"
:fileType="['apk', 'hap', 'iap', 'zip']" :limit="1" uploadFileUrl="/system/oss/upload" @getSize="getSize" />
</el-form-item>
<el-form-item label="安装包大小" prop="sysApkSize">
<el-input v-model="form.sysApkSize" placeholder="请输入安装包大小" readonly />
</el-form-item>
<el-form-item label="安装包类型" prop="sysType">
<el-select v-model="form.sysType" placeholder="请选择安装包类型">
<el-option v-for="dict in dict.type.sys_apk_type" :key="dict.value" :label="dict.label"
:value="dict.value"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
</div>
</el-dialog>
<el-dialog :title="title" :visible.sync="openDetail" append-to-body width="550px">
<el-form ref="form" :model="form" label-width="100px" labelPosition="left">
<el-form-item label="安装包名称" prop="moduleName" filters>
{{ form.sysApkName }}
</el-form-item>
<el-form-item label="版本号" prop="version">
{{ form.version }}
</el-form-item>
<el-form-item label="安装包">
<el-input v-model="form.sysApk" class="input-with-select" readonly>
<el-button slot="append" @click="copyIt(form.sysApk)">复制</el-button>
</el-input>
</el-form-item>
<el-form-item label="安装包大小" prop="moduleSize">
{{ form.sysApkSize }}
</el-form-item>
<el-form-item label="系统类型" prop="sysType">
{{ form.sysType }}
</el-form-item>
<el-form-item label="上传时间：">{{ form.createTime }}</el-form-item>
<el-form-item label="上传人员：">{{ form.created }}</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelDetail">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { addINFO, delINFO, getINFO, listINFO, updateINFO } from '@/api/FDS/installList'
export default {
name: 'INFO',
dicts: ['sys_apk_uploading_type', 'uploading_status', 'sys_apk_type'],
data () {
return {
form: {
uploadingType: 'OnLineUploading',
sysApkName: undefined,
version: undefined,
sysApk: null,
sysApkSize: undefined,
sysType: '',
},
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 安装包管理（新）表格数据
INFOList: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
openDetail: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
uploadingType: null,
sysApkName: null,
version: null,
sysType: null,
uploadingStatus: null,
created: null
},
elDropdown: '',
// 表单校验
rules: {
uploadingType: [
{ required: true, message: '上传类型不能为空', trigger: 'change' }
],
sysApkName: [
{ required: true, message: '安装包名称不能为空', trigger: 'blur' }
],
version: [
{ required: true, message: '版本号不能为空', trigger: 'blur' }
],
sysType: [
{ required: true, message: '安装包类型不能为空', trigger: 'change' }
],
sysApk: [
{ required: true, message: '安装包不能为空', trigger: 'change' }
]
}
}
},
created () {
this.getList()
// const dropdownMenu = this.$refs['elDropdown'].$children[0] // 找到dropdown下面的dropdownMenu
// dropdownMenu.$data.currentPlacement = 'start'
// console.log(dropdownMenu.$data)
},
methods: {
/** 查询安装包管理（新）列表 */
getList () {
this.loading = true
listINFO(this.queryParams).then(response => {
this.INFOList = response.rows
this.total = response.total
this.loading = false
})
},
// 取消按钮
cancel () {
this.open = false
this.reset()
},
// 表单重置
reset () {
this.form = {
uploadingType: 'OnLineUploading',
sysApkName: undefined,
version: undefined,
sysApk: null,
sysApkSize: undefined,
sysType: '',
}
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery () {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery () {
this.resetForm('queryForm')
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange (selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd () {
this.reset()
this.open = true
this.title = '添加安装包'
},
/** 修改按钮操作 */
handleUpdate (row) {
this.reset()
const id = row.id || this.ids
getINFO(id).then(response => {
this.form = response.data
this.open = true
this.title = '修改安装包'
})
},
/** 详情按钮操作 */
handleDetail (row) {
this.reset()
const id = row.id || this.ids
getINFO(id).then(response => {
this.form = response.data
this.openDetail = true
this.title = '安装包详情'
this.type = 'detail'
})
},
/** 提交按钮 */
submitForm () {
this.$refs['form'].validate(valid => {
if (valid) {
if (this.form.id != null) {
let data = Object.assign({}, this.form)
delete data.explain
updateINFO(data).then(response => {
this.$modal.msgSuccess('修改成功')
this.open = false
this.getList()
})
} else {
addINFO(this.form).then(response => {
this.$modal.msgSuccess('新增成功')
this.open = false
this.getList()
})
}
}
})
},
/** 删除按钮操作 */
handleDelete (row) {
const ids = row.id || this.ids
this.$modal.confirm('是否确认删除安装包管理编号为"' + ids + '"的数据项？').then(function () {
return delINFO(ids)
}).then(() => {
this.getList()
this.$modal.msgSuccess('删除成功')
}).catch(() => {
})
},
getSize (e) {
if (e && e.length > 0) {
this.form.sysApkSize = (e[0].size / 1024 / 1024).toFixed(2) + 'm'
} else {
this.form.sysApkSize = ''
}
},
/**下载安装包*/
handleDownload (row) {
window.open(row.sysApk)
},
cancelDetail () {
this.openDetail = false
this.reset()
},
copyIt (url) {
navigator.clipboard.writeText(url)
this.$message.success('复制成功')
},
// 筛选处理
filterTagSysType (value, row) {
return row.sysType === Number(value);
},
// 更多操作触发
handleCommand (command, row) {
switch (command) {
case "handleDownload":
this.handleDownload(row);
break;
case "handleUpdate":
this.handleUpdate(row);
break;
case "handleDetail":
this.handleDetail(row);
break;
case "handleDelete":
this.handleDelete(row);
break;
default:
break;
}
},
}
}
</script>
<style lang="scss" scoped>
::v-deep .el-dialog .el-form {
.el-input,
.el-select,
.el-textarea {
width: 100%
}
}
.dropDown {
position: relative;
}
.lang-select-dropdown {
position: absolute;
top: 30px;
left: 0px;
margin: 0px;
padding: 0px;
min-width: max-content;
text-align: center;
}
</style>

221
sf-ui/src/views/deployment/module/index.vue
View File

@ -1,8 +1,8 @@
<template>
<div class="app-container">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="" size="small">
<el-form-item label="模块包名称" prop="moduleName">
<el-input v-model="queryParams.moduleName" clearable placeholder="请输入模块包名称" @keyup.enter.native="handleQuery" />
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="120px" size="small">
<el-form-item label="模块包名称名称" prop="moduleName">
<el-input v-model="queryParams.moduleName" clearable placeholder="请输入模块包名称名称" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="版本号" prop="version">
<el-input v-model="queryParams.version" clearable placeholder="请输入版本号" @keyup.enter.native="handleQuery" />
@ -20,7 +20,7 @@
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button v-hasPermi="['deployment:module:add']" icon="el-icon-plus" size="mini" type="primary"
<el-button v-hasPermi="['deployment:module:add']" icon="el-icon-plus" plain size="mini" type="primary"
@click="handleAdd">新增
</el-button>
</el-col>
@ -34,63 +34,47 @@
type="danger" @click="handleDelete">删除
</el-button>
</el-col>
<el-col :span="1.5">
<el-button v-hasPermi="['deployment:module:export']" icon="el-icon-download" plain size="mini" type="warning"
@click="handleExport">导出
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="moduleList" @selection-change="handleSelectionChange">
<el-table-column align="center" type="selection" width="55" />
<!-- <el-table-column align="center" label="主键" prop="id"/>-->
<el-table-column align="center" label="模块包名称" prop="moduleName" />
<el-table-column align="center" label="版本号" prop="version" />
<el-table-column align="center" label="安装包" prop="moduleUrl">
<template slot="header" slot-scope="scope">
<span>安装包</span>
<el-popover placement="top-start" width="180" trigger="hover">
<span slot="reference"><i class="el-icon-info ml10"></i></span>
<p class="tip">复制当前的H5模块包地址</p>
</el-popover>
</template>
<template slot-scope="scope">
<el-button icon="el-icon-copy" type="text" @click="copyIt(scope.row.moduleUrl)">复制</el-button>
</template>
</el-table-column>
<el-table-column align="center" label="安装包" prop="moduleUrl" />
<el-table-column align="center" label="安装包大小" prop="moduleSize" />
<el-table-column align="center" label="系统类型" prop="sysType" :filters="dict.type.sys_apk_type.map(item => ({
...item,
text: item.label
}))" :filter-method="filterTagSysType">
<el-table-column align="center" label="系统类型" prop="sysType">
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_apk_type" :value="scope.row.sysType" />
</template>
</el-table-column>
<el-table-column align="center" label="模块类型" prop="moduleType" :filters="dict.type.module_type.map(item => ({
...item,
text: item.label
}))" :filter-method="filterTagModuleType">
<el-table-column align="center" label="模块类型" prop="moduleType">
<template slot-scope="scope">
<dict-tag :options="dict.type.module_type" :value="scope.row.moduleType" />
</template>
</el-table-column>
<!-- <el-table-column align="center" label="上传状态" prop="uploadingStatus"/>-->
<el-table-column align="center" class-name="small-padding fixed-width" label="操作" fixed="right">
<el-table-column align="center" class-name="small-padding fixed-width" label="操作">
<template slot-scope="scope">
<el-popover placement="left" width="" trigger="hover">
<div>
<div style="margin-bottom: 10px;color:#000;font-size:14px">操作</div>
<div style="text-align: right; margin: 0">
<el-button @click="handleDownLoad(scope.row)" size="mini">下载</el-button>
<el-button v-hasPermi="['deployment:module:edit']" plain size="mini"
@click="handleUpdate(scope.row)">修改</el-button>
<el-button v-hasPermi="['deployment:module:detail']" plain size="mini"
@click="handleDetail(scope.row)">详情</el-button>
<el-button v-hasPermi="['deployment:module:remove']" plain type="danger" size="mini"
@click="handleDelete(scope.row)">删除</el-button>
</div>
</div>
<el-button slot="reference" size="mini" type="text">更多<i class="el-icon-caret-right"></i></el-button>
</el-popover>
<el-button icon="el-icon-download" size="mini" type="text" @click="handleDownLoad(scope.row)">下载安装包
</el-button>
<el-button v-hasPermi="['deployment:module:edit']" icon="el-icon-edit" size="mini" type="text"
@click="handleUpdate(scope.row)">修改
</el-button>
<el-button icon="el-icon-detail" size="mini" type="text" @click="handleDetail(scope.row)">详情
</el-button>
<el-button v-hasPermi="['deployment:module:remove']" icon="el-icon-delete" size="mini" type="text"
@click="handleDelete(scope.row)">删除
</el-button>
</template>
</el-table-column>
</el-table>
@ -99,20 +83,17 @@
@pagination="getList" />
<!-- 添加或修改H5模块包对话框 -->
<el-dialog :title="title" :visible.sync="open" append-to-body width="550px">
<el-form ref="form" :model="form" :rules="rules" label-width="100px" labelPosition="left">
<el-form-item label="模块包名称" prop="moduleName">
<el-input v-model="form.moduleName" placeholder="请输入模块包名称" />
<el-dialog :title="title" :visible.sync="open" append-to-body width="500px">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-form-item label="模块包名称名称" prop="moduleName">
<el-input v-model="form.moduleName" placeholder="请输入模块包名称名称" />
</el-form-item>
<el-form-item label="版本号" prop="version">
<el-input v-model="form.version" placeholder="请输入版本号" />
</el-form-item>
<el-form-item label="安装包" prop="moduleUrl">
<file-upload v-model="form.moduleUrl" :accept="'.zip'" :fileSize="20" :fileType="['zip']" :limit="1"
<file-upload v-model="form.moduleUrl" :accept="['.zip']" :fileSize="20" :fileType="['zip']" :limit="1"
@getSize="getSize" />
</el-form-item>
<el-form-item label="安装包大小" prop="moduleSize">
@ -132,38 +113,74 @@
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<!-- 添加或修改H5模块包对话框 -->
<el-dialog :title="title" :visible.sync="openDetail" append-to-body width="550px">
<el-form ref="form" :model="form" label-width="100px" labelPosition="left">
<el-form-item label="模块包名称" prop="moduleName">
<el-dialog :title="title" :visible.sync="openDetail" append-to-body width="500px">
<el-form ref="form" :model="form" label-width="120px">
<el-form-item label="模块包名称名称" prop="moduleName">
{{ form.moduleName }}
</el-form-item>
<el-form-item label="版本号" prop="version">
{{ form.version }}
</el-form-item>
<el-form-item label="安装包" prop="moduleUrl">
<el-input v-model="form.moduleUrl" class="input-with-select" readonly>
<el-button slot="append" @click="copyIt(form.moduleUrl)">复制</el-button>
</el-input>
{{ form.moduleUrl }}
<!-- <file-upload v-model="form.moduleUrl" :fileSize="20" :fileType="['apk','hap','iap']"-->
<!-- :limit="1"-->
<!-- uploadFileUrl="/system/oss/upload"-->
<!-- @getSize="getSize"-->
<!-- />-->
</el-form-item>
<el-form-item label="安装包大小" prop="moduleSize">
{{ form.moduleSize }}
<!-- <el-input v-model="form.moduleSize" placeholder="请输入安装包大小"/>-->
</el-form-item>
<el-form-item label="系统类型" prop="sysType">
{{ form.sysType }}
<!-- <el-select v-model="form.sysType" placeholder="请选择系统类型">-->
<!-- <el-option-->
<!-- v-for="dict in dict.type.sys_apk_type"-->
<!-- :key="dict.value"-->
<!-- :label="dict.label"-->
<!-- :value="dict.value"-->
<!-- ></el-option>-->
<!-- </el-select>-->
</el-form-item>
<el-form-item label="模块类型" prop="moduleType">
<dict-tag :options="dict.type.module_type" :value="form.moduleType" />
<!-- {{ form.moduleType }}-->
<!-- <el-select v-model="form.moduleType" placeholder="请选择模块类型">-->
<!-- <el-option-->
<!-- v-for="dict in dict.type.module_type"-->
<!-- :key="dict.value"-->
<!-- :label="dict.label"-->
<!-- :value="dict.value"-->
<!-- ></el-option>-->
<!-- </el-select>-->
</el-form-item>
<el-form-item label="下载地址：">
<el-input v-model="form.moduleUrl" class="input-with-select" readonly>
<el-button slot="append" @click="copyIt(form.moduleUrl)">复制</el-button>
</el-input>
</el-form-item>
<el-form-item label="上传时间：">{{ form.createTime }}</el-form-item>
<!-- <el-form-item label="上传状态：">-->
<!-- <dict-tag :options="dict.type.uploading_status" :value="form.uploadingStatus"/>-->
<!-- </el-form-item>-->
<el-form-item label="上传人员：">{{ form.created }}</el-form-item>
<!-- <el-form-item label="上传日志："></el-form-item>-->
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelDetail">取 消</el-button>
@ -175,6 +192,8 @@
<script>
import { addModule, delModule, getModule, listModule, updateModule } from '@/api/deployment/module'
import Cookies from 'js-cookie'
export default {
name: 'Module',
dicts: ['module_type', 'sys_apk_type', 'uploading_status'],
@ -213,7 +232,7 @@ export default {
// 表单校验
rules: {
moduleName: [
{ required: true, message: '模块包名称不能为空', trigger: 'blur' }
{ required: true, message: '模块包名称名称不能为空', trigger: 'blur' }
],
version: [
{ required: true, message: '版本号不能为空', trigger: 'blur' }
@ -224,39 +243,14 @@ export default {
moduleType: [
{ required: true, message: '模块类型不能为空', trigger: 'change' }
],
moduleUrl: [
{ required: true, message: '模块包不能为空', trigger: 'change' }
uploadingStatus: [
{ required: true, message: '上传状态不能为空', trigger: 'change' }
]
// uploadingStatus: [
// { required: true, message: '上传状态不能为空', trigger: 'change' }
// ]
}
}
},
created () {
this.getList()
console.log(this.dict.type.module_type)
let arr = [{
label: "通用",
value: "universal",
}]
arr = arr.map(item => ({
...item,
text: item.label
}))
console.log(arr);
// console.log(this.dict.type.module_type.map(d => d.value))
// arr = this.dict.type.module_type.map(item => {
// item.text = item.label
// })
// console.log(arr);
},
methods: {
/** 查询H5模块包列表 */
@ -300,6 +294,7 @@ export default {
modified: null,
createTime: null,
updateTime: null,
appCode: Cookies.get('Admin-Application-appCode')
}
this.resetForm('form')
},
@ -354,6 +349,7 @@ export default {
if (valid) {
if (this.form.id != null) {
let data = Object.assign({}, this.form)
data.appCode = Cookies.get('Admin-Application-appCode')
delete data.explain
updateModule(data).then(response => {
this.$modal.msgSuccess('修改成功')
@ -388,62 +384,19 @@ export default {
}, `module_${new Date().getTime()}.xlsx`)
},
getSize (e) {
if (e && e.length > 0) {
this.form.moduleSize = (e[0].size / 1024 / 1024).toFixed(2) + 'm'
} else {
this.form.moduleSize = ''
}
console.log(e)
console.log(this.form)
this.form.moduleSize = e[0].size + 'kb'
},
filterTagModuleType (value, row) {
return row.moduleType === Number(value);
},
filterTagSysType (value, row) {
return row.sysType === Number(value);
},
handleDownLoad (row) {
window.open(row.moduleUrl)
},
copyIt (url) {
navigator.clipboard.writeText(url)
this.$message.success('复制成功')
},
handleCommand (command, row) {
switch (command) {
case "handleDownload":
this.handleDownload(row);
break;
case "handleUpdate":
this.handleUpdate(row);
break;
case "handleDetail":
this.handleDetail(row);
break;
case "handleDelete":
this.handleDelete(row);
break;
default:
break;
}
},
}
}
}
</script>
<style lang="scss" scoped>
::v-deep .el-dialog .el-form {
.el-input,
.el-select,
.el-textarea {
width: 100%
}
}
</style>

381
sf-ui/src/views/deployment/publish/add.vue
View File

@ -1,381 +0,0 @@
<template>
<div class="app-container">
<el-container>
<!-- <el-header>
<div>新增发布</div>
<el-divider />
</el-header> -->
<el-main>
<div class="form-main">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<el-col :span="12">
<el-form-item label="APP名称" prop="versionDesc">
<el-input v-model="form.appName" disabled />
</el-form-item>
</el-col>
<el-col :span="12"> <el-form-item label="选择系统" prop="systemType">
<el-select v-model="form.systemType" placeholder="请选择系统类型" @change="changeSys">
<el-option v-for="dict in dict.type.sys_apk_type" :key="dict.value" :label="dict.label"
:value="dict.value"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12"> <el-form-item v-if="form.systemType != 'IOS'" label="安装包" prop="sysApkName">
<el-input v-model="form.sysApkName" class="input-with-select" placeholder="请选择包" readonly>
<el-button slot="append" icon="el-icon-search" @click="handlePackOpen"></el-button>
</el-input>
</el-form-item>
<el-form-item v-if="form.systemType == 'ios'" label="app store地址" prop="appStoreAddress">
<el-input v-model="form.appStoreAddress" placeholder="请输入app store地址" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="版本号" prop="version">
<el-input v-model="form.version" placeholder="请输入版本号" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="版本说明" prop="versionDesc">
<el-input v-model="form.versionDesc" placeholder="请输入版本说明" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="有效期" prop="validityStartTime">
<el-date-picker v-model="daterangeDate" style="width: 400px" value-format="yyyy-MM-dd" type="daterange"
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="发布环境" prop="publishEnvironment">
<el-select v-model="form.publishEnvironment">
<el-option v-for="dict in environmentList" :key="dict.value" :label="dict.name"
:value="parseInt(dict.id)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="发布策略" prop="publishStrategy">
<el-select v-model="form.publishStrategy">
<el-option v-for="dict in dict.type.release_strategy" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="结果通知" prop="resultNotify">
<el-switch v-model="form.resultNotify" :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="公开版" prop="publicVersion">
<el-switch v-model="form.publicVersion" :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="强制更新" prop="forceUpdate">
<el-switch v-model="form.forceUpdate" :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="下载验证" prop="downloadVerification">
<el-switch v-model="form.downloadVerification" :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="更新对象" prop="updateObject">
<el-select v-model="form.updateObject">
<el-option v-for="dict in dict.type.release_user_type" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
<!-- <el-button v-if="form.updateObject === 0" circle icon="el-icon-plus" size="16" type="primary"
@click="whiteOpen = true"></el-button> -->
</el-form-item>
<!-- <div v-if="form.updateObject === 0" class="area-box">
<el-tag v-for="tag in WhiteArr" type="info" :key="tag.sysApkName" @close="handleDeleteTag(tag.apkId)"
closable>
{{ tag.sysApkName }}
</el-tag>
</div> -->
</el-col>
<el-col :span="12">
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注" />
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</el-main>
<!--安装包弹窗-->
</el-container>
<div slot="footer" class="footer">
<el-button @click="cancel">取 消</el-button>
<el-button v-if="form.status != 2" type="primary" @click="pubLishForm">发 布
</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
</div>
<AddPack :systemType="form.systemType" v-if="packOpen" @close="closeAddPack" @addPack="handleAddPack"></AddPack>
<AddWhite :systemType="form.systemType" v-if="whiteOpen" @close="closeAddWhite" @addWhiteList="handleAddWhite">
</AddWhite>
</div>
</template>
<script>
import AddPack from './component/addPack.vue'
import AddWhite from './component/addWhite.vue'
import {
addPublish,
} from '@/api/deployment/publish'
import { listEnvironment } from '@/api/deployment/environment'
import { getApplicationName } from '@/utils/application'
export default {
name: 'PublishAdd',
dicts: ['release_strategy', 'release_user_type', 'sys_apk_type'],
components: {
AddPack, AddWhite
},
data () {
return {
// 总条数
form: {
appName: getApplicationName(),
},
packOpen: false,
whiteOpen: false,
environmentList: [],
// 遮罩层
loading: true,
dataList: [],
queryParamsEnvironment: {
pageNum: 1,
pageSize: 999
},
daterangeDate: '',
WhiteArr: [],
// 表单校验
rules: {
appName: [
{ required: true, message: '应用名称不能为空', trigger: 'blur' }
],
systemType: [
{ required: true, message: '系统类型不能为空', trigger: 'change' }
],
apkId: [
{ required: true, message: '安装包编号不能为空', trigger: 'blur' }
],
version: [
{ required: true, message: '版本号不能为空', trigger: 'blur' }
],
publishEnvironment: [
{ required: true, message: '发布环境不能为空', trigger: 'change' }
],
publishStrategy: [
{ required: true, message: '发布策略不能为空', trigger: 'change' }
],
publicVersion: [
{ required: true, message: '公开版不能为空', trigger: 'change' }
],
forceUpdate: [
{ required: true, message: '强制更新不能为空', trigger: 'change' }
],
sysApkName: [
{ required: true, message: '安装包不能为空', trigger: 'blur' }
]
}
}
},
computed: {},
mounted () {
this.getEnvironmentList()
this.reset();
},
methods: {
reset () {
this.form = {
appName: getApplicationName(),
}
},
/** 弹出包选择框*/
handlePackOpen () {
this.packOpen = true
},
/** 查询环境维护列表 */
getEnvironmentList () {
listEnvironment(this.queryParamsEnvironment).then(response => {
this.environmentList = response.rows
})
},
handleAddPack (e) {
this.form.apkId = e.apkId
this.form.version = e.version
this.form.systemType = e.sysType
this.form.sysApkName = e.sysApkName
this.form.apkUrl = e.sysApk
this.packOpen = false
},
handleAddWhite (e) {
if (e) {
this.WhiteArr.push(e)
}
},
/** 提交按钮 */
submitForm () {
this.$refs['form'].validate(valid => {
if (valid) {
let data = Object.assign({}, this.form)
delete data.explain
this.form.validityStartTime = this.daterangeDate[0]
this.form.validityEndTime = this.daterangeDate[1]
addPublish(this.form).then(response => {
this.$modal.msgSuccess('新增成功')
this.loading = false
this.open = false
this.close()
this.$router.push({ path: '/build/publish' })
})
}
})
},
// 选择系统做一些逻辑判断
changeSys () {
// this.form.systemType = sysType
this.form.apkId = null
this.form.version = null
this.form.sysApkName = null
this.form.appStoreAddress = null
this.form.apkUrl = null
},
// 发布按钮
pubLishForm () {
this.$refs['form'].validate(valid => {
if (valid) {
let data = Object.assign({}, this.form)
delete data.explain
addPublish(this.form).then(response => {
this.$modal.msgSuccess('新增成功')
this.loading = false
this.open = false
this.close()
this.$router.push({ path: '/build/publish' })
})
}
})
},
closeAddPack () {
this.packOpen = false
},
closeAddWhite () {
this.whiteOpen = false
},
cancel () {
this.close()
this.$router.push({ path: '/build/publish' })
},
handleDeleteTag (e) {
for (var i in this.WhiteArr) {
if (this.WhiteArr[i].apkId == e) {
this.WhiteArr.splice(i, 1);
break; // 删除后退出循环
}
}
},
close () {
this.$tab.closePage();
},
}
}
</script>
<style lang="scss" scoped>
.app-container {
background: #ffffff;
// margin: 24px;
position: relative;
height: 100%;
}
.form-main {
margin: 0 auto;
}
::v-deep .el-input.is-disabled .el-input__inner,
.el-textarea.is-disabled .el-textarea__inner {
border: 1px solid #E4E7ED !important;
}
.tag-group {
.el-tag {
cursor: pointer;
}
}
.el-tag+.el-tag {
margin-left: 10px
}
::v-deep .el-input {
max-width: 400px;
}
.footer {
display: flex;
align-items: center;
justify-content: flex-end;
position: absolute;
bottom: 24px;
right: 80px
}
.area-box {
max-width: 400px;
min-height: 100px;
padding: 10px;
box-sizing: border-box;
border: 1px solid #DCDFE6;
border-radius: 4px;
overflow-y: auto;
}
::v-deep .el-input,
.el-select {
max-width: 400px;
width: 400px;
}
</style>

119
sf-ui/src/views/deployment/publish/component/addPack.vue
View File

@ -1,119 +0,0 @@
<template>
<el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :modal-append-to-body="false" :title="title"
:visible.sync="open" v-bind="$attrs" width="700px" @close="onClose" @open="onOpen" attrs v-on="$listeners">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="90px" size="small">
<el-form-item label="安装包名称" prop="installpackName">
<el-input v-model="queryParams.sysApkName" clearable placeholder="请输入安装包名称" style="width: 240px"
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-table v-loading="loading" :data="moduleList">
<el-table-column align="center" label="安装包名称" prop="sysApkName" />
<el-table-column :show-overflow-tooltip="true" align="center" label="版本号" prop="version" />
<el-table-column :show-overflow-tooltip="true" align="center" label="安装包大小" prop="sysApkSize" />
<el-table-column :show-overflow-tooltip="true" align="center" label="适用系统" prop="sysType" />
<el-table-column align="center" class-name="small-padding fixed-width" label="操作" width="50">
<template slot-scope="scope">
<el-button circle icon="el-icon-plus" size="20" type="primary" @click="addPack(scope.row)"></el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :limit.sync="queryParams.pageSize" :page.sync="queryParams.pageNum" :total="total"
@pagination="getList" />
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
</div>
</el-dialog>
</template>
<script>
import { listINFO } from '@/api/FDS/installList'
export default {
name: 'AddPack',
dicts: ['sys_yes_no'],
props: {
systemType: {
type: String,
default: ''
}
},
data () {
return {
// 遮罩层
title: '筛选安装包',
loading: true,
configName: undefined,
form: {},
moduleList: [],
// 显示搜索条件
showSearch: true,
total: 0,
open: true,
// 白名单配置表单验证
queryParams: {
pageNum: 1,
pageSize: 10,
sysApkName: null,
}
}
},
created () {
this.getList()
},
methods: {
/** 查询参数列表 */
getList () {
this.loading = true
listINFO(
{
...this.queryParams,
sysType: this.systemType
}).then(response => {
this.moduleList = response.rows
this.total = response.total
this.loading = false
})
},
/** 搜索按钮操作 */
handleQuery () {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery () {
this.dateRange = []
this.resetForm('queryForm')
this.handleQuery()
},
/** 新增当前包的按钮 */
addPack (row) {
this.$emit('addPack', {
apkId: row.id,
version: row.version,
sysType: row.sysType,
sysApkName: row.sysApkName,
sysApk: row.sysApk
})
},
closeModal () {
this.$emit('close')
},
onOpen () {
this.active = this.current
this.key = ''
},
cancel () {
}
}
}
</script>

119
sf-ui/src/views/deployment/publish/component/addWhite.vue
View File

@ -1,119 +0,0 @@
<template>
<el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :modal-append-to-body="false" :title="title"
:visible.sync="open" v-bind="$attrs" width="700px" @close="onClose" @open="onOpen" attrs v-on="$listeners">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="90px" size="small">
<el-form-item label="安装包名称" prop="installpackName">
<el-input v-model="queryParams.sysApkName" clearable placeholder="请输入安装包名称" style="width: 240px"
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-table v-loading="loading" :data="moduleList">
<el-table-column align="center" label="安装包名称" prop="sysApkName" />
<el-table-column :show-overflow-tooltip="true" align="center" label="版本号" prop="version" />
<el-table-column :show-overflow-tooltip="true" align="center" label="安装包大小" prop="sysApkSize" />
<el-table-column :show-overflow-tooltip="true" align="center" label="适用系统" prop="sysType" />
<!-- <el-table-column align="center" label="状态" prop="uploadingStatus">-->
<!-- <template slot-scope="scopeA">-->
<!-- <dict-tag :options="dict.type.sys_yes_no" :value="scopeA.row.type"/>-->
<!-- </template>-->
<!-- </el-table-column>-->
<el-table-column align="center" class-name="small-padding fixed-width" label="操作" width="50">
<template slot-scope="scope">
<el-button circle icon="el-icon-plus" size="20" type="primary" @click="addPack(scope.row)"></el-button>
</template>
</el-table-column>
</el-table>
</el-dialog>
</template>
<script>
import { listINFO } from '@/api/FDS/installList'
import Cookies from 'js-cookie'
export default {
name: 'AddPack',
dicts: ['sys_yes_no'],
props: {
systemType: {
type: String,
default: ''
}
},
data () {
return {
// 遮罩层
title: '筛选白名单',
loading: true,
configName: undefined,
form: {},
moduleList: [],
// 显示搜索条件
showSearch: true,
total: 0,
open: true,
// 白名单配置表单验证
queryParams: {
pageNum: 1,
pageSize: 10,
sysApkName: null,
}
}
},
created () {
this.getList()
},
methods: {
/** 查询参数列表 */
getList () {
this.loading = true
listINFO(
{
...this.queryParams,
sysType: this.systemType
}).then(response => {
this.moduleList = response.rows
this.total = response.total
this.loading = false
})
},
/** 搜索按钮操作 */
handleQuery () {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery () {
this.dateRange = []
this.resetForm('queryForm')
this.handleQuery()
},
/** 新增当前包的按钮 */
addPack (row) {
this.$emit('addWhiteList', {
apkId: row.id,
version: row.version,
sysType: row.sysType,
sysApkName: row.sysApkName,
sysApk: row.sysApk
})
},
closeModal () {
this.$emit('close')
},
onOpen () {
this.active = this.current
this.key = ''
},
onClose () {
}
}
}
</script>

289
sf-ui/src/views/deployment/publish/detail.vue
View File

@ -1,289 +0,0 @@
<template>
<div class="app-container">
<el-container>
<el-main>
<div class="form-main">
<el-form ref="form" :model="form" label-width="120px">
<el-row>
<el-col :span="12">
<el-form-item label="APP名称" prop="versionDesc">
{{ form.appName }}
</el-form-item>
</el-col>
<el-col :span="12"> <el-form-item label="选择系统" prop="systemType">
{{ form.systemType }}
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item v-if="form.systemType != 'ios'" label="安装包" prop="sysApkName">
{{ form.sysApkName }}
</el-form-item>
<el-form-item v-if="form.systemType == 'ios'" label="app store地址" prop="appStoreAddress">
{{ form.appStoreAddress }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="版本号" prop="version">
{{ form.version }}
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="版本说明" prop="versionDesc">
{{ form.versionDesc }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="有效期" prop="validityStartTime">
{{ form.validityStartTime }}至{{ form.validityEndTime }}
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="发布环境" prop="publishEnvironment">
<el-select v-model="form.publishEnvironment" disabled>
<el-option v-for="dict in environmentList" :key="dict.value" :label="dict.name"
:value="parseInt(dict.id)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="发布策略" prop="publishStrategy">
<el-select v-model="form.publishStrategy" disabled>
<el-option v-for="dict in dict.type.release_strategy" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="结果通知" prop="resultNotify">
<el-switch v-model="form.resultNotify" disabled :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="公开版" prop="publicVersion">
<el-switch v-model="form.publicVersion" disabled :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="强制更新" prop="forceUpdate">
<el-switch v-model="form.forceUpdate" disabled :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="下载验证" prop="downloadVerification">
<el-switch v-model="form.downloadVerification" disabled :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="更新对象" prop="updateObject">
<el-select v-model="form.updateObject" disabled>
<el-option v-for="dict in dict.type.release_user_type" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="备注" prop="remark">
{{ form.remark }}
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="下载地址" prop="apkUrl">
<el-input v-model="form.apkUrl" class="input-with-select" readonly>
<el-button slot="append" @click="copyIt(form.apkUrl)">复制</el-button>
</el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="发布状态" prop="status">
<span v-for="item in dict.type.release_status">
<el-tag v-if="item.value == form.status" :type="item.listClass">{{ item.label }}</el-tag>
</span>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="创建人" prop="created">
{{ form.created }}
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="发布时间" prop="validityStartTime">
{{ form.validityStartTime }}
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</el-main>
</el-container>
<div slot="footer" class="footer">
<el-button @click="cancel">取 消</el-button>
</div>
</div>
</template>
<script>
import { listEnvironment } from '@/api/deployment/environment'
import { getApplicationName } from '@/utils/application'
import { getINFO } from '@/api/FDS/installList'
import {
getPublish,
} from '@/api/deployment/publish'
export default {
name: 'publishDetail',
dicts: ['release_environment', 'sys_yes_no', 'release_strategy', 'release_user_type', 'release_status'],
data () {
return {
form: {
},
total: 0,
packOpen: false,
environmentList: [],
// 遮罩层
loading: true,
dataList: [],
// 白名单配置表单验证
queryParams: {
pageNum: 1,
pageSize: 10,
sysApkName: null,
},
queryParamsEnvironment: {
pageNum: 1,
pageSize: 999
},
}
},
mounted () {
if (this.$route.query.id) {
this.getPublishById(this.$route.query.id)
}
this.getEnvironmentList()
},
methods: {
getPublishById (id) {
this.loading = true
getPublish(id).then(response => {
this.form = response.data;
this.form.sysApkName = this.getINFOById();
this.form.appName = getApplicationName();
this.loading = false
})
},
/** 查询环境维护列表 */
getEnvironmentList () {
listEnvironment(this.queryParamsEnvironment).then(response => {
this.environmentList = response.rows
})
},
/** 根据apkId查询安装包 */
getINFOById () {
getINFO(this.form.apkId).then(res => {
console.log(res.data.sysApkName)
return res.data.sysApkName
})
},
/** 查询环境维护列表 */
getEnvironmentList () {
this.loading = true
listEnvironment(this.queryParamsEnvironment).then(response => {
this.environmentList = response.rows
})
},
cancel () {
this.close()
this.$router.push({ path: '/build/publish' })
},
copyIt (url) {
navigator.clipboard.writeText(url)
this.$message.success('复制成功')
},
close () {
this.$tab.closePage();
},
},
}
</script>
<style lang="scss" scoped>
.app-container {
background: #ffffff;
// margin: 24px;
position: relative;
height: 100%;
}
.form-main {
margin: 0 auto;
}
::v-deep .el-input.is-disabled .el-input__inner,
.el-textarea.is-disabled .el-textarea__inner {
border: 1px solid #E4E7ED !important;
}
.tag-group {
.el-tag {
cursor: pointer;
}
}
.el-tag+.el-tag {
margin-left: 10px
}
.footer {
display: flex;
align-items: center;
justify-content: flex-end;
position: absolute;
bottom: 24px;
right: 80px
}
.area-box {
max-width: 400px;
min-height: 100px;
padding: 10px;
box-sizing: border-box;
border: 1px solid #DCDFE6;
border-radius: 4px;
overflow-y: auto;
}
::v-deep .el-input {
max-width: 400px;
}
::v-deep .el-input,
.el-select {
max-width: 400px;
width: 400px;
}
</style>

407
sf-ui/src/views/deployment/publish/edit.vue
View File

@ -1,407 +0,0 @@
<template>
<div class="app-container">
<el-container>
<!-- <el-header>
<div>编辑发布</div>
<el-divider />
</el-header> -->
<el-main v-loading="loading">
<div class="form-main">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<el-col :span="12">
<el-form-item label="APP名称" prop="versionDesc">
<el-input v-model="form.appName" disabled />
</el-form-item>
</el-col>
<el-col :span="12"> <el-form-item label="选择系统" prop="systemType">
<el-select v-model="form.systemType" placeholder="请选择系统类型" @change="changeSys">
<el-option v-for="dict in dict.type.sys_apk_type" :key="dict.value" :label="dict.label"
:value="dict.value"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12"> <el-form-item v-if="form.systemType != 'IOS'" label="安装包" prop="sysApkName">
<el-input v-model="form.sysApkName" class="input-with-select" placeholder="请选择包" readonly>
<el-button slot="append" icon="el-icon-search" @click="handlePackOpen"></el-button>
</el-input>
</el-form-item>
<el-form-item v-if="form.systemType == 'ios'" label="app store地址" prop="appStoreAddress">
<el-input v-model="form.appStoreAddress" placeholder="请输入app store地址" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="版本号" prop="version">
<el-input v-model="form.version" placeholder="请输入版本号" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="版本说明" prop="versionDesc">
<el-input v-model="form.versionDesc" placeholder="请输入版本说明" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="有效期" prop="validityStartTime">
<el-date-picker v-model="daterangeDate" style="width: 400px" value-format="yyyy-MM-dd" type="daterange"
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="发布环境" prop="publishEnvironment">
<el-select v-model="form.publishEnvironment">
<el-option v-for="dict in environmentList" :key="dict.value" :label="dict.name"
:value="parseInt(dict.id)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="发布策略" prop="publishStrategy">
<el-select v-model="form.publishStrategy">
<el-option v-for="dict in dict.type.release_strategy" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="结果通知" prop="resultNotify">
<el-switch v-model="form.resultNotify" :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="公开版" prop="publicVersion">
<el-switch v-model="form.publicVersion" :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="强制更新" prop="forceUpdate">
<el-switch v-model="form.forceUpdate" :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="下载验证" prop="downloadVerification">
<el-switch v-model="form.downloadVerification" :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="更新对象" prop="updateObject">
<el-select v-model="form.updateObject">
<el-option v-for="dict in dict.type.release_user_type" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
<!-- <el-button v-if="form.updateObject === 0" circle icon="el-icon-plus" size="16" type="primary"
@click="whiteOpen = true"></el-button> -->
</el-form-item>
<!-- <div v-if="form.updateObject === 0" class="area-box">
<el-tag v-for="tag in WhiteArr" type="info" :key="tag.sysApkName" @close="handleDeleteTag(tag.apkId)"
closable>
{{ tag.sysApkName }}
</el-tag>
</div> -->
</el-col>
<el-col :span="12">
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注" />
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</el-main>
<!--安装包弹窗-->
</el-container>
<div class="footer">
<el-button @click="cancel">取 消</el-button>
<el-button v-if="form.status != 2" type="primary" @click="pubLishForm">发 布
</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
</div>
<AddPack :systemType="form.systemType" v-if="packOpen" @close="closeAddPack" @addPack="handleAddPack"></AddPack>
<AddWhite :systemType="form.systemType" v-if="whiteOpen" @close="closeAddWhite" @addWhiteList="handleAddWhite">
</AddWhite>
</div>
</template>
<script>
import AddPack from './component/addPack.vue'
import AddWhite from './component/addWhite.vue'
import {
addPublish,
getPublish,
updatePublish,
publish
} from '@/api/deployment/publish'
import { listEnvironment } from '@/api/deployment/environment'
import { getApplicationName } from '@/utils/application'
import { getINFO } from '@/api/FDS/installList'
export default {
name: 'PublishEdit',
dicts: ['release_strategy', 'release_user_type', 'sys_apk_type'],
components: {
AddPack, AddWhite
},
data () {
return {
// 总条数
form: {
sysApkName: ''
},
total: 0,
packOpen: false,
whiteOpen: false,
environmentList: [],
// 遮罩层
loading: true,
dataList: [],
queryParamsEnvironment: {
pageNum: 1,
pageSize: 999
},
daterangeDate: '',
WhiteArr: [],
queryParams: {
pageNum: 1,
pageSize: 10,
sysApkName: null,
},
// 表单校验
rules: {
appName: [
{ required: true, message: '应用名称不能为空', trigger: 'blur' }
],
systemType: [
{ required: true, message: '系统类型不能为空', trigger: 'change' }
],
apkId: [
{ required: true, message: '安装包编号不能为空', trigger: 'blur' }
],
version: [
{ required: true, message: '版本号不能为空', trigger: 'blur' }
],
publishEnvironment: [
{ required: true, message: '发布环境不能为空', trigger: 'change' }
],
publishStrategy: [
{ required: true, message: '发布策略不能为空', trigger: 'change' }
],
publicVersion: [
{ required: true, message: '公开版不能为空', trigger: 'change' }
],
forceUpdate: [
{ required: true, message: '强制更新不能为空', trigger: 'change' }
],
sysApkName: [
{ required: true, message: '安装包不能为空', trigger: 'blur' }
]
}
}
},
computed: {},
mounted () {
if (this.$route.query.id) {
this.getPublishById(this.$route.query.id)
}
this.getEnvironmentList()
},
methods: {
getPublishById (id) {
this.loading = true
getPublish(id).then(response => {
this.form = response.data
this.form.appName = getApplicationName();
this.daterangeDate = [this.form.validityStartTime, this.form.validityEndTime]
this.$nextTick(() => {
this.getINFOById();
this.loading = false
})
})
},
getINFOById () {
getINFO(this.form.apkId).then(res => {
this.form.sysApkName = res.data.sysApkName
})
},
/** 弹出包选择框*/
handlePackOpen () {
this.packOpen = true
},
/** 查询环境维护列表 */
getEnvironmentList () {
listEnvironment(this.queryParamsEnvironment).then(response => {
this.environmentList = response.rows
})
},
handleAddPack (e) {
this.form.apkId = e.apkId
this.form.version = e.version
this.form.systemType = e.sysType
this.form.sysApkName = e.sysApkName
this.form.apkUrl = e.sysApk
this.packOpen = false
},
/** 提交按钮 */
submitForm () {
this.$refs['form'].validate(valid => {
if (valid) {
let data = Object.assign({}, this.form)
delete data.explain
this.form.validityStartTime = this.daterangeDate[0]
this.form.validityEndTime = this.daterangeDate[1]
updatePublish(data).then(response => {
this.$modal.msgSuccess('修改成功')
this.loading = false
this.open = false
this.$router.push({ path: '/build/publish' })
})
}
})
},
// 选择系统做一些逻辑判断
changeSys () {
// this.form.systemType = sysType
this.form.apkId = null
this.form.version = null
this.form.sysApkName = null
this.form.appStoreAddress = null
this.form.apkUrl = null
},
// 发布按钮
pubLishForm () {
this.$refs['form'].validate(valid => {
if (valid) {
if (this.form.id != null) {
let data = Object.assign({}, this.form)
delete data.explain
updatePublish(data).then(response => {
this.handlePublish(data.id)
this.loading = false
})
} else {
addPublish(this.form).then((res) => {
this.loading = false
})
}
this.close()
this.$router.push({ path: '/build/publish' })
}
})
},
handlePublish (id) {
publish(id).then(response => {
this.close()
this.$modal.msgSuccess('发布成功')
})
},
handleAddWhite (e) {
if (e) {
this.WhiteArr.push(e)
}
},
/** 关闭包选择框*/
closeAddPack () {
this.packOpen = false
},
closeAddWhite () {
this.whiteOpen = false
},
cancel () {
this.close()
this.$router.push({ path: '/build/publish' })
},
handleDeleteTag (e) {
for (var i in this.WhiteArr) {
if (this.WhiteArr[i].apkId == e) {
this.WhiteArr.splice(i, 1);
break; // 删除后退出循环
}
}
},
close () {
this.$tab.closePage();
},
}
}
</script>
<style lang="scss" scoped>
.app-container {
background: #ffffff;
// margin: 24px;
position: relative;
height: 100%;
}
.form-main {
margin: 0 auto;
}
::v-deep .el-input.is-disabled .el-input__inner,
.el-textarea.is-disabled .el-textarea__inner {
border: 1px solid #E4E7ED !important;
}
.tag-group {
.el-tag {
cursor: pointer;
}
}
.el-tag+.el-tag {
margin-left: 10px
}
.footer {
display: flex;
align-items: center;
justify-content: flex-end;
position: absolute;
bottom: 24px;
right: 80px
}
.area-box {
max-width: 400px;
min-height: 100px;
padding: 10px;
box-sizing: border-box;
border: 1px solid #DCDFE6;
border-radius: 4px;
overflow-y: auto;
}
::v-deep .el-input,
.el-select {
max-width: 400px;
width: 400px;
}
</style>

493
sf-ui/src/views/deployment/publish/index.vue
View File

@ -1,7 +1,6 @@
<template>
<div class="app-container">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="" size="small"
labelPosition="left">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="120px" size="small">
<el-form-item label="APP名称" prop="appName">
<el-input v-model="queryParams.appName" clearable placeholder="请输入APP名称" @keyup.enter.native="handleQuery" />
</el-form-item>
@ -35,10 +34,12 @@
type="success" @click="handleUpdate">修改
</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-button :disabled="multiple" icon="el-icon-top" plain size="mini" type="info" @click="handlePublish">批量发布
<el-col :span="1.5">
<el-button :disabled="multiple" icon="el-icon-top" plain size="mini" type="info" @click="handleDelete">批量发布
</el-button>
</el-col> -->
</el-col>
<el-col :span="1.5">
<el-button v-hasPermi="['deployment:publish:remove']" :disabled="multiple" icon="el-icon-delete" plain size="mini"
type="danger" @click="handleDelete">批量删除
@ -51,10 +52,7 @@
<el-table-column :show-overflow-tooltip="true" align="center" type="selection" width="55" />
<el-table-column :show-overflow-tooltip="true" align="center" label="APP名称" prop="appName" />
<el-table-column :show-overflow-tooltip="true" align="center" label="版本号" prop="version" />
<el-table-column :show-overflow-tooltip="true" align="center" label="系统" prop="systemType" :filters="dict.type.sys_apk_type.map(item => ({
...item,
text: item.label
}))" :filter-method="filterTagSysType" />
<el-table-column :show-overflow-tooltip="true" align="center" label="系统" prop="systemType" />
<el-table-column align="center" label="公开版" prop="publicVersion">
<template slot-scope="scope">
<el-switch v-model="scope.row.publicVersion" :active-value="1" :inactive-value="0" class="drawer-switch"
@ -67,109 +65,222 @@
disabled />
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" align="center" label="上传时间" prop="updateTime" sortable>
<el-table-column :show-overflow-tooltip="true" align="center" label="上传时间" prop="updateTime">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.updateTime) }}</span>
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" align="center" label="发布环境" prop="publishEnvironment" :filters="environmentList.map(item => ({
...item,
text: item.name,
value: item.id
}))" :filter-method="filterPublishEnvironment" filter-placement="bottom-end">
<el-table-column :show-overflow-tooltip="true" align="center" label="发布环境" prop="publishEnvironment">
<template slot-scope="scope">
<div v-for="item in environmentList" :key="item.id">
<div v-if="item.id === scope.row.publishEnvironment">{{ item.name }}</div>
</div>
<!-- <dict-tag :options="environmentList" :value="scope.row.publishEnvironment"/>-->
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" align="center" :filters="dict.type.release_status.map(item => ({
...item,
text: item.label
}))" :filter-method="filterTagStatus" label="发布状态" prop="publishEnvironment">
<el-table-column :show-overflow-tooltip="true" align="center" label="发布状态" prop="publishEnvironment">
<template slot-scope="scope">
<span v-for="item in dict.type.release_status">
<el-tag v-if="item.value == scope.row.status"
:type="scope.row.status == 0 ? 'info' : scope.row.status == 1 ? 'success' : 'warning'">{{ item.label
}}</el-tag>
</span>
<!-- <dict-tag :options="dict.type.release_status" :value="scope.row.status" /> -->
<dict-tag :options="dict.type.release_status" :value="scope.row.status" />
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" align="center" label="安装包编号" prop="apkId" />
<el-table-column :show-overflow-tooltip="true" align="center" label="版本说明" prop="versionDesc" />
<el-table-column :show-overflow-tooltip="true" align="center" label="公开时间" prop="createTime" sortable>
<el-table-column :show-overflow-tooltip="true" align="center" label="公开时间" prop="createTime">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column align="center" label="二维码" min-width="80">
<template slot-scope="scope">
<template v-if="scope.row.quickMark">
<el-image v-if="scope.row.status != 2" :preview-src-list="[scope.row.quickMark]" :src="scope.row.quickMark"
style="width: 80px; height: 80px">
</el-image>
<el-image v-else :src="scope.row.quickMark" style="width: 80px; height: 80px">
</el-image>
</template>
<div v-else>/</div>
<!-- <el-popover-->
<!-- v-if="scope.row.qrCode && scopeC.row.status !== '20'"-->
<!-- ref="popver"-->
<!-- trigger="click"-->
<!-- width="200"-->
<!-- >-->
<!-- <div class="table-img">-->
<!-- <img :src="'data:image/jpg;base64,'+ scope.row.qrCode">-->
<!-- <p v-if="scopeC.row.verifyCode">密码:{{ scope.row.verifyCode }}</p>-->
<!-- </div>-->
<!-- </el-popover>-->
<!-- <div v-else>-</div>-->
</template>
</el-table-column>
<el-table-column align="center" class-name="small-padding fixed-width" label="操作" fixed="right">
<el-table-column align="center" class-name="small-padding fixed-width" label="操作">
<template slot-scope="scope">
<el-popover placement="left" width="" trigger="hover">
<div>
<div style="margin-bottom: 10px;color:#000;font-size:14px">操作</div>
<div style="text-align: right; margin: 0">
<el-button @click="handlePublish(scope.row)" v-if="scope.row.status == 2 || scope.row.status == 0" plain
size="mini">发布</el-button>
<el-button @click="handleDown(scope.row)" plain size="mini" v-if="scope.row.status == 1">下架</el-button>
<el-button @click="handleDownload(scope.row)" size="mini">下载</el-button>
<el-button plain size="mini" @click="handleUpdate(scope.row)"
v-if="scope.row.status === 2 || scope.row.status === 0">修改</el-button>
<el-button plain size="mini" @click="handleDetail(scope.row)">详情</el-button>
<el-button plain type="danger" size="mini" @click="handleDelete(scope.row)">删除</el-button>
</div>
</div>
<el-button slot="reference" size="mini" type="text">更多<i class="el-icon-caret-right"></i></el-button>
</el-popover>
<!--
<el-dropdown trigger="hover" placement="left-start" size="mini"
@command="(command) => handleCommand(command, scope.row)">
<el-button size="mini" type="text">更多<i class="el-icon-caret-right"></i></el-button>
<el-dropdown-menu slot="dropdown" class="dropdown-max">
<el-dropdown-item command="handlePublish"
v-if="scope.row.status == 2 || scope.row.status == 0">发布</el-dropdown-item>
<el-dropdown-item command="handleDown" v-if="scope.row.status == 1">下架</el-dropdown-item>
<el-dropdown-item command="handleUpdate"
v-if="scope.row.status === 2 || scope.row.status === 0">编辑</el-dropdown-item>
<el-dropdown-item command="handleDownload">下载安装包
</el-dropdown-item>
<el-dropdown-item command="handleDetail">详情</el-dropdown-item>
<el-dropdown-item command="handleDelete"
v-if="scope.row.status === 2 || scope.row.status === 0">删除</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown> -->
<el-button v-if="scope.row.status === 1" icon="el-icon-bottom" size="mini" type="text"
@click="handleDown(scope.row)">下架
</el-button>
<el-button v-if="scope.row.status == 2 || scope.row.status == 0" icon="el-icon-top" size="mini" type="text"
@click="handlePublish(scope.row.id)">发布
</el-button>
<el-button icon="el-icon-view" size="mini" type="text" @click="handleDetail(scope.row)">详情
</el-button>
<el-button icon="el-icon-download" size="mini" type="text" @click="handleDownload(scope.row)">下载安装包
</el-button>
<el-button v-if="scope.row.status === 2 || scope.row.status === 0" v-hasPermi="['deployment:publish:edit']"
icon="el-icon-edit" size="mini" type="text" @click="handleUpdate(scope.row)">修改
</el-button>
<el-button v-if="scope.row.status === 2 || scope.row.status === 0" v-hasPermi="['deployment:publish:remove']"
icon="el-icon-delete" size="mini" type="text" @click="handleDelete(scope.row)">删除
</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :limit.sync="queryParams.pageSize" :page.sync="queryParams.pageNum" :total="total"
@pagination="getList" />
<!-- 添加或修改发布列表对话框 -->
<el-dialog :title="title" :visible.sync="open" append-to-body width="900px">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-form-item label="APPid">
<el-input v-model="form.applyId" placeholder="请输入Appid" readonly />
</el-form-item>
<el-form-item label="APP名称">
<el-input v-model="form.appName" placeholder="请输入APP名称" readonly />
</el-form-item>
<el-form-item label="选择系统" prop="systemType">
<el-select v-model="form.systemType" placeholder="请选择系统类型" @change="changeSys">
<el-option v-for="dict in dict.type.sys_apk_type" :key="dict.value" :label="dict.label"
:value="dict.value"></el-option>
</el-select>
<!-- <el-radio-group v-model="form.systemType" @change="changeSys">-->
<!-- <el-radio-button label="android">android</el-radio-button>-->
<!-- <el-radio-button label="IOS">IOS</el-radio-button>-->
<!-- <el-radio-button label="HarmonyOS">HarmonyOS</el-radio-button>-->
<!-- </el-radio-group>-->
</el-form-item>
<el-form-item v-if="form.systemType != 'IOS'" label="安装包" prop="sysApkName">
<!-- <el-input v-model="form.apkId" class="input-with-select" placeholder="请选择包" readonly>-->
<!-- <el-button slot="append" icon="el-icon-search" @click="handlePackOpen"></el-button>-->
<!-- </el-input>-->
<el-input v-model="form.sysApkName" class="input-with-select" placeholder="请选择包" readonly>
<el-button slot="append" icon="el-icon-search" @click="handlePackOpen"></el-button>
</el-input>
<!-- <el-input v-model="form.apkId" placeholder="请输入安装包编号"/>-->
</el-form-item>
<el-form-item v-if="form.systemType == 'ios'" label="app store地址" prop="appStoreAddress">
<el-input v-model="form.appStoreAddress" placeholder="请输入app store地址" />
</el-form-item>
<el-form-item label="版本号" prop="version">
<el-input v-model="form.version" placeholder="请输入版本号" />
</el-form-item>
<el-form-item label="版本说明" prop="versionDesc">
<el-input v-model="form.versionDesc" placeholder="请输入版本说明" />
</el-form-item>
<el-form-item label="发布环境" prop="publishEnvironment">
<el-select v-model="form.publishEnvironment">
<el-option v-for="dict in environmentList" :key="dict.value" :label="dict.name" :value="parseInt(dict.id)" />
</el-select>
</el-form-item>
<el-form-item label="发布策略" prop="publishStrategy">
<el-select v-model="form.publishStrategy">
<el-option v-for="dict in dict.type.release_strategy" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
</el-form-item>
<el-form-item label="结果通知" prop="resultNotify">
<el-switch v-model="form.resultNotify" :active-value="1" :inactive-value="0" />
</el-form-item>
<el-form-item label="公开版" prop="publicVersion">
<el-switch v-model="form.publicVersion" :active-value="1" :inactive-value="0" />
</el-form-item>
<el-form-item label="强制更新" prop="forceUpdate">
<el-switch v-model="form.forceUpdate" :active-value="1" :inactive-value="0" />
</el-form-item>
<el-form-item label="下载验证" prop="downloadVerification">
<el-switch v-model="form.downloadVerification" :active-value="1" :inactive-value="0" />
</el-form-item>
<!-- <el-form-item label="更新对象(-1: 不限制, 白名单id)" prop="updateObject">-->
<!-- <el-form-item label="更新对象" prop="updateObject">-->
<!-- <el-select v-model="form.publishStrategy">-->
<!-- <el-option-->
<!-- v-for="dict in dict.type.release_user_type"-->
<!-- :key="dict.value"-->
<!-- :label="dict.label"-->
<!-- :value="parseInt(dict.value)"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item label="有效期开始时间" prop="validityStartTime">
<el-date-picker v-model="form.validityStartTime" clearable placeholder="请选择有效期开始时间" type="date"
value-format="yyyy-MM-dd">
</el-date-picker>
</el-form-item>
<el-form-item label="有效期结束时间" prop="validityEndTime">
<el-date-picker v-model="form.validityEndTime" clearable placeholder="请选择有效期结束时间" type="date"
value-format="yyyy-MM-dd">
</el-date-picker>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button v-if="form.status != 2" type="primary" @click="pubLishForm">发 布
</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<AddPack v-if="packOpen" :systemType="form.systemType" @addPack="addPack" @close="closeAddPack"></AddPack>
<DetailModal v-if="openDetail" :detailId="detailId" :openDetail="openDetail" @close="closeDetailModal"></DetailModal>
</div>
</template>
<script>
import {
addPublish,
delPublish,
getPublish,
listPublish,
publish,
soldPublish,
updatePublish
} from '@/api/deployment/publish'
import Cookies from 'js-cookie'
import AddPack from '@/views/FDS/publishList/components/addPack.vue'
import DetailModal from './component/detail.vue'
import { listEnvironment } from '@/api/deployment/environment'
import { getApplicationName } from '@/utils/application'
import { getINFO } from '@/api/FDS/installList'
export default {
name: 'Publish',
dicts: ['release_environment', 'sys_yes_no', 'release_strategy', 'release_user_type', 'release_status', 'sys_apk_type'],
components: {
AddPack,
DetailModal
},
data () {
return {
// 遮罩层
@ -189,6 +300,7 @@ export default {
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
packOpen: false,
openDetail: false,
detailId: '',
@ -212,7 +324,50 @@ export default {
pageNum: 1,
pageSize: 10,
sysApkName: null,
appCode: Cookies.get('Admin-Application-appCode')
},
// 表单校验
rules: {
appName: [
{ required: true, message: '应用name不能为空', trigger: 'blur' }
],
systemType: [
{ required: true, message: '系统类型不能为空', trigger: 'change' }
],
apkId: [
{ required: true, message: '安装包编号不能为空', trigger: 'blur' }
],
version: [
{ required: true, message: '版本号不能为空', trigger: 'blur' }
],
publishEnvironment: [
{ required: true, message: '发布环境不能为空', trigger: 'change' }
],
publishStrategy: [
{ required: true, message: '发布策略不能为空', trigger: 'change' }
],
publicVersion: [
{ required: true, message: '公开版不能为空', trigger: 'change' }
],
forceUpdate: [
{ required: true, message: '强制更新不能为空', trigger: 'change' }
],
updateObject: [
{ required: true, message: '更新对象(-1: 不限制, 白名单id)不能为空', trigger: 'change' }
],
status: [
{ required: true, message: '0:保存,1:已发布,2:已下架不能为空', trigger: 'change' }
],
isDelete: [
{ required: true, message: '逻辑删除,0:未删除,1:删除不能为空', trigger: 'blur' }
],
createTime: [
{ required: true, message: '创建时间不能为空', trigger: 'blur' }
],
sysApkName: [
{ required: true, message: '安装包不能为空', trigger: 'blur' }
]
}
}
},
created () {
@ -222,6 +377,7 @@ export default {
methods: {
/** 查询发布列表列表 */
getList (type) {
this.loading = true
listPublish(this.queryParams).then(response => {
this.publishList = response.rows
@ -232,7 +388,45 @@ export default {
this.handlePublish(this.publishList[0].id)
}
},
// 取消按钮
cancel () {
this.open = false
this.loading = false
this.reset()
},
// 表单重置
reset () {
this.form = {
id: null,
applyId: Cookies.get('Admin-Application-Id'),
appName: getApplicationName(),
systemType: null,
apkId: null,
appStoreAddress: null,
version: null,
versionDesc: null,
publishEnvironment: null,
publishStrategy: null,
resultNotify: null,
publicVersion: null,
forceUpdate: null,
downloadVerification: null,
updateObject: null,
validityStartTime: null,
validityEndTime: null,
remark: null,
status: null,
isDelete: null,
created: null,
modified: null,
createTime: null,
updateTime: null,
apkUrl: null,
sysApkName: null
}
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery () {
this.queryParams.pageNum = 1
@ -251,19 +445,84 @@ export default {
},
/** 新增按钮操作 */
handleAdd () {
this.$router.push('/build/publishAdd')
this.reset()
this.open = true
this.title = '添加发布列表'
this.getEnvironmentList()
},
/** 修改按钮操作 */
handleUpdate (row) {
this.reset()
this.getEnvironmentList()
const id = row.id || this.ids
getPublish(id).then(response => {
this.form = response.data
this.getPackList(this.form.apkId)
})
},
/** 编辑按钮操作 */
handleUpdate (row) {
this.$router.push({
path: '/build/publishEdit',
query: {
id: row.id,
/** 查询参数列表 */
getPackList (id) {
getINFO(id).then(response => {
this.form.sysApkName = response.data.sysApkName
this.open = true
this.title = '修改发布列表'
})
},
/** 提交按钮 */
submitForm () {
this.$refs['form'].validate(valid => {
if (valid) {
if (this.form.id != null) {
let data = Object.assign({}, this.form)
delete data.explain
updatePublish(data).then(response => {
console.log(data)
this.$modal.msgSuccess('修改成功')
this.loading = false
this.open = false
this.getList()
})
} else {
addPublish(this.form).then(response => {
this.$modal.msgSuccess('新增成功')
this.loading = false
this.open = false
this.getList()
})
}
}
})
},
// 发布按钮
pubLishForm () {
this.$refs['form'].validate(valid => {
if (valid) {
if (this.form.id != null) {
let data = Object.assign({}, this.form)
delete data.explain
updatePublish(data).then(response => {
this.handlePublish(data.id)
this.loading = false
this.open = false
// this.getList()
})
} else {
addPublish(this.form).then((res) => {
this.loading = false
this.open = false
this.getList('publish')
// this.handlePublish(res.id)
})
}
}
})
},
/** 删除按钮操作 */
handleDelete (row) {
@ -276,6 +535,32 @@ export default {
}).catch(() => {
})
},
/** 导出按钮操作 */
handleExport () {
this.download('deployment/publish/export', {
...this.queryParams
}, `publish_${new Date().getTime()}.xlsx`)
},
/** 弹出包选择框*/
handlePackOpen () {
this.packOpen = true
},
addPack (e) {
this.form.apkId = e.apkId
this.form.version = e.version
this.form.systemType = e.sysType
this.form.sysApkName = e.sysApkName
this.form.apkUrl = e.sysApk
this.packOpen = false
},
/** 关闭包选择框*/
closeAddPack () {
this.packOpen = false
},
/** 查询环境维护列表 */
getEnvironmentList () {
@ -284,10 +569,19 @@ export default {
})
},
// 选择系统做一些逻辑判断
changeSys () {
// this.form.systemType = sysType
this.form.apkId = null
this.form.version = null
this.form.sysApkName = null
this.form.appStoreAddress = null
this.form.apkUrl = null
console.log(this.form, 99999999)
},
/**下载安装包*/
handleDownload (row) {
window.open(row.apkUrl);
handleDownload () {
},
/**下架*/
handleDown (row) {
@ -297,56 +591,21 @@ export default {
})
},
/**发布*/
handlePublish (row) {
publish(row.id).then(response => {
handlePublish (id) {
publish(id).then(response => {
this.$modal.msgSuccess('发布成功')
this.getList()
})
},
/**详情*/
handleDetail (row) {
this.$router.push({
path: '/build/publishDetail',
query: {
id: row.id,
}
})
this.detailId = row.id
this.openDetail = true
},
filterTagStatus (value, row) {
return row.status === Number(value);
},
filterTagSysType (value, row) {
return row.sysType === Number(value);
},
filterPublishEnvironment (value, row) {
return row.publishEnvironment === Number(value);
},
// 更多操作触发
handleCommand (command, row) {
switch (command) {
case "handlePublish":
this.handlePublish(row);
break;
case "handleDown":
this.handleDown(row);
break;
closeDetailModal () {
this.openDetail = false
}
case "handleUpdate":
this.handleUpdate(row);
break;
case "handleDownload":
this.handleDownload(row);
break;
case "handleDetail":
this.handleDetail(row);
break;
case "handleDelete":
this.handleDelete(row);
break;
default:
break;
}
},
}
}
</script>
@ -361,14 +620,4 @@ export default {
.el-tag+.el-tag {
margin-left: 10px
}
.dropdown-container {
display: flex;
/* 设置为Flex布局 */
}
.el-dropdown-link {
cursor: pointer;
color: #409EFF;
}
</style>

147
sf-ui/src/views/deployment/whitelist/add.vue
View File

@ -1,147 +0,0 @@
<template>
<div class="app-container">
<el-container>
<el-main>
<div class="form-main">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-form-item label="白名单名称" prop="whitelistName">
<el-input v-model="form.whitelistName" placeholder="请输入白名单名称" />
</el-form-item>
<el-form-item label="白名单类型" prop="whitelistType">
<el-select v-model="form.whitelistType" clearable placeholder="请选择白名单类型">
<el-option v-for="dict in dict.type.whitelist_type" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
</el-form-item>
<el-form-item label="白名单模式" prop="whitelistMode">
<el-select v-model="form.whitelistMode" clearable placeholder="请选择白名单模式">
<el-option v-for="dict in dict.type.white_mode" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
</el-form-item>
<el-form-item label="备注">
<el-input v-model="form.remarks" placeholder="请输入内容" type="textarea" />
</el-form-item>
</el-form>
</div>
<div class="footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="submitAddForm()">保 存</el-button>
</div>
</el-main>
</el-container>
</div>
</template>
<script>
import { addWhitelist } from '@/api/FDS/whiteList'
export default {
name: 'WhiteAdd',
dicts: ["white_mode", 'whitelist_type'],
data () {
return {
form: {},
tokenId: '',
// 文件存放的路径
fileList: [],
rules: {
whitelistName: [
{ required: true, message: '白名单名称不能为空', trigger: 'blur' }
],
whitelistType: [
{ required: true, message: '白名单类型不能为空', trigger: 'change' }
],
whitelistMode: [
{ required: true, message: '白名单模式不能为空', trigger: 'change' }
]
}
}
},
computed: {},
mounted () {
this.reset()
},
methods: {
reset () {
this.form = {
}
console.log(this.form)
},
/** 新增按钮 */
submitAddForm: function () {
this.$refs['form'].validate(valid => {
if (valid) {
addWhitelist(this.form).then(response => {
this.$modal.msgSuccess('新增成功')
})
this.close()
this.$router.push({ path: '/build/whitelist' })
}
})
},
cancel () {
this.close()
this.$router.push({ path: '/build/whitelist' })
},
close () {
this.$tab.closePage();
},
}
}
</script>
<style lang="scss" scoped>
.app-container {
background: #ffffff;
height: 100%;
position: relative;
}
.form-main {
width: 700px;
margin: 0 auto;
}
::v-deep .el-input.is-disabled .el-input__inner,
.el-textarea.is-disabled .el-textarea__inner {
border: 1px solid #E4E7ED !important;
}
.tag-group {
.el-tag {
cursor: pointer;
}
}
.el-tag+.el-tag {
margin-left: 10px
}
.page-footer {
margin: 0 auto;
width: 700px;
justify-content: center;
display: flex;
}
::v-deep .el-input,
.el-select,
.el-textarea {
max-width: 400px;
width: 400px;
}
.footer {
margin-top: 20px;
display: flex;
align-items: center;
justify-content: flex-end;
position: absolute;
bottom: 24px;
right: 80px
}
</style>

292
sf-ui/src/views/deployment/whitelist/addConfig.vue
View File

@ -1,292 +0,0 @@
、
<template>
<div class="app-container">
<el-container>
<el-header>
<div>白名单配置</div>
<el-divider />
</el-header>
<el-main>
<div class="form-main">
<el-form ref="configForm" :model="configForm" :rules="configRules" label-width="120px">
<el-form-item label="添加方式" prop="configName">
<el-radio-group v-model="configForm.addMode">
<el-radio :label="1">手动添加
</el-radio>
<el-radio :label="2">批量添加
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="白名单类型">
<dict-tag :options="dict.type.white_mode" :value="configForm.whitelistType" />
</el-form-item>
<template v-if="configForm.addMode == 1">
<el-form-item :label="configForm.whiteListType == 0 ? '用户ID' : '白名单设备'" prop="user">
<el-input v-model="configForm.userId" :placeholder="configForm.whiteListType == 0 ? '请输入用户ID' : '请输入设备信息'"
type="textarea" />
</el-form-item>
</template>
<el-form-item v-else-if="configForm.addMode == 2" label="白名单文件" prop="fileList">
<div class="upload-file">
<el-upload ref="fileUpload" :accept="accept" action="#" :before-upload="handleBeforeUpload"
:file-list="fileList" :limit="1" :auto-upload="false" :on-error="handleUploadError"
:on-exceed="handleExceed" :on-success="handleUploadSuccess" :on-change="changeFile"
:show-file-list="false" class="upload-file-uploader" multiple>
<!-- 上传按钮 -->
<el-button size="mini" type="primary">选取文件</el-button>
<!-- 上传提示 -->
<div v-if="showTip" slot="tip" class="el-upload__tip">
请上传
<template v-if="fileSize">大小不超过 <b style="color: #f56c6c">1MB</b></template>
<template v-if="fileType"> 格式为 <b style="color: #f56c6c">txt</b></template>
的文件
</div>
</el-upload>
<!-- 文件列表 -->
<transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear"
tag="ul">
<li v-for="(file, index) in fileList" :key="file.uid"
class="el-upload-list__item ele-upload-list__item-content fl-ac">
<div class="el-icon-document"> {{ file.name }} </div>
<div class="ele-upload-list__item-content-action">
<el-link :underline="false" type="danger" @click="handleDelete(index)">删除</el-link>
</div>
</li>
</transition-group>
</div>
</el-form-item>
</el-form>
</div>
<div class="page-footer">
<el-button type="primary" @click="submitAddForm()">保 存</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-main>
</el-container>
</div>
</template>
<script>
import { listWhitelistMember, addWhitelistMember, importWhitelist } from "@/api/FDS/whiteList";
import { getToken } from '@/utils/auth'
export default {
name: 'WhiteAddConfig',
dicts: ["white_mode", 'whitelist_type', 'release_status'],
data () {
return {
form: {},
tokenId: '',
// 文件存放的路径
fileList: [],
configForm: {
addMode: 1,
whiteListType: '',
whitelistIds: '',
remark: '',
equepid: '',
fileList: []
},
accept: 'text/plain',
headers: {
Authorization: 'Bearer ' + getToken()
},
number: 0,
isShowTip: true,
fileSize: 1,
fileList: [],
uploadList: [],
_formData: new FormData(),
file: {},
fileType: ['txt'],
configRules: {
user: [
{ required: true, message: '用户Id不能为空', trigger: 'blur' }
],
fileList: [
{ required: true, message: '白名单文件不能为空', trigger: 'change' }
]
}
}
},
computed: {
// 是否显示提示
showTip () {
return this.isShowTip && (this.fileType || this.fileSize)
}
},
mounted () {
this.whitelistId = this.$route.query.id;
this.configForm.whitelistType = this.$route.query.whitelistType
},
methods: {
reset () {
this.form = {
addMode: undefined,
whiteListType: undefined,
userId: undefined,
equepid: undefined,
file: undefined
}
this.resetForm('form')
},
/** 提交按钮 */
submitAddForm: function () {
this.$refs['configForm'].validate(valid => {
if (valid) {
if (this.configForm.addMode == 1) {
addWhitelistMember({
user: this.configForm.user,
whitelistId: this.whitelistId
}).then(response => {
this.$modal.msgSuccess('新增成功')
this.$router.push({ path: '/build/whitelist' })
})
} else {
importWhitelist(this._formData).then(res => {
this.$modal.msgSuccess('新增成功')
this.$router.push({ path: '/build/whitelist' })
})
}
}
})
},
cancel () {
this.$router.push({ path: '/build/whitelist' })
},
// 上传前校检格式和大小
handleBeforeUpload (file) {
console.log(file)
// 校检文件类型
if (this.fileType) {
const fileName = file.name.split('.')
const fileExt = fileName[fileName.length - 1]
const isTypeOk = this.fileType.indexOf(fileExt) >= 0
if (!isTypeOk) {
this.$modal.msgError(`文件格式不正确, 请上传${this.fileType.join('/')}格式文件!`)
return false
}
}
// 校检文件大小
if (this.fileSize) {
const isLt = file.size / 1024 / 1024 < this.fileSize
if (!isLt) {
this.$modal.msgError(`上传文件大小不能超过 ${this.fileSize} MB!`)
return false
}
}
this.$modal.loading('正在上传文件，请稍候...')
this.number++
return true
},
// 文件个数超出
handleExceed () {
this.$modal.msgError(`上传文件数量不能超过 1 个!`)
},
// 上传失败
handleUploadError (err) {
console.log(222);
this.$modal.msgError('上传文件失败，请重试')
this.$modal.closeLoading()
},
// 上传成功回调
handleUploadSuccess (res, file) {
console.log(res);
if (res.status == 'ready') {
this.uploadList.push(res)
this.$modal.closeLoading()
this.uploadedSuccessfully()
} else {
this.$modal.closeLoading()
this.uploadedSuccessfully()
}
// if (res.code === 200) {
// this.uploadList.push({ name: res.data.url, url: res.data.url, size: res.data.size })
// this.uploadedSuccessfully()
// } else {
// this.number--
// this.$modal.closeLoading()
// this.$refs.fileUpload.handleRemove(file)
// this.uploadedSuccessfully()
// }
},
// 上传结束处理
uploadedSuccessfully () {
if (this.number > 0 && this.uploadList.length === this.number) {
this.fileList = this.fileList.concat(this.uploadList)
this.configForm.fileList = this.fileList.concat(this.uploadList)
this.uploadList = []
this.number = 0
this.$modal.closeLoading()
}
},
// 获取文件名称
getFileName (name) {
if (name.lastIndexOf('/') > -1) {
return name.slice(name.lastIndexOf('/') + 1)
} else {
return ''
}
},
changeFile (file) {
this.handleBeforeUpload(file)
this.handleUploadSuccess(file, file)
let formData = new FormData()
this.file = file
formData.append('file', file.raw)// 传文件
formData.append('whitelistId', this.whitelistId)// 传文件
this._formData = formData
},
handleDelete (index) {
this.fileList.splice(index, 1)
},
}
}
</script>
<style lang="scss" scoped>
.app-container {
background: #ffffff;
margin: 24px;
}
.form-main {
width: 700px;
margin: 0 auto;
}
::v-deep .el-input.is-disabled .el-input__inner,
.el-textarea.is-disabled .el-textarea__inner {
border: 1px solid #E4E7ED !important;
}
.tag-group {
.el-tag {
cursor: pointer;
}
}
.el-tag+.el-tag {
margin-left: 10px
}
.page-footer {
margin: 0 auto;
width: 700px;
justify-content: center;
display: flex;
}
.fl-ac {
display: flex;
align-items: center;
justify-content: space-between;
}
</style>

112
sf-ui/src/views/deployment/whitelist/components/editWhiteList.vue
View File

@ -1,112 +0,0 @@
<template>
<el-dialog :modal-append-to-body="false" :visible.sync="dialogVisible" :title="title" v-bind="$attrs" width="550px"
v-on="$listeners">
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item v-if="whitelistType == 0" label="用户Id" prop="user">
<el-input v-model="form.user" placeholder="请输入用户Id" />
</el-form-item>
<el-form-item v-else label="设备号" prop="user">
<el-input v-model="form.user" placeholder="请输入设备号" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="submitAddForm()">保 存</el-button>
</div>
</el-dialog>
</template>
<script>
import { updateWhitelistMember, getWhitelistMember } from '@/api/FDS/whiteList'
export default {
name: 'EditWhiteList',
props: {
//类型
user: {
type: Number,
default: undefined
},
whitelistType: {
type: String,
default: undefined
},
id: {
type: Number,
default: undefined
}
},
data () {
return {
configName: undefined,
dialogVisible: true,
form: {
user: undefined,
},
id: undefined,
title: '编辑',
// 详情信息
rules: {
user: [
{ required: true, message: '用户Id不能为空', trigger: 'blur' }
],
}
}
},
mounted () {
this.form.user = this.user
this.form.id = this.id
this.getWhitelistMemberById()
},
methods: {
/**
* 查询白名单成员列详细
*/
getWhitelistMemberById () {
getWhitelistMember(this.user).then(res => {
this.form.user = res.data.id
})
},
/** 提交按钮 */
submitAddForm: function () {
// this.form.id = this.user
this.$refs['form'].validate(valid => {
if (valid) {
updateWhitelistMember(this.form).then(response => {
this.$modal.msgSuccess('修改成功')
this.closeModal()
})
}
})
},
reset () {
this.form = {
user: undefined,
}
this.resetForm('form')
},
// 取消按钮
cancel () {
this.reset()
this.closeModal()
},
closeModal () {
this.$emit('close')
}
}
}
</script>
<style lang="scss" scoped>
::v-deep .el-dialog .el-form {
.el-input,
.el-select,
.el-textarea {
width: 100%
}
}
</style>

155
sf-ui/src/views/deployment/whitelist/detail.vue
View File

@ -1,155 +0,0 @@
<template>
<div class="app-container">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="90px" size="small">
<el-form-item label="白名单信息" prop="user">
<el-input v-model="queryParams.user" clearable :placeholder="whitelistType == 0 ? '请输入用户Id' : '请输入设备号'"
style="width: 240px" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button v-hasPermi="['system:config:delete']" :disabled="multiple" icon="el-icon-plus" plain size="mini"
type="info" @click="handleDelete">批量删除
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
<el-table-column align="center" type="selection" width="55" />
<el-table-column :show-overflow-tooltip="true" align="center" :label="whitelistType == 0 ? '用户Id' : '设备号'"
prop="user" />
<el-table-column :show-overflow-tooltip="true" align="center" label="添加时间" prop="createTime" />
<el-table-column align="center" class-name="small-padding fixed-width" label="操作" width="250">
<template slot-scope="scope">
<el-button v-hasPermi="['system:config:edit']" icon="el-icon-edit" size="mini" type="text"
@click="handleEdit(scope.row)">编辑
</el-button>
<el-button v-hasPermi="['system:config:delete']" icon="el-icon-delete" size="mini" type="text"
@click="handleDelete(scope.row)">删除
</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :limit.sync="queryParams.pageSize" :page.sync="queryParams.pageNum" :total="total"
@pagination="getList" />
<EditWhiteList v-if="editWhiteListOpen" @close="closeEditWhiteList" :user="user" :id='id'
:whitelistType="whitelistType" />
</div>
</template>
<script>
import { listWhitelistMember, delWhitelistMember } from '@/api/FDS/whiteList'
import EditWhiteList from './components/editWhiteList.vue'
export default {
name: 'WhiteListDetail',
components: { EditWhiteList },
dicts: ['sys_yes_no'],
data () {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 参数表格数据
dataList: [],
// 弹出层标题
title: '',
editWhiteListOpen: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
user: undefined,
whitelistId: ''
},
user: '',
id: '',
// 表单参数
form: {},
whitelistId: '',
whitelistType: ''
}
},
created () {
this.getList()
},
mounted () {
this.whitelistId = this.$route.query.id
this.whitelistType = this.$route.query.whitelistType
},
methods: {
/** 查询参数列表 */
getList () {
this.loading = true
this.queryParams.whitelistId = this.$route.query.id;
listWhitelistMember(this.queryParams).then(response => {
this.dataList = response.rows
this.total = response.total
this.loading = false
}
)
},
// 表单重置
reset () {
this.form = {
phoneNumber: undefined
}
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery () {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery () {
this.resetForm('queryForm')
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange (selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length != 1
this.multiple = !selection.length
},
/** 删除按钮操作 */
handleDelete (row) {
const configIds = row.id || this.ids
this.$modal.confirm('是否确认删除编号为"' + configIds + '"的数据项？').then(function () {
return delWhitelistMember(configIds)
}).then(() => {
this.getList()
this.$modal.msgSuccess('删除成功')
}).catch(() => {
})
},
/** 修改按钮操作 */
handleEdit (row) {
this.reset()
this.user = row.user
this.id = row.id
this.editWhiteListOpen = true
},
/** 关闭新增弹出框*/
closeEditWhiteList () {
this.editWhiteListOpen = false
this.getList()
},
}
}
</script>

148
sf-ui/src/views/deployment/whitelist/edit.vue
View File

@ -1,148 +0,0 @@
<template>
<div class="app-container">
<el-container>
<el-main>
<div class="form-main">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-form-item label="白名单名称" prop="whitelistName">
<el-input v-model="form.whitelistName" placeholder="请输入白名单名称" />
</el-form-item>
<el-form-item label="白名单类型" prop="whitelistType">
<el-select v-model="form.whitelistType" clearable placeholder="请选择白名单类型">
<el-option v-for="dict in dict.type.whitelist_type" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
</el-form-item>
<el-form-item label="白名单模式" prop="whitelistMode">
<el-select v-model="form.whitelistMode" clearable placeholder="请选择白名单模式">
<el-option v-for="dict in dict.type.white_mode" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
</el-form-item>
<el-form-item label="备注">
<el-input v-model="form.remarks" placeholder="请输入内容" type="textarea" />
</el-form-item>
</el-form>
</div>
<div class="footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="submitAddForm()">保 存</el-button>
</div>
</el-main>
</el-container>
</div>
</template>
<script>
import { updateWhitelist, getWhitelist } from '@/api/FDS/whiteList'
export default {
name: 'WhiteEdit',
dicts: ["white_mode", 'whitelist_type'],
data () {
return {
form: {},
tokenId: '',
rules: {
whitelistName: [
{ required: true, message: '白名单名称不能为空', trigger: 'blur' }
],
whitelistType: [
{ required: true, message: '白名单类型不能为空', trigger: 'change' }
],
whitelistMode: [
{ required: true, message: '白名单模式不能为空', trigger: 'change' }
]
}
}
},
computed: {},
mounted () {
this.getWhitelistById(this.$route.query.id)
},
methods: {
getWhitelistById (id) {
getWhitelist(id).then(response => {
this.form = response.data
})
},
/** 提交按钮 */
submitAddForm: function () {
this.$refs['form'].validate(valid => {
if (valid) {
updateWhitelist(this.form).then(response => {
this.$modal.msgSuccess('修改成功')
})
this.close()
this.$router.push({ path: '/build/whitelist' })
}
})
},
cancel () {
this.close()
this.$router.push({ path: '/build/whitelist' })
},
close () {
this.$tab.closePage();
},
}
}
</script>
<style lang="scss" scoped>
.app-container {
background: #ffffff;
height: 100%;
position: relative;
}
.form-main {
width: 700px;
margin: 0 auto;
}
::v-deep .el-input.is-disabled .el-input__inner,
.el-textarea.is-disabled .el-textarea__inner {
border: 1px solid #E4E7ED !important;
}
.tag-group {
.el-tag {
cursor: pointer;
}
}
.el-tag+.el-tag {
margin-left: 10px
}
.page-footer {
margin: 0 auto;
width: 700px;
justify-content: center;
display: flex;
}
::v-deep .el-input,
.el-select,
.el-textarea {
max-width: 400px;
width: 400px;
}
.footer {
margin-top: 20px;
display: flex;
align-items: center;
justify-content: flex-end;
position: absolute;
bottom: 24px;
right: 80px
}
</style>

154
sf-ui/src/views/deployment/whitelist/equepDetail.vue
View File

@ -1,154 +0,0 @@
<template>
<div class="app-container">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="90px" size="small">
<el-form-item label="白名单信息" prop="user">
<el-input v-model="queryParams.user" clearable placeholder="请输入设备号" style="width: 240px"
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button v-hasPermi="['system:config:delete']" :disabled="multiple" icon="el-icon-plus" plain size="mini"
type="info" @click="handleDelete">批量删除
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
<el-table-column align="center" type="selection" width="55" />
<el-table-column align="center" label="设备号" prop="user" />
<el-table-column :show-overflow-tooltip="true" align="center" label="添加时间" prop="createTime" />
<el-table-column :show-overflow-tooltip="true" align="center" label="备注" prop="remarks" />
<el-table-column align="center" class-name="small-padding fixed-width" label="操作" width="250">
<template slot-scope="scope">
<el-button v-hasPermi="['system:config:edit']" icon="el-icon-edit" size="mini" type="text"
@click="handleEdit(scope.row)">编辑
</el-button>
<el-button v-hasPermi="['system:config:delete']" icon="el-icon-delete" size="mini" type="text"
@click="handleDelete(scope.row)">删除
</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :limit.sync="queryParams.pageSize" :page.sync="queryParams.pageNum" :total="total"
@pagination="getList" />
<EditWhiteList :visible.sync="editWhiteListOpen" @close="closeEditWhiteList" />
</div>
</template>
<script>
import { delConfig, listConfig } from '@/api/system/config'
import EditWhiteList from './components/editWhiteList.vue'
export default {
name: 'WhiteListEquepDetail',
dicts: ['sys_yes_no'],
components: {
EditWhiteList
},
data () {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 参数表格数据
dataList: [],
configList: [],
// 弹出层标题
title: '',
// 是否显示编辑详情弹窗
editWhiteListOpen: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
user: undefined
},
// 表单参数
form: {}
}
},
created () {
this.getList()
},
methods: {
/** 查询参数列表 */
getList () {
this.loading = true
listConfig(this.queryParams).then(response => {
this.dataList = response.rows
this.total = response.total
this.loading = false
}
)
},
// 表单重置
reset () {
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery () {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery () {
this.dateRange = []
this.resetForm('queryForm')
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange (selection) {
this.ids = selection.map(item => item.configId)
this.single = selection.length != 1
this.multiple = !selection.length
},
/** 删除按钮操作 */
handleDelete (row) {
const configIds = row.configId || this.ids
this.$modal.confirm('是否确认删除编号为"' + configIds + '"的数据项？').then(function () {
return delConfig(configIds)
}).then(() => {
this.getList()
this.$modal.msgSuccess('删除成功')
}).catch(() => {
})
},
/** 修改按钮操作 */
handleEdit (row) {
this.reset()
const configId = row.configId || this.ids
this.editWhiteListOpen = true
// getConfig(configId).then(response => {
// this.form = response.data
// this.editWhiteListOpen = true
// })
},
/** 关闭新增弹出框*/
closeEditWhiteList () {
this.editWhiteListOpen = false
this.getList()
}
}
}
</script>

360
sf-ui/src/views/deployment/whitelist/index.vue
View File

@ -1,360 +0,0 @@
<template>
<div class="app-container">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="" size="small">
<el-form-item label="名单类型" prop="whitelistType">
<el-select v-model="queryParams.whitelistType" clearable placeholder="请选择名单类型">
<el-option v-for="dict in dict.type.whitelist_type" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="名称" prop="whitelistName">
<el-input v-model="queryParams.whitelistName" clearable placeholder="请输入名称" style="width: 240px"
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="创建时间">
<el-date-picker v-model="dateRange" end-placeholder="结束日期" range-separator="-" start-placeholder="开始日期"
style="width: 240px" type="daterange" value-format="yyyy-MM-dd"></el-date-picker>
</el-form-item>
<el-form-item label="状态" prop="configType">
<el-select v-model="queryParams.status" clearable placeholder="请选择状态">
<el-option v-for="dict in dict.type.release_status" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item>
<el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button v-hasPermi="['system:config:add']" icon="el-icon-plus" plain size="mini" type="primary"
@click="handleAdd">新增
</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-button :disabled="multiple" icon="el-icon-plus" plain size="mini" type="info" @click="handlePublish">批量发布
</el-button>
</el-col> -->
<el-col :span="1.5">
<el-button :disabled="multiple" icon="el-icon-plus" plain size="mini" type="info" @click="handleDelete">批量删除
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="datalist" @selection-change="handleSelectionChange">
<el-table-column align="center" type="selection" width="55" />
<el-table-column align="center" label="白名单名称" prop="whitelistName" />
<el-table-column :show-overflow-tooltip="true" align="center" label="白名单类型" prop="whitelistType" :filters="dict.type.whitelist_type.map(item => ({
...item,
text: item.label
}))" :filter-method="filterTagWhitelistType">
<template slot-scope="scope">
<dict-tag :options="dict.type.whitelist_type" :value="scope.row.whitelistType" />
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" align="center" label="白名单模式" prop="whitelistMode" :filters="dict.type.white_mode.map(item => ({
...item,
text: item.label
}))" :filter-method="filterTagWhitelistMode">
<template slot-scope="scope">
<dict-tag :options="dict.type.white_mode" :value="scope.row.whitelistMode" />
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" align="center" label="数量" prop="deploymentWhitelistListList">
<template slot-scope="scope">
<span>{{ scope.row.deploymentWhitelistListList ? scope.row.deploymentWhitelistListList.length : 0 }}</span>
</template>
</el-table-column>
<el-table-column align="center" label="创建时间" prop="createTime" width="180" sortable>
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column align="center" label="状态" prop="status" :filters="dict.type.release_status.map(item => ({
...item,
text: item.label
}))" :filter-method="filterTagStatus">
<template slot-scope="scope">
<span v-for="item in dict.type.release_status">
<el-tag v-if="item.value == scope.row.status"
:type="scope.row.status == 0 ? 'info' : scope.row.status == 1 ? 'success' : 'warning'">{{ item.label
}}</el-tag>
</span>
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" align="center" label="备注" prop="remarks" />
<el-table-column align="center" class-name="small-padding fixed-width" label="操作" fixed="right">
<template slot-scope="scope">
<el-popover placement="left" width="" trigger="hover">
<div>
<div style="margin-bottom: 10px;color:#000;font-size:14px">操作</div>
<div style="text-align: right; margin: 0">
<el-button @click="handlePublish(scope.row)" v-if="scope.row.status != 1" plain size="mini">发布</el-button>
<el-button @click="handleDown(scope.row)" plain size="mini" v-if="scope.row.status == 1">下架</el-button>
<el-button @click="handleConfig(scope.row)" size="mini" v-if="scope.row.status != 1">名单配置</el-button>
<el-button v-hasPermi="['deployment:module:edit']" plain size="mini" @click="handleEdit(scope.row)"
v-if="scope.row.status != 1">修改</el-button>
<el-button plain size="mini" @click="handleDetail(scope.row)">详情</el-button>
<el-button v-hasPermi="['deployment:module:remove']" plain type="danger" size="mini"
v-if="scope.row.status != 1" @click="handleDelete(scope.row)">删除</el-button>
</div>
</div>
<el-button slot="reference" size="mini" type="text">更多<i class="el-icon-caret-right"></i></el-button>
</el-popover>
<!--
<el-dropdown trigger="hover" placement="left-start" size="mini"
@command="(command) => handleCommand(command, scope.row)">
<el-button size="mini" type="text">更多<i class="el-icon-caret-right"></i></el-button>
<el-dropdown-menu slot="dropdown" class="dropdown-max">
<el-dropdown-item command="handlePublish" v-if="scope.row.status != 1">发布</el-dropdown-item>
<el-dropdown-item command="handleDown" v-if="scope.row.status == 1">下架</el-dropdown-item>
<el-dropdown-item command="handleEdit" v-if="scope.row.status != 1">编辑</el-dropdown-item>
<el-dropdown-item command="handleConfig" v-if="scope.row.status != 1">名单配置</el-dropdown-item>
<el-dropdown-item command="handleDetail">详情</el-dropdown-item>
<el-dropdown-item command="handleDelete" v-if="scope.row.status != 1">删除</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown> -->
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :limit.sync="queryParams.pageSize" :page.sync="queryParams.pageNum" :total="total"
@pagination="getList" />
</div>
</template>
<script>
import { listWhitelist, delWhitelist, publishWhitelist, soldOutWhitelist } from "@/api/FDS/whiteList";
export default {
name: "WhiteList",
dicts: ["white_mode", 'whitelist_type', 'release_status'],
data () {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 参数表格数据
datalist: [],
// 弹出层标题
title: "",
// 是否显示新增白名单弹出框
addOpen: false,
// 是否显示白名单配置弹出框
configOpen: false,
// 日期范围
dateRange: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
whitelistName: undefined,
whitelistType: undefined,
status: undefined,
},
// 表单参数
form: {},
// 白名单配置表单参数
configForm: {
addMode: 1,
whitelistType: undefined,
whitelistName: undefined,
},
};
},
created () {
this.getList();
},
methods: {
/** 查询参数列表 */
getList () {
this.loading = true;
listWhitelist(this.addDateRange2(this.queryParams, this.dateRange)).then(response => {
// listConfig(this.addDateRange(this.queryParams, this.dateRange)).then(
this.datalist = response.rows;
this.total = response.total;
this.loading = false;
}
);
},
// 表单重置
reset () {
this.form = {
configId: undefined,
configName: undefined,
configKey: undefined,
configValue: undefined,
configType: "Y",
remark: undefined,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery () {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery () {
this.dateRange = [];
this.resetForm("queryForm");
this.handleQuery();
},
/** 新增按钮操作 */
handleAdd () {
const params = {
type: "add",
};
this.$tab.openPage("新增白名单", "/build/whiteAdd/", params);
},
// 多选框选中数据
handleSelectionChange (selection) {
this.ids = selection.map((item) => item.id);
this.single = selection.length != 1;
this.multiple = !selection.length;
},
/** 修改按钮操作 */
handleEdit (row) {
// E: \zhongtianBase\smarterFramework\sf - ui\src\views\deployment\whitelist\edit.vue
const params = {
type: "edit",
id: row.id
};
this.$tab.openPage("编辑白名单", "/build/whiteEdit/", params);
},
/** 白名单配置弹窗 **/
handleConfig (row) {
this.reset();
this.$router.push({
path: "/build/addConfig",
query: {
id: row.id,
whitelistType: row.whitelistType
}
});
},
/** 删除按钮操作 */
handleDelete (row) {
const configIds = row.id || this.ids;
this.$modal
.confirm('是否确认删除编号为"' + configIds + '"的数据项？')
.then(function () {
return delWhitelist(configIds);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => { });
},
/** 发布按钮操作 */
handlePublish (row) {
const configIds = row.id || this.ids;
this.$modal
.confirm('是否确认发布编号为"' + configIds + '"的数据项？')
.then(function () {
//这里写发布操作
return publishWhitelist(configIds);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("发布成功");
})
.catch(() => { });
},
/** 下架按钮操作 */
handleDown (row) {
const configIds = row.id || this.ids;
this.$modal
.confirm('是否确认下架编号为"' + configIds + '"的数据项？')
.then(function () {
//这里写下架操作
return soldOutWhitelist(configIds);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("下架成功");
})
.catch(() => { });
},
/** 查看详情按钮操作 */
handleDetail (row) {
if (row.type == 1) {
this.$router.push({
path: "/build/whitelistDetail",
query: {
id: row.id,
whitelistType: row.whitelistType
}
});
} else {
this.$router.push({
path: "/build/whitelistDetail",
query: {
id: row.id,
whitelistType: row.whitelistType
}
});
}
},
// 更多操作触发
handleCommand (command, row) {
switch (command) {
case "handlePublish":
this.handlePublish(row);
break;
case "handleDown":
this.handleDown(row);
break;
case "handleEdit":
this.handleEdit(row);
break;
case "handleConfig":
this.handleConfig(row);
break;
case "handleDetail":
this.handleDetail(row);
break;
case "handleDelete":
this.handleDelete(row);
break;
default:
break;
}
},
filterTagWhitelistType (value, row) {
return row.whitelistType === Number(value);
},
filterTagWhitelistMode (value, row) {
return row.whitelistMode === Number(value);
},
filterTagStatus (value, row) {
return row.status === Number(value);
},
},
};
</script>
<style lang="scss" scoped></style>

24
sf-ui/src/views/gateway/components/BaseTable.vue
View File

@ -1,19 +1,12 @@
<template>
<div>
<el-table
ref="table"
v-loading="loading"
:data="tableData"
max-height="500"
@selection-change="handleSelectionChange"
@row-click="handleRowClick"
>
<el-table v-loading="loading" :data="tableData" max-height="500" @selection-change="handleSelectionChange">
<el-table-column align="center" type="selection" width="55"/>
<template v-for="item in tableOptions">
<el-table-column
v-if="item.type === 'slot'"
:key="`${item.prop}_slot`"
:key="item.prop"
:label="item.label"
:width="item.width"
:fixed="item.fixed"
@ -72,22 +65,9 @@ export default {
created() {
},
methods: {
handleRowClick(row) {
this.$refs.table.toggleRowSelection(row);
},
handleSelectionChange(val) {
this.multipleSelection = val;
this.$emit('chooseChange', val);
},
setCheckedRows(rows) {
const ids = rows.map(item => item.id);
this.$nextTick(() => {
this.tableData.forEach((row) => {
if (ids.includes(row.id)) {
this.$refs.table.toggleRowSelection(row, true);
}
})
})
}
}
}

355
sf-ui/src/views/gateway/config/index.vue
View File

@ -1,355 +0,0 @@
<template>
<div class="app-container-flex">
<el-container>
<el-header>
<el-row type="flex" justify="space-between">
<span>网关设置</span>
<div>
<el-button
type="primary"
size="mini"
:icon="editable ? 'el-icon-close' : `el-icon-edit`"
plain
@click="handleToggle"
:disabled="loading || btnLoading"
>{{ editable ? '取消' : '编辑' }}</el-button>
<el-button
type="primary"
size="mini"
icon="el-icon-setting"
plain
@click="handleSyncConfig"
:disabled="loading || btnLoading || syncLoading"
>同步配置</el-button>
</div>
</el-row>
<el-divider class="mt10 mb10" />
</el-header>
<el-main v-loading="loading">
<el-form
ref="form"
:model="form"
:rules="rules"
label-position="left"
size="mini"
:disabled="!editable"
:validate-on-rule-change="false"
>
<el-row :gutter="40">
<!-- <el-col :span="24">
<el-form-item label="限流">
<el-switch v-model="limiting" />
</el-form-item>
</el-col> -->
<el-col :span="12">
<el-form-item label="API限流默认配置" prop="apiCurrentLimitingStatus" label-width="145px">
<template slot="label">
<span>API限流默认配置</span>
<el-popover
placement="top-start"
width="360"
trigger="hover"
>
<span slot="reference"><i class="el-icon-info ml10"></i></span>
<p class="tip">1.对开启默认限流配置开关之前的历史API不受影响；</p>
<p class="tip">2.对已经生效了的使用默认限流配置的API，在下次修改默认配置时同样会生效；</p>
<p class="tip">3.单个API限流配置会覆盖API默认限流配置</p>
</el-popover>
</template>
<el-switch v-model="form.apiCurrentLimitingStatus" active-value="1" inactive-value="0" />
</el-form-item>
<el-form-item label="限流阈值" prop="apiCurrentLimitingThreshold" label-width="106px">
<el-input-number
v-model="form.apiCurrentLimitingThreshold"
placeholder="设置限流的阈值，即允许通过的请求次数或者并发连接数"
:min="1"
:controls="false"
/>
</el-form-item>
<el-form-item label="限流时间窗口" prop="apiCurrentLimitingTimeWindow" label-width="106px">
<el-input-number
v-model="form.apiCurrentLimitingTimeWindow"
placeholder="请输入限流时间窗口"
:min="1"
:controls="false"
/>
</el-form-item>
<el-form-item label="限流响应" prop="apiCurrentLimitingDefaultResponse">
<el-input
v-model="form.apiCurrentLimitingDefaultResponse"
:autosize="{ minRows: 4, maxRows: 4}"
type="textarea"
placeholder="限流响应，JSON字符串"
/>
</el-form-item>
<el-form-item label="数据加密" prop="dataEncryptionStatus">
<el-switch v-model="form.dataEncryptionStatus" active-value="1" inactive-value="0" />
</el-form-item>
<el-form-item label="加密算法" prop="encryptionAlgorithm" label-width="80px">
<el-radio-group v-model="form.encryptionAlgorithm">
<el-radio label="ECC" border>ECC</el-radio>
<el-radio label="RSA" border>RSA</el-radio>
<el-radio label="SM2" border>国密</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item :label="`${isRSA ? '私钥' : '秘钥'}内容`" prop="privateKey" label-width="80px">
<el-input
v-model="form.privateKey"
:autosize="{ minRows: 4, maxRows: 4}"
type="textarea"
:placeholder="`请输入${isRSA ? '私钥' : '秘钥'}内容`"
/>
</el-form-item>
<template v-if="isRSA">
<el-form-item label="公钥内容" prop="publicKey" label-width="80px">
<el-input
v-model="form.publicKey"
:autosize="{ minRows: 4, maxRows: 4}"
type="textarea"
placeholder="请输入公钥内容"
/>
</el-form-item>
</template>
</el-col>
<el-col :span="12">
<el-form-item label="APP限流默认配置" prop="appCurrentLimitingStatus" label-width="150px">
<template slot="label">
<span>APP限流默认配置</span>
<el-popover
placement="top-start"
width="360"
trigger="hover"
>
<span slot="reference"><i class="el-icon-info ml10"></i></span>
<p class="tip">1.对开启默认限流配置开关之前的历史APP不受影响；</p>
<p class="tip">2.对已经生效了的使用默认限流配置的APP，在下次修改默认配置时同样会生效；</p>
<p class="tip">3.单个APP限流配置会覆盖APP默认限流配置</p>
</el-popover>
</template>
<el-switch v-model="form.appCurrentLimitingStatus" active-value="1" inactive-value="0" />
</el-form-item>
<el-form-item label="限流阈值" prop="appCurrentLimitingThreshold" label-width="106px">
<el-input-number
v-model="form.appCurrentLimitingThreshold"
placeholder="设置限流的阈值，即允许通过的请求次数或者并发连接数"
:min="1"
:controls="false"
/>
</el-form-item>
<el-form-item label="限流时间窗口" prop="appCurrentLimitingTimeWindow" label-width="106px">
<el-input-number
v-model="form.appCurrentLimitingTimeWindow"
placeholder="请输入限流时间窗口"
:min="1"
:controls="false"
/>
</el-form-item>
<el-form-item label="限流响应" prop="appCurrentLimitingDefaultResponse">
<el-input
v-model="form.appCurrentLimitingDefaultResponse"
:autosize="{ minRows: 4, maxRows: 4}"
type="textarea"
placeholder="限流响应，JSON字符串"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-main>
<el-footer v-if="editable">
<el-row type="flex" justify="end">
<el-button :disabled="btnLoading" @click="close">返回</el-button>
<el-button type="primary" :loading="btnLoading" @click="submitForm">保存</el-button>
</el-row>
</el-footer>
</el-container>
</div>
</template>
<script>
import { deepClone } from '@/utils'
import { getGatewayConfig, updateGatewayConfig, updateGatewaySync } from '@/api/gateway/config'
let CACHEFOEM;
export default {
data() {
return {
editable: false,
loading: false,
btnLoading: false,
syncLoading: false,
form: {
apiCurrentLimitingStatus: '0',
apiCurrentLimitingThreshold: void 0,
apiCurrentLimitingTimeWindow: void 0,
apiCurrentLimitingDefaultResponse: void 0,
appCurrentLimitingStatus: '0',
appCurrentLimitingThreshold: void 0,
appCurrentLimitingTimeWindow: void 0,
appCurrentLimitingDefaultResponse: void 0,
dataEncryptionStatus: '0',
encryptionAlgorithm: void 0,
privateKey: void 0,
publicKey: void 0,
},
}
},
computed: {
isRSA() {
return this.form.encryptionAlgorithm === 'RSA'
},
apiRequired() {
return this.form.apiCurrentLimitingStatus === '1'
},
appRequired() {
return this.form.appCurrentLimitingStatus === '1'
},
dataEncryRequired() {
return this.form.dataEncryptionStatus === '1'
},
rules() {
return {
// apiCurrentLimitingStatus: [
// { required: true, message: 'API限流默认配置不能为空', trigger: 'change' }
// ],
apiCurrentLimitingThreshold: [
{ required: this.apiRequired, message: '限流阈值不能为空', trigger: 'blur' }
],
apiCurrentLimitingTimeWindow: [
{ required: this.apiRequired, message: '限流时间窗口不能为空', trigger: 'blur' }
],
apiCurrentLimitingDefaultResponse: [
{ required: this.apiRequired, message: '限流响应不能为空', trigger: 'blur' }
],
// appCurrentLimitingStatus: [
// { required: true, message: 'APP限流默认配置不能为空', trigger: 'change' }
// ],
appCurrentLimitingThreshold: [
{ required: this.appRequired, message: '限流阈值不能为空', trigger: 'blur' }
],
appCurrentLimitingTimeWindow: [
{ required: this.appRequired, message: '限流时间窗口不能为空', trigger: 'blur' }
],
appCurrentLimitingDefaultResponse: [
{ required: this.appRequired, message: '限流响应不能为空', trigger: 'blur' }
],
// dataEncryptionStatus: [
// { required: true, message: '数据加密默认配置不能为空', trigger: 'change' }
// ],
encryptionAlgorithm: [
{ required: this.dataEncryRequired, message: '加密算法不能为空', trigger: 'change' }
],
privateKey: [
{ required: this.dataEncryRequired, message: '秘钥内容不能为空', trigger: 'blur' }
],
publicKey: [
{ required: this.dataEncryRequired, message: '公钥内容不能为空', trigger: 'blur' }
]
}
}
},
created() {
this.getDetail()
},
methods: {
async getDetail() {
try {
this.loading = true;
const {code, data} = await getGatewayConfig();
if (code === 200) {
Object.keys(this.form).forEach((key) => {
this.form[key] = data[key];
})
this.$nextTick(() => {
CACHEFOEM = deepClone(this.form);
})
}
this.loading = false;
} catch (error) {
this.loading = false;
}
},
async handleToggle() {
await this.validateChange();
if (this.editable) this.$refs.form.clearValidate();
this.editable = !this.editable;
},
async handleSyncConfig() {
await this.$modal.confirm('确定同步网关配置吗？', '提示', {
distinguishCancelAndClose: true,
confirmButtonText: '确定',
cancelButtonText: '取消'
})
try {
this.syncLoading = true;
const res = await updateGatewaySync();
if (res.code === 200) {
this.$modal.msgSuccess('同步配置成功')
this.getDetail();
} else {
this.$modal.msgError(res.msg || '同步配置失败')
}
this.syncLoading = false;
} catch (error) {
this.syncLoading = false;
}
},
async submitForm() {
// if (!this.apiRequired && !this.appRequired && !this.dataEncryRequired) {
// this.$modal.msgError('请至少选择一种配置')
// return
// }
await this.$refs.form.validate();
try {
this.btnLoading = true;
await updateGatewayConfig(this.form);
this.$modal.msgSuccess('保存成功')
this.getDetail();
this.btnLoading = false;
} catch (error) {
this.$modal.msgError(error.message || '保存失败')
this.btnLoading = false;
}
},
validateChange() {
if (!this.editable || JSON.stringify(this.form) === JSON.stringify(CACHEFOEM)) {
return Promise.resolve();
}
return this.$modal.confirm('当前有未保存的配置，是否放弃修改？', '提示', {
distinguishCancelAndClose: true,
confirmButtonText: '确定',
cancelButtonText: '取消'
}).then(() => {
this.form = deepClone(CACHEFOEM);
})
},
close() {
this.validateChange().then(() => {
this.$tab.closePage();
})
}
}
}
</script>
<style lang="scss" scoped>
::v-deep.el-input-number {
width: 100%;
.el-input__inner {
text-align: left;
}
}
.el-icon-info {
color: #959595;
cursor: pointer;
}
.tip {
color: #999;
font-size: 14px;
margin: 0;
}
</style>

416
sf-ui/src/views/gateway/interface/edit.vue
View File

@ -1,416 +0,0 @@
<template>
<div class="app-container-flex">
<el-container>
<el-header>
{{titleName}}
<el-divider/>
</el-header>
<el-main v-loading="loading">
<el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="right" :disabled="!editable">
<el-row :gutter="20">
<el-col :span="24">
<!-- <el-form-item label="策略类型" prop="strategyType">
<el-radio-group v-model="form.strategyType" @input="strategyTypeChange">
<el-radio
v-for="dict in dict.type.gateway_strategy_type"
:key="dict.value"
:label="dict.value"
:disabled="disabledType(dict.value)"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item> -->
</el-col>
<el-col :span="8">
<el-form-item label="接口名称" prop="interfaceName">
<el-input v-model="form.interfaceName" clearable placeholder="请输入接口名称" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="接口编码" prop="apiCode">
<el-input v-model="form.apiCode" clearable placeholder="请输入接口编码" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="接口版本" prop="version">
<el-input v-model="form.version" placeholder="标识接口的版本号，用于版本控制和管理" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="接口描述" prop="description">
<el-input v-model="form.description" type="textarea" placeholder="对接口功能、参数、返回结果等进行描述" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="接口路径" prop="interfacePath">
<el-input v-model="form.interfacePath" placeholder="接口的访问路径或URL" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="选择服务" prop="serverId">
<el-select
v-model="form.serverId"
placeholder="请选择服务"
clearable
filterable
>
<el-option
v-for="item in serverList"
:key="item.id"
:label="item.serverName"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="请求方法" prop="requestMethod">
<el-select
v-model="form.requestMethod"
placeholder="请选择服务"
clearable
filterable
>
<el-option
v-for="item in dict.type.http_request_method"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<!-- <el-row :gutter="20">
<el-col :span="8"> -->
<el-form-item label="Mock" prop="mockStatus">
<el-switch v-model="form.mockStatus" active-value="1" inactive-value="0" />
</el-form-item>
<!-- </el-col>
</el-row> -->
</el-col>
<el-col :span="8">
<el-form-item label="超时时间" prop="timeout">
<template slot="label">
<span>超时时间</span>
<el-popover
placement="top-start"
trigger="hover"
>
<span slot="reference"><i class="el-icon-info ml10"></i></span>
<p class="tip">超时时间: 1-150000ms 默认3000ms 单位ms</p>
</el-popover>
</template>
<el-input-number
v-model="form.timeout"
placeholder="请输入超时时间"
:min="1"
:max="150000"
:controls="false"
/>
</el-form-item>
</el-col>
<template v-if="form.mockStatus === '1'">
<el-col :span="24">
<el-form-item label="Mock响应" prop="mockResponse">
<el-input
v-model="form.mockResponse"
type="textarea"
placeholder="Mock响应，JSON字符串"
/>
</el-form-item>
</el-col>
</template>
<el-col :span="24">
<el-form-item label="接口文档" prop="document">
<file-upload
:value="documentList"
uploadFileUrl="/system/oss/upload"
:fileType="['doc', 'docx', 'md', 'pdf', 'txt']"
@change="handleChange"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="关联策略" prop="strategyIds">
<el-button type="primary" size="mini" @click="chooseStrategy">选择策略</el-button>
<div style="margin-top: 7px;position: relative;">
<el-tag
v-for="tag in strategyList"
style="margin: 2px 6px 2px 0;"
type="info"
:key="tag.id"
:closable="editable"
:disable-transitions="false"
@close="handleClose(tag)"
>
{{ tag.strategyName }}
</el-tag>
</div>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-main>
<el-footer class="footer">
<el-button :disabled="btnLoading" @click="close">取消</el-button>
<el-button v-if="editable" type="primary" :loading="btnLoading" @click="submitForm()">保存</el-button>
</el-footer>
</el-container>
<el-dialog title="选择策略" :visible.sync="open" :close-on-click-modal="false" width="1200px" append-to-body destroy-on-close>
<BaseSearch
:defaultValue="queryParams"
:queryOptions="queryOptions"
@query="handleQuery"
/>
<!-- v-loading="loading" -->
<BaseTable
ref="chooseTableRef"
:tableData="tableData"
:tableOptions="tableOptions"
@chooseChange="chooseChange"
>
<template #strategyType="{ row }">
<dict-tag :options="dict.type.gateway_strategy_type" :value="row.strategyType"/>
</template>
</BaseTable>
<div slot="footer" class="dialog-footer">
<el-button @click="open = false">取 消</el-button>
<el-button type="primary" @click="chooseEnd">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import BaseSearch from '@/views/gateway/components/BaseSearch';
import BaseTable from '@/views/gateway/components/BaseTable';
import { deepClone } from '@/utils'
import { getInterface, addInterface, updateInterface } from "@/api/gateway/interface";
import { bindableServerList } from '@/api/gateway/server'
import { bindableStrategyList } from '@/api/gateway/strategy'
import EventBus from '@/utils/eventBus'
// let CACHEFOEM;
export default {
components: {
BaseSearch,
BaseTable,
},
dicts: ['gateway_strategy_type', 'http_request_method'],
data() {
return {
loading: false,
btnLoading: false,
serverList: [],
form: {
id: void 0,
interfaceName: void 0,
apiCode: void 0,
interfacePath: void 0,
requestMethod: 'POST',
description: void 0, //描述(备注)
version: void 0,
document: void 0,
serverId: void 0, //服务id
strategyIds: [], //策略ids
mockStatus: '0',
timeout: void 0,
mockResponse: void 0,
},
strategyList: [],
documentList: [],
rules: {
interfaceName: [
{ required: true, message: '接口名称不能为空', trigger: 'blur' }
],
apiCode: [
{ required: true, message: '接口编码不能为空', trigger: 'blur' }
],
interfacePath: [
{ required: true, message: '接口路径不能为空', trigger: 'blur' }
],
serverId: [
{ required: true, message: '服务不能为空', trigger: 'change' }
],
requestMethod: [
{ required: true, message: '请求方法不能为空', trigger: 'change' }
],
// strategyIds: [
// { required: true, type: 'array', message: '关联策略不能为空', trigger: 'change' }
// ],
version: [
{ required: true, message: '接口版本不能为空', trigger: 'blur' }
],
mockResponse: [
{ required: true, message: 'Mock响应数据不能为空', trigger: 'blur' }
]
},
open: false,
queryParams: {},
tableData: [],
tableOptions: [
{ type: 'slot', label: '策略类型', prop: 'strategyType', width: '120' },
{ label: '策略名称', prop: 'strategyName' },
{ label: '策略描述', prop: 'description' },
],
multipleSelection: [],
}
},
computed: {
editable() {
return this.$route.query.type !== 'detail'
},
titleName() {
if (!this.editable) {
return '接口详情'
}
return this.$route.query.id ? '编辑接口' : '新增接口'
},
queryOptions() {
return [
{ label: '策略名称', prop: 'strategyName', type: 'input' },
{ label: '策略类型', prop: 'strategyType', type: 'select', dicts: this.dict.type.gateway_strategy_type },
]
}
},
created() {
this.init();
this.getDetail()
},
activated() {
this.getDetail()
},
methods: {
init() {
bindableServerList().then((list) => {
this.serverList = list;
})
},
async getDetail() {
const { id } = this.$route.query
if (id) {
this.loading = true;
try {
const { data } = await getInterface(id)
this.reset();
Object.keys(this.form).forEach(key => {
if (data[key] !== void 0) {
this.$set(this.form, key, data[key])
}
})
this.form.timeout = data.timeout ?? void 0;
this.strategyList = data.strategyList;
this.documentList = data.document ? [data.document] : [];
this.form.strategyIds = data.strategyList.map(item => item.id);
// CACHEFOEM = deepClone(data);
} catch (error) {
this.$message.error(error.message || '请求失败')
}
this.loading = false;
}
},
handleChange(files) {
this.documentList = files;
const [file] = files;
if (!file) this.form.document = null;
const {id, fileName, originalName, fileSuffix, url, size} = file;
this.form.document = { id, fileName, originalName, fileSuffix, url, size };
},
// 表单重置
reset() {
this.form = {
id: void 0,
interfaceName: void 0,
apiCode: void 0,
interfacePath: void 0,
requestMethod: 'POST',
description: void 0, //描述(备注)
version: void 0,
document: void 0,
serverId: void 0, //服务id
strategyIds: [], //策略ids
mockStatus: '0',
timeout: void 0,
mockResponse: void 0,
};
this.resetForm("form");
},
async submitForm() {
const request = this.form.id != null ? updateInterface : addInterface;
const msg = this.form.id != null ? '修改' : '新增';
await this.$refs.form.validate();
try {
const params = {
...this.form,
strategyIds: this.strategyList.map(item => item.id)
}
this.btnLoading = true;
await request(params);
this.$modal.msgSuccess(`${msg}成功`);
EventBus.$emit('reloadInterfaceList');
this.btnLoading = false;
this.close();
} catch (error) {
this.$modal.msgError(`${msg}失败`);
this.btnLoading = false;
}
},
close() {
this.$tab.closePage();
},
chooseStrategy() {
this.open = true;
this.handleQuery(this.queryParams);
},
handleQuery(form) {
bindableStrategyList(form).then((res) => {
this.tableData = res;
this.$refs.chooseTableRef.setCheckedRows(this.strategyList);
})
},
handleClose(tag) {
this.strategyList = this.strategyList.filter((item) => {
return item.id !== tag.id
})
},
chooseChange(rows) {
this.multipleSelection = rows;
},
chooseEnd() {
this.strategyList = deepClone(this.multipleSelection);
this.form.strategyIds = this.strategyList.map(item => item.id);
this.open = false;
}
}
}
</script>
<style lang="scss" scoped>
.footer {
display: flex;
align-items: center;
justify-content: flex-end;
}
::v-deep.el-select {
width: 100%;
}
::v-deep.el-input-number {
width: 100%;
.el-input__inner{
text-align: left;
}
}.el-icon-info {
color: #959595;
cursor: pointer;
}
.tip {
color: #999;
font-size: 14px;
margin: 0;
}
</style>

212
sf-ui/src/views/gateway/interface/index.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="app-container-flex">
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="接口名称" prop="interfaceName">
<el-input
@ -36,7 +36,7 @@
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb14">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
@ -69,7 +69,7 @@
v-hasPermi="['gateway:interface:remove']"
>批量删除</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-col :span="1.5">
<el-button
type="warning"
plain
@ -78,49 +78,29 @@
@click="handleExport"
v-hasPermi="['gateway:interface:export']"
>导出</el-button>
</el-col> -->
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="interfaceList" @selection-change="handleSelectionChange" height="100%">
<el-table v-loading="loading" :data="interfaceList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="关联服务" min-width="180" prop="serverName">
<template slot-scope="scope">
<el-button @click="handleServerDetail(scope.row)" type="text">{{scope.row.serverName}}</el-button>
</template>
</el-table-column>
<el-table-column label="接口名称" min-width="180" show-overflow-tooltip prop="interfaceName">
<template slot-scope="scope">
<el-button @click="handleUpdate(scope.row, 'detail')" type="text">{{scope.row.interfaceName}}</el-button>
</template>
</el-table-column>
<el-table-column label="接口编码" min-width="150" show-overflow-tooltip prop="apiCode" />
<el-table-column label="接口路径" min-width="150" show-overflow-tooltip prop="interfacePath" />
<el-table-column label="接口描述" min-width="180" show-overflow-tooltip prop="description" />
<el-table-column label="接口文档" min-width="200" show-overflow-tooltip prop="document" />
<el-table-column label="请求方式" min-width="100" prop="requestMethod">
<el-table-column label="接口ID" width="60" align="center" prop="id" />
<el-table-column label="接口名称" align="center" show-overflow-tooltip prop="interfaceName" />
<el-table-column label="接口路径" align="center" show-overflow-tooltip prop="interfacePath" />
<el-table-column label="接口描述" align="center" show-overflow-tooltip prop="description" />
<el-table-column label="接口文档" align="center" show-overflow-tooltip prop="document" />
<el-table-column label="请求方式" width="80" align="center" prop="requestMethod">
<template slot-scope="scope">
<dict-tag :options="dict.type.http_request_method" :value="scope.row.requestMethod"/>
</template>
</el-table-column>
<el-table-column label="接口版本" min-width="100" prop="version" />
<el-table-column label="接口状态" min-width="100" align="center" prop="status">
<el-table-column label="接口版本" width="100" align="center" prop="version" />
<el-table-column label="接口状态" width="80" align="center" prop="status">
<template slot-scope="scope">
<dict-tag :options="dict.type.gateway_data_status" :value="scope.row.status"/>
</template>
</el-table-column>
<!-- <el-table-column label="创建者" width="100" prop="created" /> -->
<el-table-column label="创建时间" min-width="120" prop="createTime">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<!-- <el-table-column label="更新时间" align="center" prop="updateTime" width="100">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column> -->
<el-table-column label="操作" width="180" fixed="right" class-name="small-padding fixed-width">
<el-table-column label="操作" align="center" width="150" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
@ -128,7 +108,7 @@
icon="el-icon-edit"
@click="handleStatus(scope.row)"
v-hasPermi="['gateway:interface:edit']"
>{{scope.row.status === '0' ? '启用' : '禁用' }}</el-button>
>{{scope.row === '0' ? '启用' : '禁用' }}</el-button>
<el-button
size="mini"
type="text"
@ -156,7 +136,7 @@
/>
<!-- 添加或修改接口管理对话框 -->
<!-- <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="接口名称" prop="interfaceName">
<el-input v-model="form.interfaceName" placeholder="请输入接口名称" />
@ -187,12 +167,11 @@
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog> -->
</el-dialog>
</div>
</template>
<script>
import EventBus from '@/utils/eventBus'
import { listInterface, getInterface, delInterface, addInterface, updateInterface, changeInterfaceStatus } from "@/api/gateway/interface";
export default {
@ -215,9 +194,9 @@ export default {
// 接口管理表格数据
interfaceList: [],
// 弹出层标题
// title: "",
// // 是否显示弹出层
// open: false,
title: "",
// 是否显示弹出层
open: false,
// 接口文档时间范围
daterangeCreateTime: [],
// 查询参数
@ -229,28 +208,23 @@ export default {
createTime: null,
},
// 表单参数
// form: {},
// // 表单校验
// rules: {
// interfaceName: [
// { required: true, message: "接口名称不能为空", trigger: "blur" }
// ],
// interfacePath: [
// { required: true, message: "接口路径不能为空", trigger: "blur" }
// ],
// requestMethod: [
// { required: true, message: "请求方式不能为空", trigger: "change" }
// ],
// }
form: {},
// 表单校验
rules: {
interfaceName: [
{ required: true, message: "接口名称不能为空", trigger: "blur" }
],
interfacePath: [
{ required: true, message: "接口路径不能为空", trigger: "blur" }
],
requestMethod: [
{ required: true, message: "请求方式不能为空", trigger: "change" }
],
}
};
},
created() {
this.getList();
EventBus.$on("reloadInterfaceList",this.getList);
},
beforeDestroy() {
EventBus.$off('reloadInterfaceList', this.getList);
},
methods: {
/** 查询接口管理列表 */
@ -270,31 +244,27 @@ export default {
});
},
// 取消按钮
// cancel() {
// this.open = false;
// this.reset();
// },
// // 表单重置
// reset() {
// this.form = {
// id: null,
// interfaceName: null,
// interfacePath: null,
// requestMethod: null,
// description: null,
// version: null,
// status: null,
// document: null,
// createBy: null,
// createTime: null,
// updateBy: null,
// updateTime: null
// };
// this.resetForm("form");
// },
handleServerDetail(row) {
// console.log(row.serverId, '到服务详情')
this.$router.push({path: '/gateway/server-detail', query: {id: row.serverId}})
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
interfaceName: null,
interfacePath: null,
requestMethod: null,
description: null,
version: null,
status: null,
document: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
@ -316,27 +286,19 @@ export default {
},
/** 新增按钮操作 */
handleAdd() {
// this.reset();
// this.open = true;
// this.title = "添加接口管理";
this.$router.push({path: '/gateway/interface-edit'})
this.reset();
this.open = true;
this.title = "添加接口管理";
},
/** 修改按钮操作 */
handleUpdate(row, type) {
// this.reset();
const id = row.id;
// getInterface(id).then(response => {
// this.form = response.data;
// this.open = true;
// this.title = "修改接口管理";
// });
this.$router.push({
path: '/gateway/interface-edit',
query: {
id,
type
}
})
handleUpdate(row) {
this.reset();
const id = row.id || this.ids
getInterface(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改接口管理";
});
},
/** 启用/禁用按钮操作 */
handleStatus(row) {
@ -354,30 +316,30 @@ export default {
})
},
/** 提交按钮 */
// submitForm() {
// this.$refs["form"].validate(valid => {
// if (valid) {
// if (this.form.id != null) {
// let data = Object.assign({},this.form)
// delete data.explain
// updateInterface(data).then(response => {
// this.$modal.msgSuccess("修改成功");
// this.open = false;
// this.getList();
// });
// } else {
// addInterface(this.form).then(response => {
// this.$modal.msgSuccess("新增成功");
// this.open = false;
// this.getList();
// });
// }
// }
// });
// },
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
let data = Object.assign({},this.form)
delete data.explain
updateInterface(data).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addInterface(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row?.id || this.ids;
const ids = row.id || this.ids;
this.$modal.confirm('是否确认删除接口管理编号为"' + ids + '"的数据项？').then(function() {
return delInterface(ids);
}).then(() => {

220
sf-ui/src/views/gateway/route/edit.vue
View File

@ -1,220 +0,0 @@
<template>
<div class="app-container-flex">
<el-container>
<el-header>
{{titleName}}
<el-divider/>
</el-header>
<el-main>
<el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="right" :disabled="!editable">
<el-row :gutter="20">
<el-col :span="16">
<el-form-item label="路由名称" prop="routeName">
<el-input v-model="form.routeName" placeholder="路由规则的名称" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="后端协议类型" prop="requestProtocol">
<el-select v-model="form.requestProtocol">
<el-option label="HTTP" value="HTTP" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="路由方式" prop="routeType">
<el-radio-group v-model="form.routeType" @change="handleRouteTypeChange">
<el-radio label="WEIGHT_ROUTE">权重路由</el-radio>
<el-radio label="HEADER_ROUTE">请求头路由</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="规则详情" prop="routeContent">
<EditTable
ref="editTable"
:editable="editable"
:routeType="form.routeType"
:value="form.routeContent"
:loading="tableLoading"
@validate="$refs.form.validateField('routeContent')"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="路由状态探活" prop="routeStatusActiveMonitoring">
<el-switch
v-model="form.routeStatusActiveMonitoring"
active-value="1"
inactive-value="0">
</el-switch>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="路径path" prop="routeActiveMonitoringPath">
<el-input v-model="form.routeActiveMonitoringPath" placeholder="默认'/'" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="超时时间" prop="routeActiveMonitoringTimeout">
<el-input-number
v-model="form.routeActiveMonitoringTimeout"
placeholder="请输入超时时间"
:min="1"
:controls="false"
/>
<span class="ml10">ms</span>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-main>
<el-footer class="footer">
<el-button :disabled="btnLoading" @click="close">取消</el-button>
<el-button v-if="editable" :loading="btnLoading" type="primary" @click="submitForm">保存</el-button>
</el-footer>
</el-container>
</div>
</template>
<script>
import EventBus from '@/utils/eventBus';
import { deepClone } from '@/utils'
import { addRoute, getRoute, updateRoute } from "@/api/gateway/route";
import EditTable from './editTable.vue'
// 缓存表单数据
let CACHEFOEM = {};
export default {
components: { EditTable },
data() {
const checkRouteContent = async(rule, value, callback) => {
try {
await this.$refs.editTable.validtorTable()
callback()
} catch (error) {
callback(error)
}
};
return {
tableLoading: false,
btnLoading: false,
form: {
routeName: '',
requestProtocol: 'HTTP',
routeType: 'WEIGHT_ROUTE',
routeContent: [
// {
// weight: 0,
// serverAddress: '',
// headerKey: '',
// headerValues: '',
// matchType: '',
// }
],
routeStatusActiveMonitoring: '1', // （0停用 1启用）
routeActiveMonitoringPath: '/',
routeActiveMonitoringTimeout: 3000,
},
rules: {
routeName: [
{ required: true, message: '路由名称不能为空', trigger: 'blur' }
],
routeContent:[
{ required: true, type: 'array', message: '规则详情不能为空' },
{ validator: checkRouteContent, trigger: 'blur' }
]
}
}
},
computed: {
editable() {
return this.$route.query.type !== 'detail'
},
titleName() {
if (!this.editable) {
return '路由详情'
}
return this.$route.query.id ? '编辑路由' : '新增路由'
},
newRow() {
const weightRow = { weight: 0, serverAddress: '' };
const headerRow = { headerKey: '', headerValues: [], matchType: '' };
return this.form.routeType === 'WEIGHT_ROUTE' ? weightRow : headerRow;
}
},
created() {
this.getDetail()
},
activated() {
this.getDetail()
},
methods: {
getDetail() {
CACHEFOEM = {};
const { id } = this.$route.query
if (id) {
getRoute(id).then(res => {
const { routeContent, ...args } = res.data;
this.form = {
...args,
routeContent: JSON.parse(routeContent)
};
CACHEFOEM = deepClone(this.form)
})
}
},
handleRouteTypeChange(val) {
this.tableLoading = true;
if (val === CACHEFOEM.routeType) {
this.form.routeContent = [...CACHEFOEM.routeContent];
} else {
this.form.routeContent = [];
}
this.$refs.form.clearValidate('routeContent');
this.$nextTick(() => {
this.tableLoading = false;
})
},
handleAddRow() {
this.form.routeContent.unshift({...this.newRow})
},
handleDeleteRow(index) {
this.form.routeContent.splice(index, 1)
},
async submitForm() {
const request = this.form.id != null ? updateRoute : addRoute;
const msg = this.form.id != null ? '修改' : '新增';
await this.$refs.form.validate();
try {
this.btnLoading = true
await request(this.form);
this.btnLoading = false;
this.$modal.msgSuccess(`${msg}成功`);
EventBus.$emit('reloadRouteList');
this.close();
} catch (error) {
this.btnLoading = false;
this.$modal.msgError(`${msg}失败`);
}
},
close() {
// this.$refs.form.resetFields();
this.$tab.closePage();
},
}
}
</script>
<style lang="scss" scoped>
.footer {
display: flex;
align-items: center;
justify-content: flex-end;
}
::v-deep.el-select {
width: 100%;
}
::v-deep.el-input-number .el-input__inner{
text-align: left;
}
</style>

277
sf-ui/src/views/gateway/route/editTable.vue
View File

@ -1,277 +0,0 @@
<template>
<div>
<el-row type="flex" justify="end">
<el-button
v-if="editable"
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAddRow"
>新增一行</el-button>
</el-row>
<el-form :model="formModel" ref="form" class="table-form" @validate="validateForm">
<el-table v-loading="loading" :data="formModel.tableData" style="margin-top: 10px;" max-height="400" border>
<template v-if="routeType === 'WEIGHT_ROUTE'">
<el-table-column prop="weight" width="240" key="weight">
<template slot="header">
<span class="required-asterisk">流量占比(%)</span>
</template>
<template slot-scope="{row, $index}">
<template v-if="!editable">{{ row.weight }}</template>
<template v-else>
<el-form-item
:prop="`tableData[${$index}].weight`"
:rules="[
{ required: true, message: '流量占比不能为空', trigger: 'blur' },
{ type: 'number', message: '流量占比必须为数字值', trigger: 'blur' }
]"
>
<el-input-number
v-model="tableData[$index].weight"
placeholder="请输入流量占比"
:min="0"
:max="100"
:controls="false"
/>
</el-form-item>
</template>
</template>
</el-table-column>
</template>
<template v-else>
<el-table-column prop="headerKey" key="headerKey">
<template slot="header">
<span class="required-asterisk">参数名</span>
</template>
<template slot-scope="{row, $index}">
<template v-if="!editable">{{ row.headerKey }}</template>
<template v-else>
<el-form-item
:prop="`tableData[${$index}].headerKey`"
:rules="[
{ required: true, message: '参数名不能为空', trigger: 'blur' },
{ pattern: /^[a-zA-Z0-9\_]+$/, message: '参数名只能是字母数字和下划线组合', trigger: 'blur' }
]"
>
<el-input v-model="tableData[$index].headerKey" clearable placeholder="请输入参数名"/>
</el-form-item>
</template>
</template>
</el-table-column>
<el-table-column prop="matchType" label="匹配方式" key="matchType">
<template slot="header">
<span class="required-asterisk">匹配方式</span>
</template>
<template slot-scope="{row, $index}">
<template v-if="!editable">{{ {'EQ': '完全匹配', 'IN': '模式匹配'}[row.matchType] }}</template>
<template v-else>
<el-form-item
:prop="`tableData[${$index}].matchType`"
:rules="{
required: true, message: '匹配方式不能为空', trigger: 'change'
}"
>
<el-select v-model="value[$index].matchType" @change="$refs.form.validateField(`tableData[${$index}].headerValues`)">
<el-option label="完全匹配" value="EQ" />
<el-option label="模式匹配" value="IN" />
</el-select>
</el-form-item>
</template>
</template>
</el-table-column>
<el-table-column prop="headerValues" label="参数值" key="headerValues">
<template slot="header">
<span class="required-asterisk">参数值</span>
<el-tooltip class="item" effect="dark" placement="top">
<div slot="content">完全匹配为精准匹配，只能匹配一个参数值；<br/>IN 模糊匹配支持输入多个值，输入单个值后<br/>需使用分号分隔第二行信息</div>
<i class="el-icon-info ml10"></i>
</el-tooltip>
</template>
<template slot-scope="{row, $index}">
<template v-if="!editable">{{ row.headerValues.join(';') }}</template>
<template v-else>
<el-form-item
:prop="`tableData[${$index}].headerValues`"
:rules="{
validator: (rule, value, callback) => {
validatorHeaderValues($index, value, callback)
}, trigger: 'blur'
}"
>
<el-input
v-if="tableData[$index].headerValues"
:value="tableData[$index].headerValues.join(';')"
@input="tableData[$index].headerValues = $event.split(';')"
placeholder="请输入参数值"
clearable
/>
</el-form-item>
</template>
</template>
</el-table-column>
</template>
<el-table-column prop="serverAddress" label="服务地址" key="serverAddress">
<template slot="header">
<span class="required-asterisk">服务地址</span>
</template>
<template slot-scope="{row, $index}">
<template v-if="!editable">{{ row.serverAddress }}</template>
<template v-else>
<el-form-item
:prop="`tableData[${$index}].serverAddress`"
:rules="[
{ required: true, message: '服务地址不能为空', trigger: 'blur' },
{ pattern: /^(https?:\/\/)?((?:[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?\.)+[a-z0-9][a-z0-9-]{0,61}[a-z0-9]|localhost|\d{1,3}(?:\.\d{1,3}){3})(?::\d+)?$/, message: '请输入正确的服务地址', trigger: 'blur' }
]"
>
<el-input
v-model="tableData[$index].serverAddress"
placeholder="请输入服务地址"
clearable
/>
</el-form-item>
</template>
</template>
</el-table-column>
<el-table-column v-if="editable" prop="address" label="操作" width="80">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDeleteRow(scope.$index)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
</el-form>
</div>
</template>
<script>
export default {
name: 'WeightTable',
props: {
editable: {
type: Boolean,
default: true
},
routeType: {
type: String,
default: 'WEIGHT_ROUTE'
},
value: {
type: Array,
default: () => {
return []
}
},
loading: {
type: Boolean,
default: false
}
},
data() {
return {
}
},
computed: {
tableData: {
get() {
return this.value
},
set(val) {
this.$emit('input', val)
}
},
formModel() {
return {
tableData: this.tableData
}
}
},
methods: {
// 校验表格数据完整性（流量占比之和不为100、未填写完整、表格数据为空）
validtorTable() {
return new Promise((resolve, reject) => {
if (this.tableData.length === 0) {
reject(new Error('请添加规则详情'))
}
const hasEmty = this.tableData.some(item => {
const values = this.routeType === 'WEIGHT_ROUTE' ? ['weight', 'serverAddress'] : ['headerKey', 'headerValues', 'matchType', 'serverAddress'];
return values.some(key => {
return item[key] === '' || item[key] === null || item[key] === void 0
})
})
if (hasEmty) {
reject(new Error('请填写完整'))
}
if (this.routeType === 'WEIGHT_ROUTE') {
const weightCount = this.tableData.reduce((acc, cur) => {
return acc + cur.weight;
}, 0);
if (weightCount !== 100) {
reject(new Error('流量占比之和必须为100'))
}
}
resolve()
})
},
validatorHeaderValues(index, value, callback) {
if (value.length === 0) {
callback(new Error('参数值不能为空'))
}
const row = this.tableData[index];
if (row.matchType === 'EQ' && value.length > 1) {
callback(new Error('完全匹配为精准匹配，只能匹配一个参数值'))
}
callback()
},
handleAddRow() {
const weightRow = { weight: 0, serverAddress: '' };
const headerRow = { headerKey: '', headerValues: [], matchType: '' };
const newRow = this.routeType === 'WEIGHT_ROUTE' ? weightRow : headerRow;
this.tableData.unshift(newRow)
},
handleDeleteRow(index) {
this.tableData.splice(index, 1)
this.$emit('validate')
},
// 校验数据准确性，在输入时即时校验，不暴露方法
// validtorFrom() {
// return new Promise(async(resolve, reject) => {
// try {
// await this.$refs.form.validate();
// resolve()
// } catch (error) {
// reject(new Error('请填写完整'))
// }
// })
// },
validateForm(key, res) {
this.$emit('validate')
}
}
}
</script>
<style lang="scss" scoped>
// ::v-deep.el-form-item {
// }
.table-form {
::v-deep.el-form-item {
margin-bottom: 22px;
&.is-error .el-input__inner {
border-color: #ff4949;
}
.el-input__inner {
border-color: #DCDFE6;
}
}
}
::v-deep.el-input-number .el-input__inner{
text-align: left;
}
</style>

178
sf-ui/src/views/gateway/route/index.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="app-container-flex">
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="路由名称" prop="routerName">
<el-input
@ -10,14 +10,12 @@
/>
</el-form-item>
<el-form-item label="请求方式" prop="requestMethod">
<el-select v-model="queryParams.requestMethod" clearable placeholder="请选择请求方式">
<el-option
v-for="dict in dict.type.http_request_method"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
<el-input
v-model="queryParams.requestMethod"
placeholder="请输入请求方式"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="创建人" prop="createBy">
<el-input
@ -44,7 +42,7 @@
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb14">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
@ -55,17 +53,17 @@
v-hasPermi="['gateway:route:add']"
>新增</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleDetail"
@click="handleUpdate"
v-hasPermi="['gateway:route:edit']"
>修改</el-button>
</el-col> -->
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
@ -75,9 +73,9 @@
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['gateway:route:remove']"
>批量删除</el-button>
>删除</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-col :span="1.5">
<el-button
type="warning"
plain
@ -86,47 +84,36 @@
@click="handleExport"
v-hasPermi="['gateway:route:export']"
>导出</el-button>
</el-col> -->
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="routeList" @selection-change="handleSelectionChange" height="100%">
<el-table v-loading="loading" :data="routeList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="路由名称" prop="routeName" min-width="150">
<el-table-column label="ID" align="center" prop="id" />
<el-table-column label="路由名称" align="center" prop="routerName" />
<el-table-column label="请求路径" align="center" prop="requestPath" />
<el-table-column label="请求方式" align="center" prop="requestMethod">
<template slot-scope="scope">
<el-button @click="handleDetail(scope.row, 'detail')" type="text">{{scope.row.routeName}}</el-button>
<dict-tag :options="dict.type.http_request_method" :value="scope.row.requestMethod"/>
</template>
</el-table-column>
<el-table-column label="路由方式" prop="routeType" min-width="100">
<template slot-scope="scope">
{{{'WEIGHT_ROUTE': '权重路由', 'HEADER_ROUTE': '请求头路由'}[scope.row.routeType]}}
</template>
</el-table-column>
<el-table-column label="协议" prop="requestProtocol" min-width="100" />
<el-table-column label="路由活跃状态" align="center" prop="routeActiveStatus" min-width="100">
<template slot-scope="scope">
<!-- 0=探活未开启，1=状态获取中，2=正常，3=异常 -->
<dict-tag :options="dict.type.route_active_status" :value="scope.row.routeActiveStatus"/>
</template>
</el-table-column>
<!-- <el-table-column label="创建人" align="center" prop="created" width="120" /> -->
<el-table-column label="创建时间" prop="createTime" min-width="100">
<el-table-column label="请求参数，json格式" align="center" prop="requestParameter" />
<el-table-column label="服务地址" align="center" prop="serverAddress" />
<el-table-column label="服务器端口" align="center" prop="serverPort" />
<el-table-column label="创建人" align="center" prop="createBy" />
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<!-- <el-table-column label="更新时间" prop="updateTime" width="120">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column> -->
<el-table-column label="操作" fixed="right" width="150" class-name="small-padding fixed-width">
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleDetail(scope.row)"
@click="handleUpdate(scope.row)"
v-hasPermi="['gateway:route:edit']"
>修改</el-button>
<el-button
@ -147,16 +134,42 @@
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改路由管理对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="路由名称" prop="routerName">
<el-input v-model="form.routerName" placeholder="请输入路由名称" />
</el-form-item>
<el-form-item label="请求路径" prop="requestPath">
<el-input v-model="form.requestPath" placeholder="请输入请求路径" />
</el-form-item>
<el-form-item label="请求方式" prop="requestMethod">
<el-input v-model="form.requestMethod" placeholder="请输入请求方式" />
</el-form-item>
<el-form-item label="请求参数，json格式" prop="requestParameter">
<el-input v-model="form.requestParameter" placeholder="请输入请求参数，json格式" />
</el-form-item>
<el-form-item label="服务地址" prop="serverAddress">
<el-input v-model="form.serverAddress" placeholder="请输入服务地址" />
</el-form-item>
<el-form-item label="服务器端口" prop="serverPort">
<el-input v-model="form.serverPort" placeholder="请输入服务器端口" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import EventBus from '@/utils/eventBus'
import { listRoute, getRoute, delRoute, addRoute, updateRoute } from "@/api/gateway/route";
export default {
name: "Route",
dicts: ['http_request_method', 'route_active_status'],
data() {
return {
// 遮罩层
@ -188,15 +201,24 @@ export default {
createBy: null,
createTime: null,
},
// 表单参数
form: {},
// 表单校验
rules: {
routerName: [
{ required: true, message: "路由名称不能为空", trigger: "blur" }
],
requestPath: [
{ required: true, message: "请求路径不能为空", trigger: "blur" }
],
requestMethod: [
{ required: true, message: "请求方式不能为空", trigger: "blur" }
],
}
};
},
created() {
this.getList();
EventBus.$on("reloadRouteList",this.getList);
},
befoueDestroy() {
EventBus.$off('reloadRouteList', this.getList);
},
methods: {
/** 查询路由管理列表 */
@ -215,6 +237,28 @@ export default {
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
routerName: null,
requestPath: null,
requestMethod: null,
requestParameter: null,
serverAddress: null,
serverPort: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
@ -235,21 +279,45 @@ export default {
},
/** 新增按钮操作 */
handleAdd() {
this.$router.push({path: '/gateway/route-edit'});
this.reset();
this.open = true;
this.title = "添加路由管理";
},
/** 修改按钮操作 */
handleDetail(row, type) {
this.$router.push({
path: '/gateway/route-edit',
query: {
id: row.id,
type,
handleUpdate(row) {
this.reset();
const id = row.id || this.ids
getRoute(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改路由管理";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
let data = Object.assign({},this.form)
delete data.explain
updateRoute(data).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addRoute(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row?.id || this.ids;
const ids = row.id || this.ids;
this.$modal.confirm('是否确认删除路由管理编号为"' + ids + '"的数据项？').then(function() {
return delRoute(ids);
}).then(() => {

2
sf-ui/src/views/gateway/server/config/interfaceConfig.vue
View File

@ -62,7 +62,7 @@ export default {
tableOptions: [
{ label: '接口ID', prop: 'id', width: '80' },
{ label: '接口名称', prop: 'interfaceName' },
{ label: '接口路径', prop: 'interfacePath' },
{ label: '接口路劲', prop: 'interfacePath' },
{ label: '接口描述', prop: 'description' },
{ label: '接口版本', prop: 'version', width: '120' },
{ type: 'slot', prop: 'action', label: '操作', fixed: 'right', width: '100px' }

112
sf-ui/src/views/gateway/server/detail.vue
View File

@ -1,112 +0,0 @@
<template>
<div class="app-container-flex" v-loading="loading">
<el-container>
<el-header>
服务详情
<el-divider/>
</el-header>
<el-main>
<el-descriptions title="基础信息" border>
<el-descriptions-item label="服务名称">{{ detail.serverName }}</el-descriptions-item>
<el-descriptions-item label="服务模式">
<dict-tag :options="dict.type.gateway_service_model" :value="detail.serviceModel"/>
</el-descriptions-item>
<el-descriptions-item label="服务地址">{{ detail.serverAddress }}</el-descriptions-item>
<el-descriptions-item label="服务状态">
<dict-tag :options="dict.type.gateway_data_status" :value="detail.status"/>
</el-descriptions-item>
<el-descriptions-item label="服务备注">{{ detail.remark }}</el-descriptions-item>
</el-descriptions>
<!-- <el-divider/> -->
<div class="el-descriptions__header" style="margin-top: 40px;">
<div class="el-descriptions__title">接口信息</div>
</div>
<el-table
:data="detail.interfaceInfoList"
style="width: 100%;margin-bottom: 20px;"
row-key="id"
border
>
<el-table-column prop="interfaceName" label="接口名称">
<template slot-scope="{row}">
<el-button
@click="handleInterfaceDetail(row.id)"
type="text"
>{{row.interfaceName}}</el-button>
</template>
</el-table-column>
<el-table-column prop="interfacePath" label="接口路径" />
<el-table-column prop="description" label="接口描述" />
<el-table-column prop="strategyList" label="关联策略" width="300">
<template slot-scope="scope">
<el-button
v-for="item in scope.row.strategyList"
:key="item.id"
@click="handleStrategyDetail(item.id)"
type="text"
>{{item.strategyName}}</el-button>
</template>
</el-table-column>
<el-table-column prop="version" label="接口版本" width="100" />
<el-table-column prop="requestMethod" label="请求方式" width="80">
<template slot-scope="scope">
<dict-tag :options="dict.type.http_request_method" :value="scope.row.requestMethod"/>
</template>
</el-table-column>
</el-table>
</el-main>
</el-container>
</div>
</template>
<script>
import { getServer } from "@/api/gateway/server";
export default {
dicts: ['gateway_service_model', 'gateway_data_status', 'http_request_method'],
data() {
return {
loading: false,
detail: {}
}
},
created() {
this.getDetail();
},
methods: {
async getDetail() {
this.loading = true;
const { id } = this.$route.query;
try {
const {dode, data} = await getServer(id);
this.detail = data;
} catch (error) {
}
this.loading = false;
},
handleInterfaceDetail(id) {
this.$router.push({
path: '/gateway/interface-edit',
query: {
id: id,
type: 'detail'
}
})
},
handleStrategyDetail(id) {
this.$router.push({
path: '/gateway/strategy-edit',
query: {
id: id,
type: 'detail'
}
})
},
}
}
</script>
<style lang="scss" scoped>
</style>

181
sf-ui/src/views/gateway/server/index.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="app-container-flex">
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="服务名称" prop="serverName">
<el-input
@ -44,7 +44,7 @@
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb14">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
@ -63,7 +63,7 @@
size="mini"
:disabled="multiple"
@click="handleStatus()"
>批量启用</el-button>
>批量发布</el-button>
</el-col>
<el-col :span="1.5">
<el-button
@ -76,7 +76,7 @@
v-hasPermi="['gateway:server:remove']"
>批量删除</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-col :span="1.5">
<el-button
type="warning"
plain
@ -85,63 +85,56 @@
@click="handleExport"
v-hasPermi="['gateway:server:export']"
>导出</el-button>
</el-col> -->
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="serverList" @selection-change="handleSelectionChange" height="100%">
<el-table v-loading="loading" :data="serverList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column label="服务ID" width="60" align="center" prop="id" /> -->
<el-table-column label="服务名称" align="left" show-overflow-tooltip prop="serverName">
<template slot-scope="scope">
<el-button @click="handleDetail(scope.row)" type="text">{{scope.row.serverName}}</el-button>
</template>
</el-table-column>
<el-table-column label="服务地址" align="left" show-overflow-tooltip prop="serverAddress" />
<el-table-column label="备注" align="left" show-overflow-tooltip prop="remark" />
<el-table-column label="服务ID" width="60" align="center" prop="id" />
<el-table-column label="服务名称" align="center" show-overflow-tooltip prop="serverName" />
<el-table-column label="服务地址" align="center" show-overflow-tooltip prop="serverAddress" />
<el-table-column label="备注" align="center" show-overflow-tooltip prop="remark" />
<!-- <el-table-column label="接口版本" align="center" prop="version" /> -->
<el-table-column label="服务状态" width="100" align="center" prop="status">
<template slot-scope="scope">
<dict-tag :options="dict.type.gateway_data_status" :value="scope.row.status"/>
</template>
</el-table-column>
<el-table-column label="创建者" width="150" align="left" prop="created" />
<el-table-column label="创建时间" align="left" prop="createTime" width="150">
<el-table-column label="创建者" width="100" align="center" prop="createBy" />
<el-table-column label="创建时间" align="center" prop="createTime" width="100">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="更新时间" align="left" prop="updateTime" width="150">
<el-table-column label="更新时间" align="center" prop="updateTime" width="100">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="left" width="180" class-name="small-padding fixed-width">
<el-table-column label="操作" align="center" width="200" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['gateway:server:edit']"
>修改</el-button>
<!-- <el-button
<el-button
size="mini"
type="text"
@click="handleConfig(scope.row)"
v-hasPermi="['gateway:server:config']"
>服务配置</el-button> -->
>服务配置</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleStatus(scope.row)"
v-hasPermi="['gateway:server:config']"
>{{scope.row.status == '1' ? '停止' : '启用'}}</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['gateway:server:remove']"
>删除</el-button>
@ -158,65 +151,21 @@
/>
<!-- 添加或修改服务管理对话框 -->
<el-dialog :title="title" :visible.sync="open" class="server-dialog" width="600px" append-to-body destroy-on-close>
<el-form ref="form" :model="form" :rules="rules" label-width="110px">
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="服务名称" prop="serverName">
<el-input
v-model="form.serverName"
clearable
placeholder="请输入服务名称"
maxlength="50"
show-word-limit
/>
<el-input v-model="form.serverName" placeholder="请输入服务名称" />
</el-form-item>
<el-form-item label="服务类型" prop="serviceType">
<el-select v-model="form.serviceType" clearable placeholder="请选择服务类型">
<el-option v-for="item in dict.type.gateway_service_type" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<!-- <el-radio-group v-model="form.serviceType">
<el-radio v-for="item in dict.type.gateway_service_type" :key="item.value" :label="item.value">{{item.label}}</el-radio>
</el-radio-group> -->
</el-form-item>
<el-form-item label="服务模式" prop="serviceModel">
<el-radio-group v-model="form.serviceModel" @change="handleServiceModelChange">
<el-radio v-for="item in dict.type.gateway_service_model" :key="item.value" :label="item.value">{{item.label}}</el-radio>
<!-- <el-radio label="ROUTE">路由模式</el-radio> -->
</el-radio-group>
</el-form-item>
<el-form-item v-if="form.serviceModel === 'NORMAL'" label="服务地址" prop="serverAddress" key="serverAddress">
<el-input v-model="form.serverAddress" clearable placeholder="请输入服务地址" />
</el-form-item>
<el-form-item v-if="form.serviceModel === 'ROUTE'" label="路由规则" prop="routeId" key="routeId">
<el-select v-model="form.routeId" clearable placeholder="请选择路由规则" style="width: 100%">
<el-option v-for="item in routeList" :key="item.id" :label="item.routeName" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="超时时间" prop="timeout">
<template slot="label">
<span>超时时间</span>
<el-popover
placement="top-start"
trigger="hover"
>
<span slot="reference"><i class="el-icon-info ml10"></i></span>
<p class="tip">超时时间: 1-150000ms 默认3000ms 单位ms</p>
</el-popover>
</template>
<el-input-number
v-model="form.timeout"
placeholder="请输入超时时间"
:min="1"
:max="150000"
:controls="false"
/>
<el-form-item label="服务地址" prop="serverAddress">
<el-input v-model="form.serverAddress" placeholder="请输入服务地址" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" type="textarea" placeholder="请输入备注" />
<el-input v-model="form.remark" placeholder="请输入备注" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
@ -224,10 +173,10 @@
<script>
import { listServer, getServer, delServer, addServer, updateServer, changeServerStatus } from "@/api/gateway/server";
import { getBindableList } from "@/api/gateway/route"
export default {
name: "Server",
dicts: ['gateway_data_status', 'gateway_service_model', 'gateway_service_type'],
dicts: ['gateway_data_status'],
data() {
return {
// 遮罩层
@ -256,7 +205,6 @@ export default {
pageSize: 10,
serverName: null,
serverAddress: null,
remark: null,
status: null,
createBy: null,
createTime: null,
@ -266,44 +214,18 @@ export default {
// 表单校验
rules: {
serverName: [
// 服务名只能以字母或下划线开头，只能包含字母、数字、下划线，不超过50个字符
{ required: true, message: "服务名称不能为空", trigger: "blur" },
{ min: 0, max: 50, message: "长度在 0 到 50 个字符" },
{ pattern: /^[a-zA-Z_][a-zA-Z0-9_]*$/, message: "只能以字母或下划线开头，只能包含字母、数字、下划线", trigger: "blur" }
],
serviceType: [
{ required: true, message: "服务类型不能为空", trigger: "change" },
{ required: true, message: "服务名称不能为空", trigger: "blur" }
],
serverAddress: [
{ required: true, message: "服务地址不能为空", trigger: "blur" },
{
pattern: /^(https?:\/\/)?((?:[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?\.)+[a-z0-9][a-z0-9-]{0,61}[a-z0-9]|localhost|\d{1,3}(?:\.\d{1,3}){3})(?::\d+)?$/,
message: "请输入正确的服务地址",
trigger: "blur",
}
{ required: true, message: "服务地址不能为空", trigger: "blur" }
],
routeId: [
{ required: true, message: "路由规则不能为空", trigger: "change" },
]
},
routeList: [],
}
};
},
created() {
this.getList();
this.getRouteList();
},
methods: {
handleServiceModelChange(val) {
if (val === 'ROUTE') {
this.getRouteList();
}
},
async getRouteList() {
const data = await getBindableList();
this.routeList = data;
},
/** 查询服务管理列表 */
getList() {
this.loading = true;
@ -330,11 +252,7 @@ export default {
this.form = {
id: null,
serverName: null,
serviceType: 'SAC',
serviceModel: 'NORMAL',
serverAddress: null,
timeout: void 0,
routeId: null,
remark: null,
version: null,
status: null,
@ -367,17 +285,7 @@ export default {
handleAdd() {
this.reset();
this.open = true;
this.title = "新增服务";
},
/** 详情按钮操作 */
handleDetail(row) {
const { id } = row;
this.$router.push({
path: '/gateway/server-detail',
query: {
id: row.id
}
})
this.title = "添加服务管理";
},
/** 修改按钮操作 */
handleUpdate(row) {
@ -385,9 +293,8 @@ export default {
const id = row.id || this.ids
getServer(id).then(response => {
this.form = response.data;
this.form.timeout = response.data?.timeout ?? void 0;
this.open = true;
this.title = "修改服务";
this.title = "修改服务管理";
});
},
/** 服务配置 */
@ -423,7 +330,7 @@ export default {
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row?.id || this.ids.join(",");
const ids = row.id || this.ids.join(",");
this.$modal.confirm('是否确认删除服务管理编号为"' + ids + '"的数据项？').then(function() {
return delServer(ids);
}).then(() => {
@ -443,6 +350,7 @@ export default {
status: status
}
changeServerStatus(params).then((res) => {
console.log(res)
if (res.code === 200) {
this.getList();
this.$modal.msgSuccess(row.status === '1' ? "停用成功" : "启用成功");
@ -460,28 +368,3 @@ export default {
}
};
</script>
<style lang="scss" scoped>
.el-select {
width: 100%;
}
::v-deep.el-input-number {
width: 100%;
.el-input__inner{
text-align: left;
}
}
.server-dialog {
::v-deep.el-form {
margin-right: 30px;
}
}
.el-icon-info {
color: #959595;
cursor: pointer;
}
.tip {
color: #999;
font-size: 14px;
margin: 0;
}
</style>

350
sf-ui/src/views/gateway/strategy/edit.vue
View File

@ -1,350 +0,0 @@
<template>
<div class="app-container-flex">
<el-container>
<el-header>
{{titleName}}
<el-divider/>
</el-header>
<el-main v-loading="loading">
<el-form ref="form" :model="form" :rules="rules" label-width="130px" label-position="right" :disabled="!editable">
<el-row>
<el-col :span="24">
<el-form-item label="策略类型" prop="strategyType">
<el-radio-group v-model="form.strategyType" @input="strategyTypeChange">
<el-radio
v-for="dict in dict.type.gateway_strategy_type"
:key="dict.value"
:label="dict.value"
:disabled="disabledType(dict.value)"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="策略名称" prop="strategyName">
<el-input v-model="form.strategyName" clearable placeholder="描述性的名称，用于识别和管理该策略" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="策略描述" prop="description">
<el-input v-model="form.description" type="textarea" placeholder="请输入策略描述" />
</el-form-item>
</el-col>
<!-- 认证策略 start -->
<!-- 认证策略 end -->
<!-- 鉴权策略 start -->
<!-- 鉴权策略 end -->
<!-- 限流策略 start-->
<template v-if="form.strategyType === 'CURRENT_LIMITING'">
<el-col :span="8">
<el-form-item label="限流阈值" prop="currentLimitingThreshold">
<template slot="label">
<span>限流阈值</span>
<el-popover
placement="top-start"
width="280"
trigger="hover"
>
<span slot="reference"><i class="el-icon-info ml10"></i></span>
<p class="tip">设置限流的阈值，即允许通过的请求次数或者并发连接数</p>
</el-popover>
</template>
<el-input-number
v-model="form.currentLimitingThreshold"
placeholder="请输入限流阈值"
:min="0"
:controls="false"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="限流时间窗口" prop="currentLimitingTimeWindow">
<template slot="label">
<span>限流时间窗口</span>
<el-popover
placement="top-start"
trigger="hover"
>
<span slot="reference"><i class="el-icon-info ml10"></i></span>
<p class="tip">限流时间窗口，单位s</p>
</el-popover>
</template>
<el-input-number
v-model="form.currentLimitingTimeWindow"
placeholder="请输入限流时间窗口"
:min="0"
:controls="false"
/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="限流响应" prop="currentLimitingResponse">
<template slot="label">
<span>限流响应</span>
<el-popover
placement="top-start"
trigger="hover"
>
<span slot="reference"><i class="el-icon-info ml10"></i></span>
<p class="tip">限流响应，JSON字符串</p>
</el-popover>
</template>
<el-input
v-model="form.currentLimitingResponse"
:autosize="{ minRows: 4}"
type="textarea"
placeholder="请输入限流响应"
/>
</el-form-item>
</el-col>
</template>
<!-- 限流策略 end -->
<!-- 熔断策略 start -->
<template v-if="form.strategyType === 'CIRCUIT_BREAKER'">
<el-col :span="8">
<el-form-item label="熔断阈值" prop="circuitBreakerThreshold">
<el-input-number
v-model="form.circuitBreakerThreshold"
placeholder="请输入熔断阈值"
:min="0"
:controls="false"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="熔断时间窗口" prop="circuitBreakerTimeWindow">
<template slot="label">
<span>熔断时间窗口</span>
<el-popover
placement="top-start"
trigger="hover"
>
<span slot="reference"><i class="el-icon-info ml10"></i></span>
<p class="tip">调用失败阈值对应的时间窗口，单位s</p>
</el-popover>
</template>
<el-input-number
v-model="form.circuitBreakerTimeWindow"
placeholder="请输入熔断时间窗口"
:min="0"
:controls="false"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="恢复时间间隔" prop="circuitBreakerRecoveryInterval">
<template slot="label">
<span>恢复时间间隔</span>
<el-popover
placement="top-start"
trigger="hover"
>
<span slot="reference"><i class="el-icon-info ml10"></i></span>
<p class="tip">熔断后的恢复时间间隔，单位s</p>
</el-popover>
</template>
<el-input-number
v-model="form.circuitBreakerRecoveryInterval"
placeholder="请输入恢复时间间隔"
:min="0"
:controls="false"
/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="熔断响应" prop="circuitBreakerResponse">
<template slot="label">
<span>熔断响应</span>
<el-popover
placement="top-start"
trigger="hover"
>
<span slot="reference"><i class="el-icon-info ml10"></i></span>
<p class="tip">熔断响应，JSON字符串</p>
</el-popover>
</template>
<el-input
v-model="form.circuitBreakerResponse"
type="textarea"
:autosize="{ minRows: 4}"
placeholder="请输入熔断响应"
/>
</el-form-item>
</el-col>
</template>
<!-- 熔断策略 end -->
</el-row>
</el-form>
</el-main>
<el-footer class="footer">
<el-button :disabled="btnLoading" @click="close">取消</el-button>
<el-button v-if="editable" type="primary" :loading="btnLoading" @click="submitForm">保存</el-button>
</el-footer>
</el-container>
</div>
</template>
<script>
import EventBus from '@/utils/eventBus'
import { deepClone } from '@/utils'
import { updateStrategy, getStrategy, addStrategy } from "@/api/gateway/strategy";
let CACHEFOEM;
export default {
components: { },
dicts: ['gateway_strategy_type'],
data() {
return {
loading: false,
btnLoading: false,
form: {
id: void 0,
strategyType: 'CURRENT_LIMITING',
strategyName: void 0,
description: void 0,
currentLimitingThreshold: void 0,
currentLimitingTimeWindow: void 0,
currentLimitingResponse: '{"msg":"到达限流阈值，请稍后重试！","code":500}',
circuitBreakerThreshold: void 0,
circuitBreakerTimeWindow: void 0,
circuitBreakerRecoveryInterval: void 0,
circuitBreakerResponse: '{"msg":"到达熔断阈值，请稍后重试！","code":500}',
},
rules: {
strategyType: [
{ required: true, message: '策略类型不能为空', trigger: 'change' }
],
strategyName:[
{ required: true, message: '策略名称不能为空', trigger: 'blur' }
],
currentLimitingThreshold: [
{ required: true, message: '限流阈值不能为空', trigger: 'blur' }
],
currentLimitingTimeWindow: [
{ required: true, message: '限流时间窗口不能为空', trigger: 'blur' }
],
currentLimitingResponse: [
{ required: true, message: '限流响应不能为空', trigger: 'blur' }
],
circuitBreakerThreshold: [
{ required: true, message: '熔断阈值不能为空', trigger: 'blur' }
],
circuitBreakerTimeWindow: [
{ required: true, message: '熔断时间窗口不能为空', trigger: 'blur' }
],
circuitBreakerRecoveryInterval: [
{ required: true, message: '恢复时间间隔不能为空', trigger: 'blur' }
],
circuitBreakerResponse: [
{ required: true, message: '熔断响应不能为空', trigger: 'blur' }
],
}
}
},
computed: {
editable() {
return this.$route.query.type !== 'detail'
},
titleName() {
if (!this.editable) {
return '策略详情'
}
return this.$route.query.id ? '编辑策略' : '新增策略'
},
},
created() {
this.getDetail()
},
activated() {
this.getDetail()
},
methods: {
disabledType(type) {
return !(['CURRENT_LIMITING', 'CIRCUIT_BREAKER'].includes(type)) || !!(this.form.id);
},
async getDetail() {
const { id } = this.$route.query
if (id) {
this.loading = true;
try {
const { data } = await getStrategy(id)
this.form = data;
CACHEFOEM = deepClone(data);
} catch (error) {
this.$message.error(error.message || '请求失败')
}
this.loading = false;
}
},
// 表单重置
reset() {
this.form = {
id: void 0,
strategyType: 'CURRENT_LIMITING',
strategyName: void 0,
description: void 0,
currentLimitingThreshold: void 0,
currentLimitingTimeWindow: void 0,
currentLimitingResponse: '{"msg":"到达限流阈值，请稍后重试！","code":500}',
circuitBreakerThreshold: void 0,
circuitBreakerTimeWindow: void 0,
circuitBreakerRecoveryInterval: void 0,
circuitBreakerResponse: '{"msg":"到达熔断阈值，请稍后重试！","code":500}',
};
this.resetForm("form");
},
strategyTypeChange() {
const { id, strategyType } = this.form;
this.reset();
if (CACHEFOEM && strategyType === CACHEFOEM.strategyType) {
Object.keys(this.form).forEach((key) => {
this.form[key] = CACHEFOEM[key];
})
} else {
this.form.id = id;
this.form.strategyType = strategyType;
}
},
async submitForm() {
const request = this.form.id != null ? updateStrategy : addStrategy;
const msg = this.form.id != null ? '修改' : '新增';
await this.$refs.form.validate();
try {
this.btnLoading = true;
await request(this.form);
this.$modal.msgSuccess(`${msg}成功`);
EventBus.$emit('reloadStratefyList');
this.close();
} catch (error) {
this.$modal.msgError(`${msg}失败`);
}
this.btnLoading = false;
},
close() {
this.$tab.closePage();
},
}
}
</script>
<style lang="scss" scoped>
.footer {
display: flex;
align-items: center;
justify-content: flex-end;
}
::v-deep.el-input-number .el-input__inner{
text-align: left;
}
.el-icon-info {
color: #959595;
cursor: pointer;
}
.tip {
color: #999;
font-size: 14px;
margin: 0;
}
</style>

353
sf-ui/src/views/gateway/strategy/index.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="app-container-flex">
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="策略名称" prop="strategyName">
<el-input
@ -46,7 +46,7 @@
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb14">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
@ -79,7 +79,7 @@
v-hasPermi="['gateway:strategy:remove']"
>删除</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-col :span="1.5">
<el-button
type="warning"
plain
@ -88,41 +88,37 @@
@click="handleExport"
v-hasPermi="['gateway:strategy:export']"
>导出</el-button>
</el-col> -->
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="strategyList" @selection-change="handleSelectionChange" height="100%">
<el-table v-loading="loading" :data="strategyList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="策略名称" min-width="180" show-overflow-tooltip prop="strategyName">
<template slot-scope="scope">
<el-button @click="handleUpdate(scope.row, 'detail')" type="text">{{scope.row.strategyName}}</el-button>
</template>
</el-table-column>
<el-table-column label="策略描述" min-width="180" show-overflow-tooltip prop="description" />
<!-- <el-table-column label="请求方式" prop="requestMethod" /> -->
<el-table-column label="策略类型" min-width="120" prop="strategyType">
<el-table-column label="策略ID" width="60" align="center" prop="id" />
<el-table-column label="策略类型" width="120" align="center" prop="strategyType">
<template slot-scope="scope">
<dict-tag :options="dict.type.gateway_strategy_type" :value="scope.row.strategyType"/>
</template>
</el-table-column>
<el-table-column label="策略状态" min-width="100" align="center" prop="status">
<el-table-column label="策略名称" align="left" show-overflow-tooltip prop="strategyName" />
<el-table-column label="策略描述" align="left" show-overflow-tooltip prop="description" />
<!-- <el-table-column label="请求方式" align="center" prop="requestMethod" /> -->
<el-table-column label="策略状态" width="80" align="center" prop="status">
<template slot-scope="scope">
<dict-tag :options="dict.type.gateway_data_status" :value="scope.row.status"/>
</template>
</el-table-column>
<el-table-column label="创建者" min-width="100" prop="created" />
<el-table-column label="创建时间" prop="createTime" min-width="100">
<el-table-column label="创建时间" align="center" prop="createTime" width="100">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="更新时间" prop="updateTime" min-width="100">
<el-table-column label="更新时间" align="center" prop="updateTime" width="100">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" width="180" fixed="right" class-name="small-padding fixed-width">
<el-table-column label="操作" align="center" width="150" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
@ -130,7 +126,7 @@
icon="el-icon-edit"
@click="handleStatus(scope.row)"
v-hasPermi="['gateway:strategy:edit']"
>{{scope.row.status === '0' ? '启用' : '禁用' }}</el-button>
>{{scope.row === '0' ? '启用' : '禁用' }}</el-button>
<el-button
size="mini"
type="text"
@ -158,9 +154,9 @@
/>
<!-- 添加或修改策略管理对话框 -->
<!-- <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body> -->
<!-- <el-form ref="form" :model="form" :rules="rules" :validate-on-rule-change="false" label-width="100px"> -->
<!-- <el-form-item label="策略类型" prop="strategyType">
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" :validate-on-rule-change="false" label-width="100px">
<el-form-item label="策略类型" prop="strategyType">
<el-radio-group v-model="form.strategyType" @input="strategyTypeChange">
<el-radio
v-for="dict in dict.type.gateway_strategy_type"
@ -174,23 +170,23 @@
</el-form-item>
<el-form-item label="策略描述" prop="description">
<el-input v-model="form.description" placeholder="请输入策略描述" />
</el-form-item> -->
</el-form-item>
<!-- 认证策略 -->
<!-- <template v-if="form.strategyType === 'AUTHENTICATION'"> -->
<template v-if="form.strategyType === 'AUTHENTICATION'">
<!-- 缺 认证方式 -->
<!-- 缺 认证配置 针对选定的认证方式，需要相应的配置信息，如秘钥、证书、令牌有效期等 -->
<!-- 缺 生效范围 -->
<!-- </template> -->
</template>
<!-- 认证策略 -->
<!-- 鉴权策略 -->
<!-- <template v-if="form.strategyType === 'PERMISSION'"> -->
<template v-if="form.strategyType === 'PERMISSION'">
<!-- 缺 角色授权 指定用户或角色是否具有访问接口或资源的权限-->
<!-- 缺 角色列表 指定哪些角色拥有访问接口或资源的权限-->
<!-- 缺 用户ID 标识请求中的用户身份信息-->
<!-- 缺 IP地址 允许访问接口或资源的IP地址范围，限制请求来源-->
<!-- <el-form-item label="请求方法" prop="requestMethod">
<el-form-item label="请求方法" prop="requestMethod">
<el-radio-group v-model="form.requestMethod">
<el-radio
v-for="dict in dict.type.http_request_method"
@ -198,19 +194,19 @@
:label="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item> -->
<!-- 缺 请求路径 允许访问的接口路径或URL -->
</el-form-item>
<!-- 缺 请求路劲 允许访问的接口路劲或URL -->
<!-- 缺 访问频率限制 设置允许用户或角色在一定时间内访问接口的次数限制 -->
<!-- 缺 访问时间限制 允许用户或者角色访问接口的时间段 -->
<!-- 缺 访问来源 访问接口的来源 -->
<!-- 缺 有限期 -->
<!-- 缺 授权范围 指定用户或角色 -->
<!-- </template> -->
</template>
<!-- 鉴权策略 -->
<!-- 限流策略 -->
<!-- <template v-if="form.strategyType == 'CURRENT_LIMITING'"> -->
<!-- <el-form-item label="限流算法" prop="currentLimitingAlgorithm">
<template v-if="form.strategyType == 'CURRENT_LIMITING'">
<el-form-item label="限流算法" prop="currentLimitingAlgorithm">
<el-input v-model="form.currentLimitingAlgorithm" placeholder="选择具体的限流算法，如令牌桶算法、楼桶算法、计数器算法等" />
</el-form-item>
<el-form-item label="限流阈值" prop="currentLimitingThreshold">
@ -218,20 +214,20 @@
</el-form-item>
<el-form-item label="限流周期" prop="currentLimitingPeriod">
<el-input v-model="form.currentLimitingPeriod" placeholder="设置限流的时间周期，如每秒限流、没分钟限流等" />
</el-form-item> -->
</el-form-item>
<!-- 缺 生效范围 -->
<!-- <el-form-item label="限流处理方式" prop="currentLimitingProcessingMethod">
<el-form-item label="限流处理方式" prop="currentLimitingProcessingMethod">
<el-input v-model="form.currentLimitingProcessingMethod" placeholder="请输入限流处理方式" />
</el-form-item> -->
</el-form-item>
<!-- 缺 超限处理策略 -->
<!-- 缺 监控和警告 -->
<!-- 缺 限流日志 -->
<!-- </template> -->
</template>
<!-- 限流策略 -->
<!-- 数据加密策略 -->
<!-- <template v-if="form.strategyType == 'DATA_ENCRYPTION'"> -->
<!-- <el-form-item label="状态" prop="status">
<template v-if="form.strategyType == 'DATA_ENCRYPTION'">
<el-form-item label="状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio
v-for="dict in dict.type.gateway_data_status"
@ -239,9 +235,10 @@
:label="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item> -->
<!-- <el-form-item label="加密算法" prop="encryptionAlgorithm">
</el-form-item>
<el-form-item label="加密算法" prop="encryptionAlgorithm">
<el-radio-group v-model="form.encryptionAlgorithm" @input="changeEncryptionAlgorithm">
<!-- ECC、RSA、SM2（国密） -->
<el-radio label="ECC">ECC</el-radio>
<el-radio label="RSA">RSA</el-radio>
<el-radio label="SM2">国密</el-radio>
@ -252,20 +249,19 @@
</el-form-item>
<el-form-item v-if="publicKeyRequired" label="公钥内容" prop="publicKey">
<el-input v-model="form.publicKey" type="textarea" placeholder="请输入公钥" />
</el-form-item> -->
<!-- </template> -->
</el-form-item>
</template>
<!-- 数据加密策略 -->
<!-- </el-form> -->
<!-- <div slot="footer" class="dialog-footer">
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div> -->
<!-- </el-dialog> -->
</div>
</el-dialog>
</div>
</template>
<script>
import EventBus from "@/utils/eventBus";
import { listStrategy, getStrategy, delStrategy, addStrategy, updateStrategy, changeStrategyStatus } from "@/api/gateway/strategy";
export default {
@ -287,10 +283,10 @@ export default {
total: 0,
// 策略管理表格数据
strategyList: [],
// // 弹出层标题
// title: "",
// // 是否显示弹出层
// open: false,
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 限流处理方式时间范围
daterangeCreateTime: [],
// 查询参数
@ -304,62 +300,57 @@ export default {
createTime: null,
},
// 表单参数
// form: {
// id: null,
// strategyName: null,
// strategyType: null,
// description: null,
// requestMethod: null,
// encryptionAlgorithm: null,
// status: null,
// privateKey: null,
// publicKey: null,
// currentLimitingAlgorithm: null,
// currentLimitingThreshold: null,
// currentLimitingPeriod: null,
// currentLimitingProcessingMethod: null,
// createBy: null,
// createTime: null,
// updateBy: null,
// updateTime: null
// },
form: {
id: null,
strategyName: null,
strategyType: null,
description: null,
requestMethod: null,
encryptionAlgorithm: null,
status: null,
privateKey: null,
publicKey: null,
currentLimitingAlgorithm: null,
currentLimitingThreshold: null,
currentLimitingPeriod: null,
currentLimitingProcessingMethod: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null
},
};
},
computed: {
// publicKeyRequired() {
// return this.form.encryptionAlgorithm === 'RSA';
// },
// // 表单校验
// rules() {
// return {
// strategyName: [
// { required: this.form.strategyType === 'DATA_ENCRYPTION', message: "策略名称不能为空", trigger: "blur" }
// ],
// strategyType: [
// { required: true, message: "策略类型不能为空", trigger: "change" }
// ],
// // requestMethod: [
// // { required: true, message: "请求方式不能为空", trigger: "blur" }
// // ],
// encryptionAlgorithm: [
// { required: true, message: "加密算法不能为空", trigger: "blur" }
// ],
// privateKey: [
// { required: true, message: "私钥内容不能为空", trigger: "blur" }
// ],
// publicKey: [
// { required: this.publicKeyRequired, message: "公钥内容不能为空", trigger: "blur" }
// ],
// }
// }
publicKeyRequired() {
return this.form.encryptionAlgorithm === 'RSA';
},
// 表单校验
rules() {
return {
strategyName: [
{ required: this.form.strategyType === 'DATA_ENCRYPTION', message: "策略名称不能为空", trigger: "blur" }
],
strategyType: [
{ required: true, message: "策略类型不能为空", trigger: "change" }
],
// requestMethod: [
// { required: true, message: "请求方式不能为空", trigger: "blur" }
// ],
encryptionAlgorithm: [
{ required: true, message: "加密算法不能为空", trigger: "blur" }
],
privateKey: [
{ required: true, message: "私钥内容不能为空", trigger: "blur" }
],
publicKey: [
{ required: this.publicKeyRequired, message: "公钥内容不能为空", trigger: "blur" }
],
}
}
},
created() {
this.getList();
EventBus.$on("reloadStratefyList",this.getList);
},
befoueDestroy() {
EventBus.$off('reloadStratefyList', this.getList);
},
methods: {
/** 查询策略管理列表 */
@ -379,33 +370,33 @@ export default {
});
},
// 取消按钮
// cancel() {
// this.open = false;
// this.reset();
// },
// // 表单重置
// reset() {
// this.form = {
// id: null,
// strategyName: null,
// strategyType: null,
// description: null,
// requestMethod: null,
// encryptionAlgorithm: null,
// status: null,
// privateKey: null,
// publicKey: null,
// currentLimitingAlgorithm: null,
// currentLimitingThreshold: null,
// currentLimitingPeriod: null,
// currentLimitingProcessingMethod: null,
// createBy: null,
// createTime: null,
// updateBy: null,
// updateTime: null
// };
// this.resetForm("form");
// },
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
strategyName: null,
strategyType: null,
description: null,
requestMethod: null,
encryptionAlgorithm: null,
status: null,
privateKey: null,
publicKey: null,
currentLimitingAlgorithm: null,
currentLimitingThreshold: null,
currentLimitingPeriod: null,
currentLimitingProcessingMethod: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
@ -426,68 +417,60 @@ export default {
},
/** 新增按钮操作 */
handleAdd() {
// this.reset();
// this.open = true;
// this.title = "添加策略管理";
this.$router.push({path:'/gateway/strategy-edit'})
this.reset();
this.open = true;
this.title = "添加策略管理";
},
/** 修改按钮操作 */
handleUpdate(row, type) {
// this.reset();
const id = row.id;
// getStrategy(id).then(response => {
// this.form = response.data;
// this.open = true;
// this.title = "修改策略管理";
// });
this.$router.push({
path:'/gateway/strategy-edit',
query: {
id,
type
}
})
handleUpdate(row) {
this.reset();
const id = row.id || this.ids
getStrategy(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改策略管理";
});
},
strategyTypeChange() {
const { id, strategyName, strategyType } = this.form;
this.reset();
this.form.id = id;
this.form.strategyName = strategyName;
this.form.strategyType = strategyType;
},
changeEncryptionAlgorithm(val) {
// 非RSA，清空公钥
if (val === 'RSA') {
this.form.publicKey = null;
};
},
/** 提交按钮 */
submitForm() {
console.log(this.form)
// return;
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
let data = Object.assign({},this.form)
delete data.explain
updateStrategy(data).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addStrategy(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
// strategyTypeChange() {
// const { id, strategyName, strategyType } = this.form;
// this.reset();
// this.form.id = id;
// this.form.strategyName = strategyName;
// this.form.strategyType = strategyType;
// },
// changeEncryptionAlgorithm(val) {
// // 非RSA，清空公钥
// if (val === 'RSA') {
// this.form.publicKey = null;
// };
// },
// /** 提交按钮 */
// submitForm() {
// console.log(this.form)
// // return;
// this.$refs["form"].validate(valid => {
// if (valid) {
// if (this.form.id != null) {
// let data = Object.assign({},this.form)
// delete data.explain
// updateStrategy(data).then(response => {
// this.$modal.msgSuccess("修改成功");
// this.open = false;
// this.getList();
// });
// } else {
// addStrategy(this.form).then(response => {
// this.$modal.msgSuccess("新增成功");
// this.open = false;
// this.getList();
// });
// }
// }
// });
// },
/** 删除按钮操作 */
handleDelete(row) {
const ids = row?.id || this.ids;
const ids = row.id || this.ids;
this.$modal.confirm('是否确认删除策略管理编号为"' + ids + '"的数据项？').then(function() {
return delStrategy(ids);
}).then(() => {

7
sf-ui/src/views/indexNew.vue
View File

@ -106,12 +106,8 @@ export default {
return this.$store.state.permission.addRoutes;
},
},
async created() {
created() {
this.$store.dispatch('app/toggleSideBarHide', true);
// if (this.routes.length === 0) {
// let routes = await this.$store.dispatch('GenerateRoutes');
// this.$router.addRoutes(routes)
// }
this.getList();
},
watch: {
@ -124,6 +120,7 @@ export default {
getList() {
this.loading = true;
getListApi(this.queryParams).then(response => {
console.log(response)
this.list = response.rows;
this.total = response.total;
this.loading = false;

2
sf-ui/src/views/login.vue
View File

@ -161,7 +161,7 @@ export default {
justify-content: center;
align-items: center;
height: 100%;
background-image: url("../assets/images/login-background.png");
background-image: url("../assets/images/login-background.jpg");
background-size: cover;
}
.title {

266
sf-ui/src/views/mandate/appMandate/index.vue
View File

@ -1,266 +0,0 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="用户名" prop="userName">
<el-input v-model="queryParams.userName" placeholder="请输入用户名" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['mandate:appMandate:add']"
:disabled="Cookies.get('Admin-isAdmin') == 1 ? false : true">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini"
:disabled="multiple && Cookies.get('Admin-isAdmin') == 1 ? false : true" @click="handleDelete"
v-hasPermi="['mandate:appMandate:remove']">删除</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="appMandateList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="用户名" align="center" prop="userName" />
<el-table-column label="是否为管理员" align="center" prop="isAdmin">
<template slot-scope="scope">
<el-switch :disabled="Cookies.get('Admin-isAdmin') == 1 ? false : true" :value="scope.row.isAdmin"
@change="isAdminChange(scope.row)" :active-value="1" :inactive-value="0" />
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button :disabled="Cookies.get('Admin-isAdmin') == 1 ? false : true" size="mini" type="text"
icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['mandate:appMandate:remove']">删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
<!-- 添加或修改应用授权对话框 -->
<el-dialog :title="title" :visible.sync="open" width="650px" append-to-body>
<el-transfer :titles="['可选用户', '选中用户']" v-model="value" :data="columns" @change="dataChange"></el-transfer>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { listAppMandate, delAppMandate, addAppMandateList, updateAppMandate, appMandateUser } from "@/api/mandate/appMandate";
import { listUser } from "@/api/system/user";
import Cookies from 'js-cookie'
export default {
name: "AppMandate",
data () {
return {
Cookies: Cookies,
columns: [],
value: [],
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 应用授权表格数据
appMandateList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
userName: null,
},
// 表单参数
form: {},
// 表单校验
rules: {
userName: [
{ required: true, message: "用户名不能为空", trigger: "blur" }
],
}
};
},
created () {
this.getList();
},
methods: {
/** 查询应用授权列表 */
getList () {
this.loading = true;
listAppMandate(this.queryParams).then(response => {
this.appMandateList = response.rows;
this.total = response.total;
this.loading = false;
});
},
getUserList () {
this.loading = true;
appMandateUser().then(res => {
const arr1 = JSON.parse(JSON.stringify(res.rows));
const arr2 = JSON.parse(JSON.stringify(this.appMandateList))
const mergedArr = [...arr1, ...arr2];
const userIdCounts = new Map();
mergedArr.forEach(item => {
if (!userIdCounts.has(item.userId)) {
userIdCounts.set(item.userId, 1);
} else {
userIdCounts.set(item.userId, userIdCounts.get(item.userId) + 1);
}
});
const uniqueItems = mergedArr.filter(item => userIdCounts.get(item.userId) === 1);
for (var i in uniqueItems) {
uniqueItems[i].key = i
uniqueItems[i].label = uniqueItems[i].userName
}
this.columns = uniqueItems;
this.loading = false;
});
},
dataChange () {
},
removeDuplicateValues (arrays) {
// 展平多维数组
const flatArray = arrays.flat();
// 使用Map存储元素及其出现次数
const elementMap = new Map();
// 遍历数组，将元素作为键，出现次数作为值
for (const item of flatArray) {
elementMap.set(item, (elementMap.get(item.userId) || 0) + 1);
}
// 提取只出现一次的元素
const uniqueElements = Array.from(elementMap.entries())
.filter(([value, count]) => count === 1)
.map(([value, _]) => value);
return uniqueElements;
},
// 取消按钮
cancel () {
this.open = false;
},
/** 搜索按钮操作 */
handleQuery () {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery () {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange (selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd () {
this.open = true;
this.getUserList();
this.title = "添加应用授权";
this.value = [];
},
/** 提交按钮 */
submitForm () {
const group = [];
for (var j in this.value) {
group.push({
userName: this.columns[this.value[j]].userName,
userId: this.columns[this.value[j]].userId,
});
}
addAppMandateList(group).then(res => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
},
/** 删除按钮操作 */
handleDelete (row) {
const ids = row.id || this.ids;
this.$modal.confirm('是否确认删除应用授权编号为"' + ids + '"的数据项？').then(function () {
return delAppMandate(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => { });
},
isAdminChange (row) {
if (row.isAdmin == 0) {
this.$confirm('是否将该用户设置为管理员', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
updateAppMandate({
isAdmin: 1,
id: row.id
}).then(res => {
this.$message({
type: 'success',
message: '设置成功!'
});
this.getList();
})
})
} else {
this.$confirm("是否撤销该用户的管理员权限", '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
updateAppMandate({
isAdmin: 0,
id: row.id
}).then(res => {
this.$message({
type: 'success',
message: '设置成功!'
});
this.getList();
})
})
}
}
}
};
</script>

59
sf-ui/src/views/register.vue
View File

@ -8,29 +8,49 @@
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input v-model="registerForm.password" type="password" auto-complete="off" placeholder="密码"
@keyup.enter.native="handleRegister">
<el-input
v-model="registerForm.password"
type="password"
auto-complete="off"
placeholder="密码"
@keyup.enter.native="handleRegister"
>
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="confirmPassword">
<el-input v-model="registerForm.confirmPassword" type="password" auto-complete="off" placeholder="确认密码"
@keyup.enter.native="handleRegister">
<el-input
v-model="registerForm.confirmPassword"
type="password"
auto-complete="off"
placeholder="确认密码"
@keyup.enter.native="handleRegister"
>
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="code" v-if="captchaEnabled">
<el-input v-model="registerForm.code" auto-complete="off" placeholder="验证码" style="width: 63%"
@keyup.enter.native="handleRegister">
<el-input
v-model="registerForm.code"
auto-complete="off"
placeholder="验证码"
style="width: 63%"
@keyup.enter.native="handleRegister"
>
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
</el-input>
<div class="register-code">
<img :src="codeUrl" @click="getCode" class="register-code-img" />
<img :src="codeUrl" @click="getCode" class="register-code-img"/>
</div>
</el-form-item>
<el-form-item style="width:100%;">
<el-button :loading="loading" size="medium" type="primary" style="width:100%;"
@click.native.prevent="handleRegister">
<el-button
:loading="loading"
size="medium"
type="primary"
style="width:100%;"
@click.native.prevent="handleRegister"
>
<span v-if="!loading">注 册</span>
<span v-else>注 册 中...</span>
</el-button>
@ -51,7 +71,7 @@ import { getCodeImg, register } from "@/api/login";
export default {
name: "Register",
data () {
data() {
const equalToPassword = (rule, value, callback) => {
if (this.registerForm.password !== value) {
callback(new Error("两次输入的密码不一致"));
@ -87,11 +107,11 @@ export default {
captchaEnabled: true
};
},
created () {
created() {
this.getCode();
},
methods: {
getCode () {
getCode() {
getCodeImg().then(res => {
this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled;
if (this.captchaEnabled) {
@ -100,7 +120,7 @@ export default {
}
});
},
handleRegister () {
handleRegister() {
this.$refs.registerForm.validate(valid => {
if (valid) {
this.loading = true;
@ -111,7 +131,7 @@ export default {
type: 'success'
}).then(() => {
this.$router.push("/login");
}).catch(() => { });
}).catch(() => {});
}).catch(() => {
this.loading = false;
if (this.captchaEnabled) {
@ -131,10 +151,9 @@ export default {
justify-content: center;
align-items: center;
height: 100%;
background-image: url("../assets/images/login-background.png");
background-image: url("../assets/images/login-background.jpg");
background-size: cover;
}
.title {
margin: 0px auto 30px auto;
text-align: center;
@ -146,39 +165,32 @@ export default {
background: #ffffff;
width: 400px;
padding: 25px 25px 5px 25px;
.el-input {
height: 38px;
input {
height: 38px;
}
}
.input-icon {
height: 39px;
width: 14px;
margin-left: 2px;
}
}
.register-tip {
font-size: 13px;
text-align: center;
color: #bfbfbf;
}
.register-code {
width: 33%;
height: 38px;
float: right;
img {
cursor: pointer;
vertical-align: middle;
}
}
.el-register-footer {
height: 40px;
line-height: 40px;
@ -191,7 +203,6 @@ export default {
font-size: 12px;
letter-spacing: 1px;
}
.register-code-img {
height: 38px;
}

329
sf-ui/src/views/service/goods/index.vue
View File

@ -1,132 +1,226 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="68px" size="small">
<el-form-item label="商品编号" prop="goodsCode">
<el-input v-model="queryParams.goodsCode" placeholder="请输入商品编号" clearable @keyup.enter.native="handleQuery" />
<el-input
v-model="queryParams.goodsCode"
clearable
placeholder="请输入商品编号"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="审核状态" prop="reviewStatus">
<el-select v-model="queryParams.reviewStatus" placeholder="请选择审核状态" clearable>
<el-option v-for="dict in dict.type.goods_review_status" :key="dict.value" :label="dict.label"
:value="dict.value" />
<el-select v-model="queryParams.reviewStatus" clearable placeholder="请选择审核状态">
<el-option
v-for="dict in dict.type.goods_review_status"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item label="商品标题" prop="productTitle">
<el-input v-model="queryParams.productTitle" placeholder="请输入商品标题" clearable @keyup.enter.native="handleQuery" />
<el-input
v-model="queryParams.productTitle"
clearable
placeholder="请输入商品标题"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="商品原价" prop="originalPrice">
<el-input v-model="queryParams.originalPrice" placeholder="请输入商品原价" clearable @keyup.enter.native="handleQuery" />
<el-input
v-model="queryParams.originalPrice"
clearable
placeholder="请输入商品原价"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="商品类型" prop="goodsType">
<el-select v-model="queryParams.goodsType" placeholder="请选择商品类型" clearable>
<el-option v-for="dict in dict.type.goods_type" :key="dict.value" :label="dict.label" :value="dict.value" />
<el-select v-model="queryParams.goodsType" clearable placeholder="请选择商品类型">
<el-option
v-for="dict in dict.type.goods_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item label="商品规格" prop="goodsSpec">
<el-input v-model="queryParams.goodsSpec" placeholder="请输入商品规格" clearable @keyup.enter.native="handleQuery" />
<el-input
v-model="queryParams.goodsSpec"
clearable
placeholder="请输入商品规格"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="商品型号" prop="goodsModel">
<el-input v-model="queryParams.goodsModel" placeholder="请输入商品型号" clearable @keyup.enter.native="handleQuery" />
<el-input
v-model="queryParams.goodsModel"
clearable
placeholder="请输入商品型号"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['service:goods:add']">新增</el-button>
<el-button
v-hasPermi="['service:goods:add']"
icon="el-icon-plus"
plain
size="mini"
type="primary"
@click="handleAdd"
>新增
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
v-hasPermi="['service:goods:edit']">修改</el-button>
<el-button
v-hasPermi="['service:goods:edit']"
:disabled="single"
icon="el-icon-edit"
plain
size="mini"
type="success"
@click="handleUpdate"
>修改
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
v-hasPermi="['service:goods:remove']">删除</el-button>
<el-button
v-hasPermi="['service:goods:remove']"
:disabled="multiple"
icon="el-icon-delete"
plain
size="mini"
type="danger"
@click="handleDelete"
>删除
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
v-hasPermi="['service:goods:export']">导出</el-button>
<el-button
v-hasPermi="['service:goods:export']"
icon="el-icon-download"
plain
size="mini"
type="warning"
@click="handleExport"
>导出
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="goodsList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="商品编号" align="center" prop="goodsCode" />
<el-table-column label="审核状态" align="center" prop="reviewStatus">
<el-table-column align="center" type="selection" width="55"/>
<el-table-column align="center" label="主键" prop="id"/>
<el-table-column align="center" label="商品编号" prop="goodsCode"/>
<el-table-column align="center" label="审核状态" prop="reviewStatus">
<template slot-scope="scope">
<dict-tag :options="dict.type.goods_review_status" :value="scope.row.reviewStatus" />
<dict-tag :options="dict.type.goods_review_status" :value="scope.row.reviewStatus"/>
</template>
</el-table-column>
<el-table-column label="商品标题" align="center" prop="productTitle" />
<el-table-column label="商品图片" align="center" prop="productPicture" width="100">
<el-table-column align="center" label="商品标题" prop="productTitle"/>
<el-table-column align="center" label="商品图片" prop="productPicture" width="100">
<template slot-scope="scope">
<image-preview :src="scope.row.productPicture" :width="50" :height="50" />
<image-preview :height="50" :src="scope.row.productPicture" :width="50"/>
</template>
</el-table-column>
<el-table-column label="商品原价" align="center" prop="originalPrice" />
<el-table-column label="商品描述" align="center" prop="productDesc" />
<el-table-column label="商品类型" align="center" prop="goodsType">
<el-table-column align="center" label="商品原价" prop="originalPrice">
<template slot-scope="scope">
<dict-tag :options="dict.type.goods_type" :value="scope.row.goodsType" />
<span>{{ scope.row.originalPrice / 100 }}</span>
</template>
</el-table-column>
<el-table-column label="商品规格" align="center" prop="goodsSpec" />
<el-table-column label="商品型号" align="center" prop="goodsModel" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<el-table-column align="center" label="商品描述" prop="productDesc"/>
<el-table-column align="center" label="商品类型" prop="goodsType">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['service:goods:edit']">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['service:goods:remove']">删除</el-button>
<dict-tag :options="dict.type.goods_type" :value="scope.row.goodsType"/>
</template>
</el-table-column>
<el-table-column align="center" label="商品规格" prop="goodsSpec"/>
<el-table-column align="center" label="商品型号" prop="goodsModel"/>
<el-table-column align="center" class-name="small-padding fixed-width" label="操作">
<template slot-scope="scope">
<el-button
v-hasPermi="['service:goods:edit']"
icon="el-icon-edit"
size="mini"
type="text"
@click="handleUpdate(scope.row)"
>修改
</el-button>
<el-button
v-hasPermi="['service:goods:remove']"
icon="el-icon-delete"
size="mini"
type="text"
@click="handleDelete(scope.row)"
>删除
</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
<pagination
v-show="total>0"
:limit.sync="queryParams.pageSize"
:page.sync="queryParams.pageNum"
:total="total"
@pagination="getList"
/>
<!-- 添加或修改商品信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-dialog :title="title" :visible.sync="open" append-to-body width="500px">
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="商品编号" prop="goodsCode">
<el-input v-model="form.goodsCode" placeholder="请输入商品编号" />
<el-input v-model="form.goodsCode" placeholder="请输入商品编号"/>
</el-form-item>
<el-form-item label="审核状态" prop="reviewStatus">
<el-radio-group v-model="form.reviewStatus">
<el-radio v-for="dict in dict.type.goods_review_status" :key="dict.value"
:label="parseInt(dict.value)">{{ dict.label }}</el-radio>
<el-radio
v-for="dict in dict.type.goods_review_status"
:key="dict.value"
:label="parseInt(dict.value)"
>{{ dict.label }}
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="商品标题" prop="productTitle">
<el-input v-model="form.productTitle" placeholder="请输入商品标题" />
<el-input v-model="form.productTitle" placeholder="请输入商品标题"/>
</el-form-item>
<el-form-item label="商品图片" prop="productPicture">
<image-upload v-model="form.productPicture" />
<image-upload v-model="form.productPicture" :limit="1"/>
</el-form-item>
<el-form-item label="商品原价" prop="originalPrice">
<el-input v-model="form.originalPrice" placeholder="请输入商品原价" />
<el-input v-model="form.originalPrice" placeholder="请输入商品原价"/>
</el-form-item>
<el-form-item label="商品描述" prop="productDesc">
<el-input v-model="form.productDesc" type="textarea" placeholder="请输入内容" />
<el-input v-model="form.productDesc" placeholder="请输入内容" type="textarea"/>
</el-form-item>
<el-form-item label="商品类型" prop="goodsType">
<el-radio-group v-model="form.goodsType">
<el-radio v-for="dict in dict.type.goods_type" :key="dict.value"
:label="parseInt(dict.value)">{{ dict.label }}</el-radio>
<el-radio
v-for="dict in dict.type.goods_type"
:key="dict.value"
:label="parseInt(dict.value)"
>{{ dict.label }}
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="商品规格" prop="goodsSpec">
<el-input v-model="form.goodsSpec" placeholder="请输入商品规格" />
<el-input v-model="form.goodsSpec" placeholder="请输入商品规格"/>
</el-form-item>
<el-form-item label="排序" prop="orderNum">
<el-input v-model="form.orderNum" placeholder="请输入排序" />
<el-input v-model="form.orderNum" placeholder="请输入排序"/>
</el-form-item>
<el-form-item label="商品型号" prop="goodsModel">
<el-input v-model="form.goodsModel" placeholder="请输入商品型号" />
<el-input v-model="form.goodsModel" placeholder="请输入商品型号"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
@ -138,12 +232,12 @@
</template>
<script>
import { listGoods, getGoods, delGoods, addGoods, updateGoods } from "@/api/service/goods";
import { addGoods, delGoods, getGoods, listGoods, updateGoods } from '@/api/service/goods'
export default {
name: "Goods",
name: 'Goods',
dicts: ['goods_review_status', 'goods_type'],
data () {
data() {
return {
// 遮罩层
loading: true,
@ -160,7 +254,7 @@ export default {
// 商品信息表格数据
goodsList: [],
// 弹出层标题
title: "",
title: '',
// 是否显示弹出层
open: false,
// 查询参数
@ -180,52 +274,52 @@ export default {
// 表单校验
rules: {
goodsCode: [
{ required: true, message: "商品编号不能为空", trigger: "blur" }
{ required: true, message: '商品编号不能为空', trigger: 'blur' }
],
reviewStatus: [
{ required: true, message: "审核状态不能为空", trigger: "change" }
{ required: true, message: '审核状态不能为空', trigger: 'change' }
],
productTitle: [
{ required: true, message: "商品标题不能为空", trigger: "blur" }
{ required: true, message: '商品标题不能为空', trigger: 'blur' }
],
productPicture: [
{ required: true, message: "商品图片不能为空", trigger: "blur" }
{ required: true, message: '商品图片不能为空', trigger: 'blur' }
],
originalPrice: [
{ required: true, message: "商品原价不能为空", trigger: "blur" }
{ required: true, message: '商品原价不能为空', trigger: 'blur' }
],
goodsType: [
{ required: true, message: "商品类型不能为空", trigger: "change" }
{ required: true, message: '商品类型不能为空', trigger: 'change' }
],
goodsSpec: [
{ required: true, message: "商品规格不能为空", trigger: "blur" }
{ required: true, message: '商品规格不能为空', trigger: 'blur' }
],
goodsModel: [
{ required: true, message: "商品型号不能为空", trigger: "blur" }
{ required: true, message: '商品型号不能为空', trigger: 'blur' }
]
}
};
}
},
created () {
this.getList();
created() {
this.getList()
},
methods: {
/** 查询商品信息列表 */
getList () {
this.loading = true;
getList() {
this.loading = true
listGoods(this.queryParams).then(response => {
this.goodsList = response.rows;
this.total = response.total;
this.loading = false;
});
this.goodsList = response.rows
this.total = response.total
this.loading = false
})
},
// 取消按钮
cancel () {
this.open = false;
this.reset();
cancel() {
this.open = false
this.reset()
},
// 表单重置
reset () {
reset() {
this.form = {
id: null,
goodsCode: null,
@ -245,79 +339,80 @@ export default {
updateTime: null,
goodsName: null,
goodsModel: null
};
this.resetForm("form");
}
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery () {
this.queryParams.pageNum = 1;
this.getList();
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery () {
this.resetForm("queryForm");
this.handleQuery();
resetQuery() {
this.resetForm('queryForm')
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange (selection) {
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd () {
this.reset();
this.open = true;
this.title = "添加商品信息";
handleAdd() {
this.reset()
this.open = true
this.title = '添加商品信息'
},
/** 修改按钮操作 */
handleUpdate (row) {
this.reset();
handleUpdate(row) {
this.reset()
const id = row.id || this.ids
getGoods(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改商品信息";
});
this.form = response.data
this.open = true
this.title = '修改商品信息'
})
},
/** 提交按钮 */
submitForm () {
this.$refs["form"].validate(valid => {
submitForm() {
this.$refs['form'].validate(valid => {
if (valid) {
if (this.form.id != null) {
let data = Object.assign({}, this.form)
delete data.explain
updateGoods(data).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
this.$modal.msgSuccess('修改成功')
this.open = false
this.getList()
})
} else {
addGoods(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
this.$modal.msgSuccess('新增成功')
this.open = false
this.getList()
})
}
}
});
})
},
/** 删除按钮操作 */
handleDelete (row) {
const ids = row.id || this.ids;
this.$modal.confirm('是否确认删除商品信息编号为"' + ids + '"的数据项？').then(function () {
return delGoods(ids);
handleDelete(row) {
const ids = row.id || this.ids
this.$modal.confirm('是否确认删除商品信息编号为"' + ids + '"的数据项？').then(function() {
return delGoods(ids)
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => { });
this.getList()
this.$modal.msgSuccess('删除成功')
}).catch(() => {
})
},
/** 导出按钮操作 */
handleExport () {
handleExport() {
this.download('service/goods/export', {
...this.queryParams
}, `goods_${new Date().getTime()}.xlsx`)
}
}
};
}
</script>

159
sf-ui/src/views/system/menu/index.vue
View File

@ -2,12 +2,21 @@
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
<el-form-item label="菜单名称" prop="menuName">
<el-input v-model="queryParams.menuName" placeholder="请输入菜单名称" clearable @keyup.enter.native="handleQuery" />
<el-input
v-model="queryParams.menuName"
placeholder="请输入菜单名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="状态" prop="status">
<el-select v-model="queryParams.status" placeholder="菜单状态" clearable>
<el-option v-for="dict in dict.type.sys_normal_disable" :key="dict.value" :label="dict.label"
:value="dict.value" />
<el-option
v-for="dict in dict.type.sys_normal_disable"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item>
@ -18,17 +27,35 @@
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['system:menu:add']">新增</el-button>
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['system:menu:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="el-icon-sort" size="mini" @click="toggleExpandAll">展开/折叠</el-button>
<el-button
type="info"
plain
icon="el-icon-sort"
size="mini"
@click="toggleExpandAll"
>展开/折叠</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-if="refreshTable" v-loading="loading" :data="menuList" row-key="menuId" :default-expand-all="isExpandAll"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
<el-table
v-if="refreshTable"
v-loading="loading"
:data="menuList"
row-key="menuId"
:default-expand-all="isExpandAll"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
>
<el-table-column prop="menuName" label="菜单名称" :show-overflow-tooltip="true" width="160"></el-table-column>
<el-table-column prop="icon" label="图标" align="center" width="100">
<template slot-scope="scope">
@ -40,7 +67,7 @@
<el-table-column prop="component" label="组件路径" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="status" label="状态" width="80">
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status" />
<dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
</template>
</el-table-column>
<el-table-column label="创建时间" align="center" prop="createTime">
@ -50,12 +77,27 @@
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['system:menu:edit']">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-plus" @click="handleAdd(scope.row)"
v-hasPermi="['system:menu:add']">新增</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['system:menu:remove']">删除</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['system:menu:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-plus"
@click="handleAdd(scope.row)"
v-hasPermi="['system:menu:add']"
>新增</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['system:menu:remove']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
@ -66,8 +108,13 @@
<el-row>
<el-col :span="24">
<el-form-item label="上级菜单" prop="parentId">
<treeselect v-model="form.parentId" :options="menuOptions" :normalizer="normalizer" :show-count="true"
placeholder="选择上级菜单" />
<treeselect
v-model="form.parentId"
:options="menuOptions"
:normalizer="normalizer"
:show-count="true"
placeholder="选择上级菜单"
/>
</el-form-item>
</el-col>
<el-col :span="24">
@ -81,10 +128,20 @@
</el-col>
<el-col :span="24" v-if="form.menuType != 'F'">
<el-form-item label="菜单图标" prop="icon">
<el-popover placement="bottom-start" width="460" trigger="hover" @show="$refs['iconSelect'].reset()">
<el-popover
placement="bottom-start"
width="460"
trigger="click"
@show="$refs['iconSelect'].reset()"
>
<IconSelect ref="iconSelect" @selected="selected" :active-icon="form.icon" />
<el-input slot="reference" v-model="form.icon" placeholder="点击选择图标" readonly>
<svg-icon v-if="form.icon" slot="prefix" :icon-class="form.icon" style="width: 25px;" />
<svg-icon
v-if="form.icon"
slot="prefix"
:icon-class="form.icon"
style="width: 25px;"
/>
<i v-else slot="prefix" class="el-icon-search el-input__icon" />
</el-input>
</el-popover>
@ -104,7 +161,7 @@
<el-form-item prop="isFrame">
<span slot="label">
<el-tooltip content="选择是外链则路由地址需要以`http(s)://`开头" placement="top">
<i class="el-icon-question"></i>
<i class="el-icon-question"></i>
</el-tooltip>
是否外链
</span>
@ -118,7 +175,7 @@
<el-form-item prop="path">
<span slot="label">
<el-tooltip content="访问的路由地址，如：`user`，如外网地址需内链访问则以`http(s)://`开头" placement="top">
<i class="el-icon-question"></i>
<i class="el-icon-question"></i>
</el-tooltip>
路由地址
</span>
@ -129,7 +186,7 @@
<el-form-item prop="component">
<span slot="label">
<el-tooltip content="访问的组件路径，如：`system/user/index`，默认在`views`目录下" placement="top">
<i class="el-icon-question"></i>
<i class="el-icon-question"></i>
</el-tooltip>
组件路径
</span>
@ -141,7 +198,7 @@
<el-input v-model="form.perms" placeholder="请输入权限标识" maxlength="100" />
<span slot="label">
<el-tooltip content="控制器中定义的权限字符，如：@PreAuthorize(`@ss.hasPermi('system:user:list')`)" placement="top">
<i class="el-icon-question"></i>
<i class="el-icon-question"></i>
</el-tooltip>
权限字符
</span>
@ -152,7 +209,7 @@
<el-input v-model="form.query" placeholder="请输入路由参数" maxlength="255" />
<span slot="label">
<el-tooltip content='访问路由的默认传递参数，如：`{"id": 1, "name": "ry"}`' placement="top">
<i class="el-icon-question"></i>
<i class="el-icon-question"></i>
</el-tooltip>
路由参数
</span>
@ -162,7 +219,7 @@
<el-form-item prop="isCache">
<span slot="label">
<el-tooltip content="选择是则会被`keep-alive`缓存，需要匹配组件的`name`和地址保持一致" placement="top">
<i class="el-icon-question"></i>
<i class="el-icon-question"></i>
</el-tooltip>
是否缓存
</span>
@ -176,13 +233,16 @@
<el-form-item prop="visible">
<span slot="label">
<el-tooltip content="选择隐藏则路由将不会出现在侧边栏，但仍然可以访问" placement="top">
<i class="el-icon-question"></i>
<i class="el-icon-question"></i>
</el-tooltip>
显示状态
</span>
<el-radio-group v-model="form.visible">
<el-radio v-for="dict in dict.type.sys_show_hide" :key="dict.value"
:label="dict.value">{{ dict.label }}</el-radio>
<el-radio
v-for="dict in dict.type.sys_show_hide"
:key="dict.value"
:label="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
@ -190,13 +250,16 @@
<el-form-item prop="status">
<span slot="label">
<el-tooltip content="选择停用则路由将不会出现在侧边栏，也不能被访问" placement="top">
<i class="el-icon-question"></i>
<i class="el-icon-question"></i>
</el-tooltip>
菜单状态
</span>
<el-radio-group v-model="form.status">
<el-radio v-for="dict in dict.type.sys_normal_disable" :key="dict.value"
:label="dict.value">{{ dict.label }}</el-radio>
<el-radio
v-for="dict in dict.type.sys_normal_disable"
:key="dict.value"
:label="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
@ -220,7 +283,7 @@ export default {
name: "Menu",
dicts: ['sys_show_hide', 'sys_normal_disable'],
components: { Treeselect, IconSelect },
data () {
data() {
return {
// 遮罩层
loading: true,
@ -259,16 +322,16 @@ export default {
}
};
},
created () {
created() {
this.getList();
},
methods: {
// 选择图标
selected (name) {
selected(name) {
this.form.icon = name;
},
/** 查询菜单列表 */
getList () {
getList() {
this.loading = true;
listMenu(this.queryParams).then(response => {
this.menuList = this.handleTree(response.data, "menuId");
@ -276,7 +339,7 @@ export default {
});
},
/** 转换菜单数据结构 */
normalizer (node) {
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children;
}
@ -287,7 +350,7 @@ export default {
};
},
/** 查询菜单下拉树结构 */
getTreeselect () {
getTreeselect() {
listMenu().then(response => {
this.menuOptions = [];
const menu = { menuId: 0, menuName: '主类目', children: [] };
@ -296,12 +359,12 @@ export default {
});
},
// 取消按钮
cancel () {
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset () {
reset() {
this.form = {
menuId: undefined,
parentId: 0,
@ -317,16 +380,16 @@ export default {
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery () {
handleQuery() {
this.getList();
},
/** 重置按钮操作 */
resetQuery () {
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
/** 新增按钮操作 */
handleAdd (row) {
handleAdd(row) {
this.reset();
this.getTreeselect();
if (row != null && row.menuId) {
@ -338,7 +401,7 @@ export default {
this.title = "添加菜单";
},
/** 展开/折叠操作 */
toggleExpandAll () {
toggleExpandAll() {
this.refreshTable = false;
this.isExpandAll = !this.isExpandAll;
this.$nextTick(() => {
@ -346,7 +409,7 @@ export default {
});
},
/** 修改按钮操作 */
handleUpdate (row) {
handleUpdate(row) {
this.reset();
this.getTreeselect();
getMenu(row.menuId).then(response => {
@ -356,7 +419,7 @@ export default {
});
},
/** 提交按钮 */
submitForm: function () {
submitForm: function() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.menuId != undefined) {
@ -376,13 +439,13 @@ export default {
});
},
/** 删除按钮操作 */
handleDelete (row) {
this.$modal.confirm('是否确认删除名称为"' + row.menuName + '"的数据项？').then(function () {
handleDelete(row) {
this.$modal.confirm('是否确认删除名称为"' + row.menuName + '"的数据项？').then(function() {
return delMenu(row.menuId);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => { });
}).catch(() => {});
}
}
};

231
sf-ui/src/views/tool/gen/index.vue
View File

@ -2,14 +2,31 @@
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="表名称" prop="tableName">
<el-input v-model="queryParams.tableName" placeholder="请输入表名称" clearable @keyup.enter.native="handleQuery" />
<el-input
v-model="queryParams.tableName"
placeholder="请输入表名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="表描述" prop="tableComment">
<el-input v-model="queryParams.tableComment" placeholder="请输入表描述" clearable @keyup.enter.native="handleQuery" />
<el-input
v-model="queryParams.tableComment"
placeholder="请输入表描述"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="创建时间">
<el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange"
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
<el-date-picker
v-model="dateRange"
style="width: 240px"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
@ -19,20 +36,46 @@
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-download" size="mini" @click="handleGenTable"
v-hasPermi="['tool:gen:code']">生成</el-button>
<el-button
type="primary"
plain
icon="el-icon-download"
size="mini"
@click="handleGenTable"
v-hasPermi="['tool:gen:code']"
>生成</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="el-icon-upload" size="mini" @click="openImportTable"
v-hasPermi="['tool:gen:import']">导入</el-button>
<el-button
type="info"
plain
icon="el-icon-upload"
size="mini"
@click="openImportTable"
v-hasPermi="['tool:gen:import']"
>导入</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleEditTable"
v-hasPermi="['tool:gen:edit']">修改</el-button>
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleEditTable"
v-hasPermi="['tool:gen:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
v-hasPermi="['tool:gen:remove']">删除</el-button>
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['tool:gen:remove']"
>删除</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
@ -41,43 +84,103 @@
<el-table-column type="selection" align="center" width="55"></el-table-column>
<el-table-column label="序号" type="index" width="50" align="center">
<template slot-scope="scope">
<span>{{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}</span>
<span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
</template>
</el-table-column>
<el-table-column label="表名称" align="center" prop="tableName" :show-overflow-tooltip="true" width="120" />
<el-table-column label="表描述" align="center" prop="tableComment" :show-overflow-tooltip="true" width="120" />
<el-table-column label="实体" align="center" prop="className" :show-overflow-tooltip="true" width="120" />
<el-table-column
label="表名称"
align="center"
prop="tableName"
:show-overflow-tooltip="true"
width="120"
/>
<el-table-column
label="表描述"
align="center"
prop="tableComment"
:show-overflow-tooltip="true"
width="120"
/>
<el-table-column
label="实体"
align="center"
prop="className"
:show-overflow-tooltip="true"
width="120"
/>
<el-table-column label="创建时间" align="center" prop="createTime" width="160" />
<el-table-column label="更新时间" align="center" prop="updateTime" width="160" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button type="text" size="small" icon="el-icon-view" @click="handlePreview(scope.row, false)"
v-hasPermi="['tool:gen:preview']">预览</el-button>
<el-button type="text" size="small" icon="el-icon-view" @click="handlePreview(scope.row, true)"
v-hasPermi="['tool:gen:preview']">预览JSON</el-button>
<el-button type="text" size="small" icon="el-icon-edit" @click="handleEditTable(scope.row)"
v-hasPermi="['tool:gen:edit']">编辑</el-button>
<el-button type="text" size="small" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['tool:gen:remove']">删除</el-button>
<el-button type="text" size="small" icon="el-icon-refresh" @click="handleSynchDb(scope.row)"
v-hasPermi="['tool:gen:edit']">同步</el-button>
<el-button type="text" size="small" icon="el-icon-download" @click="handleGenTable(scope.row, false)"
v-hasPermi="['tool:gen:code']">生成代码</el-button>
<el-button type="text" size="small" icon="el-icon-download" @click="handleGenTable(scope.row, true)"
v-hasPermi="['tool:gen:code']">生成JSON</el-button>
<el-button
type="text"
size="small"
icon="el-icon-view"
@click="handlePreview(scope.row, false)"
v-hasPermi="['tool:gen:preview']"
>预览</el-button>
<el-button
type="text"
size="small"
icon="el-icon-view"
@click="handlePreview(scope.row,true)"
v-hasPermi="['tool:gen:preview']"
>预览JSON</el-button>
<el-button
type="text"
size="small"
icon="el-icon-edit"
@click="handleEditTable(scope.row)"
v-hasPermi="['tool:gen:edit']"
>编辑</el-button>
<el-button
type="text"
size="small"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['tool:gen:remove']"
>删除</el-button>
<el-button
type="text"
size="small"
icon="el-icon-refresh"
@click="handleSynchDb(scope.row)"
v-hasPermi="['tool:gen:edit']"
>同步</el-button>
<el-button
type="text"
size="small"
icon="el-icon-download"
@click="handleGenTable(scope.row,false)"
v-hasPermi="['tool:gen:code']"
>生成代码</el-button>
<el-button
type="text"
size="small"
icon="el-icon-download"
@click="handleGenTable(scope.row,true)"
v-hasPermi="['tool:gen:code']"
>生成JSON</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 预览界面 -->
<el-dialog :title="preview.title" :visible.sync="preview.open" width="80%" top="5vh" append-to-body class="scrollbar">
<el-tabs v-model="preview.activeName">
<el-tab-pane v-for="(value, key) in preview.data"
:label="key.substring(key.lastIndexOf('/') + 1, key.indexOf('.vm'))"
:name="key.substring(key.lastIndexOf('/') + 1, key.indexOf('.vm'))" :key="key">
<el-link :underline="false" icon="el-icon-document-copy" v-clipboard:copy="value"
v-clipboard:success="clipboardSuccess" style="float:right">复制</el-link>
<el-tab-pane
v-for="(value, key) in preview.data"
:label="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))"
:name="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))"
:key="key"
>
<el-link :underline="false" icon="el-icon-document-copy" v-clipboard:copy="value" v-clipboard:success="clipboardSuccess" style="float:right">复制</el-link>
<pre><code class="hljs" v-html="highlightedCode(value, key)"></code></pre>
</el-tab-pane>
</el-tabs>
@ -101,7 +204,7 @@ hljs.registerLanguage("sql", require("highlight.js/lib/languages/sql"));
export default {
name: "Gen",
components: { importTable },
data () {
data() {
return {
// 遮罩层
loading: true,
@ -139,10 +242,10 @@ export default {
}
};
},
created () {
created() {
this.getList();
},
activated () {
activated() {
const time = this.$route.query.t;
if (time != null && time != this.uniqueId) {
this.uniqueId = time;
@ -152,59 +255,59 @@ export default {
},
methods: {
/** 查询表集合 */
getList () {
getList() {
this.loading = true;
listTable(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
this.tableList = response.rows;
this.total = response.total;
this.loading = false;
}
this.tableList = response.rows;
this.total = response.total;
this.loading = false;
}
);
},
/** 搜索按钮操作 */
handleQuery () {
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 生成代码操作 */
handleGenTable (row, json) {
handleGenTable(row,json) {
const tableNames = row.tableName || this.tableNames;
if (tableNames == "") {
this.$modal.msgError("请选择要生成的数据");
return;
}
if (json == null) {
json = false;
json = false;
}
if (row.genType === "1") {
genCode(row.tableName, json).then(response => {
if(row.genType === "1") {
genCode(row.tableName,json).then(response => {
this.$modal.msgSuccess("成功生成到自定义路径：" + row.genPath);
});
} else {
this.$download.zip("/tool/gen/batchGenCode?tables=" + tableNames + "&json=" + json, "ruoyi.zip");
this.$download.zip("/tool/gen/batchGenCode?tables=" + tableNames +"&json="+json, "ruoyi.zip");
}
},
/** 同步数据库操作 */
handleSynchDb (row) {
handleSynchDb(row) {
const tableName = row.tableName;
this.$modal.confirm('确认要强制同步"' + tableName + '"表结构吗？').then(function () {
this.$modal.confirm('确认要强制同步"' + tableName + '"表结构吗？').then(function() {
return synchDb(tableName);
}).then(() => {
this.$modal.msgSuccess("同步成功");
}).catch(() => { });
}).catch(() => {});
},
/** 打开导入表弹窗 */
openImportTable () {
openImportTable() {
this.$refs.import.show();
},
/** 重置按钮操作 */
resetQuery () {
resetQuery() {
this.dateRange = [];
this.resetForm("queryForm");
this.handleQuery();
},
/** 预览按钮 */
handlePreview (row, json) {
handlePreview(row,json) {
previewTable(row.tableId, true).then(response => {
this.preview.data = response.data;
this.preview.open = true;
@ -212,39 +315,39 @@ export default {
});
},
/** 高亮显示 */
highlightedCode (code, key) {
highlightedCode(code, key) {
const vmName = key.substring(key.lastIndexOf("/") + 1, key.indexOf(".vm"));
var language = vmName.substring(vmName.indexOf(".") + 1, vmName.length);
const result = hljs.highlight(language, code || "", true);
return result.value || '&nbsp;';
},
/** 复制代码成功 */
clipboardSuccess () {
clipboardSuccess() {
this.$modal.msgSuccess("复制成功");
},
// 多选框选中数据
handleSelectionChange (selection) {
handleSelectionChange(selection) {
this.ids = selection.map(item => item.tableId);
this.tableNames = selection.map(item => item.tableName);
this.single = selection.length != 1;
this.multiple = !selection.length;
},
/** 修改按钮操作 */
handleEditTable (row) {
handleEditTable(row) {
const tableId = row.tableId || this.ids[0];
const tableName = row.tableName || this.tableNames[0];
const params = { pageNum: this.queryParams.pageNum };
this.$tab.openPage("修改[" + tableName + "]生成配置", '/tool/gen-edit/index/' + tableId, params);
},
/** 删除按钮操作 */
handleDelete (row) {
handleDelete(row) {
const tableIds = row.tableId || this.ids;
this.$modal.confirm('是否确认删除表编号为"' + tableIds + '"的数据项？').then(function () {
this.$modal.confirm('是否确认删除表编号为"' + tableIds + '"的数据项？').then(function() {
return delTable(tableIds);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => { });
}).catch(() => {});
}
}
};

3
sf-ui/vue.config.js
View File

@ -35,8 +35,7 @@ module.exports = {
proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: {
// target: `http://192.168.1.23:22009`,
target: `/`,
target: `http://192.168.1.23:22009`,
changeOrigin: true,
pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: ''

2
sf-vertx/Dockerfile
View File

@ -1,4 +1,4 @@
FROM 192.168.5.120:5000/library/maven:latest AS builder
FROM docker.yzj/library/maven:latest AS builder
WORKDIR /app

2
sf-vertx/pom.xml
View File

@ -15,7 +15,7 @@
<properties>
<vertx.version>4.5.7</vertx.version>
<hystrix.version>1.5.2</hystrix.version>
<resilience4j.version>1.7.0</resilience4j.version>
<resilience4j.version>2.2.0</resilience4j.version>
</properties>
<dependencyManagement>

3
sf-vertx/src/main/java/com/sf/vertx/handle/ApiRateLimitHandlerImpl.java
View File

@ -8,9 +8,8 @@ import com.sf.vertx.exception.ServiceException;
import com.sf.vertx.pojo.SacCurrentLimiting;
import com.sf.vertx.utils.AppUtils;
//import io.github.resilience4j.core.functions.CheckedRunnable;
import io.github.resilience4j.core.functions.CheckedRunnable;
import io.github.resilience4j.ratelimiter.RateLimiter;
import io.vavr.CheckedRunnable;
import io.vertx.ext.web.RoutingContext;
import lombok.extern.slf4j.Slf4j;

3
sf-vertx/src/main/java/com/sf/vertx/handle/AppRateLimitHandlerImpl.java
View File

@ -6,9 +6,8 @@ import com.sf.vertx.exception.ServiceException;
import com.sf.vertx.pojo.SacCurrentLimiting;
import com.sf.vertx.utils.AppUtils;
//import io.github.resilience4j.core.functions.CheckedRunnable;
import io.github.resilience4j.core.functions.CheckedRunnable;
import io.github.resilience4j.ratelimiter.RateLimiter;
import io.vavr.CheckedRunnable;
import io.vertx.ext.web.RoutingContext;
import io.vertx.ext.web.handler.HttpException;
import lombok.extern.slf4j.Slf4j;

2
zt-vertx/zt-vertx-service/pom.xml
View File

@ -18,7 +18,7 @@
<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
<vertx.version>4.5.7</vertx.version>
<hystrix.version>1.5.2</hystrix.version>
<resilience4j.version>1.7.0</resilience4j.version>
<resilience4j.version>2.2.0</resilience4j.version>
<fastjson.version>2.0.34</fastjson.version>
<commons.collections.version>3.2.2</commons.collections.version>
<hutool.version>5.8.22</hutool.version>