Skip to content

A
apaas-ui
Commit 53a2f599 authored by 徐一鸣's avatar 徐一鸣
Browse files
Options

服务管理上下架规则修改

parent 25f2196c
Show whitespace changes
Inline Side-by-side
Showing with 406 additions and 22 deletions
src/assets/css/index.css
View file @ 53a2f599
......@@ -609,6 +609,10 @@ width: 620px!important;
color: #999;
cursor: not-allowed;
}
.apass_table .row_action .disabled.hide {
opacity: 0;
cursor: auto;
}
.apass_table .row_action .interval_line {
font-size: 14px;
color: #dde4ff;
......
src/components/apass-table.vue
View file @ 53a2f599
......@@ -25,6 +25,7 @@
<span
v-if="v.disabledRule && v.disabledRule(scope.row)"
class="btn disabled"
:class="{ hide: v.disableHide }"
:key="'btn_' + index + '_' + i"
v-text="v.getLabel ? v.getLabel(scope.row) : v.label"
>
......@@ -42,8 +43,24 @@
v-if="i < item.actionList.length - 1"
class="interval_line"
:key="'line_' + index + '_' + i"
>|</span
>
|
</span>
</template>
<template v-if="item.moreActionList">
<span
class="interval_line"
v-if="item.actionList && item.actionList.length > 0"
>
|
</span>
<a
class="btn"
@mouseenter="mouseenter($event, item.moreActionList, scope.row)"
@mouseleave="mouseleave"
>
更多
</a>
</template>
</div>
<div v-else-if="item.type === 'button'" class="row_action">
......@@ -94,7 +111,7 @@
tag_flag_arr[scope.$index] == 0 &&
scope.row[item.prop].length > 2
"
@click.stop="change_tag(scope.$index, 1)"
@click.stop="changeTag(scope.$index, 1)"
></div>
<div
class="tagclo btn_up"
......@@ -102,7 +119,7 @@
tag_flag_arr[scope.$index] == 1 &&
scope.row[item.prop].length > 2
"
@click.stop="change_tag(scope.$index, 0)"
@click.stop="changeTag(scope.$index, 0)"
></div>
</div>
<div v-else-if="item.type === 'chart'" class="charts">
......@@ -115,16 +132,32 @@
:styles="item.prop == 'cpu' ? spCurveStyles2 : spCurveStyles3"
/>
</sparkline>
<span class="use" v-if="item.prop == 'cpu'&&scope.row.cpu_use"
<span class="use" v-if="item.prop == 'cpu' && scope.row.cpu_use"
>{{ scope.row["cpu_use"] }}.00mm</span
>
<span class="use" :style="scope.row[item.prop].length?{}:{right:'25px',bottom:'8px'}" v-if="item.prop == 'cpu'&&!scope.row.cpu_use"
<span
class="use"
:style="
scope.row[item.prop].length
? {}
: { right: '25px', bottom: '8px' }
"
v-if="item.prop == 'cpu' && !scope.row.cpu_use"
>0mm</span
>
<span class="use" v-if="item.prop == 'mermoy'&&scope.row.memory_use"
<span
class="use"
v-if="item.prop == 'mermoy' && scope.row.memory_use"
>{{ scope.row["memory_use"] }}Mi</span
>
<span class="use" :style="scope.row[item.prop].length?{}:{right:'25px',bottom:'8px'}" v-if="item.prop == 'mermoy'&&!scope.row.memory_use"
<span
class="use"
:style="
scope.row[item.prop].length
? {}
: { right: '25px', bottom: '8px' }
"
v-if="item.prop == 'mermoy' && !scope.row.memory_use"
>0Mi</span
>
</div>
......@@ -210,6 +243,22 @@
</template>
</el-table-column>
</el-table>
<ul
ref="moreActionList"
class="more_action_list"
:style="moreActionStyle"
@mouseenter="enterMoreActionList"
@mouseleave="leaveMoreActionList"
v-show="showMoreActionList"
>
<li
v-for="(item, index) in moreActionList"
:key="'more_' + index"
@click="item.callback"
v-text="item.label"
></li>
</ul>
</div>
</template>
......@@ -257,6 +306,12 @@ export default {
strokeOpacity: 0,
strokeDasharray: "2, 2",
},
moreActionList: [],
showMoreActionList: false,
moreActionStyle: {
top: 0,
left: 0,
},
};
},
mounted() {
......@@ -266,7 +321,7 @@ export default {
);
},
methods: {
change_tag(index, val) {
changeTag(index, val) {
this.$set(this.tag_flag_arr, index, val);
},
sortChange(value) {
......@@ -278,6 +333,42 @@ export default {
getPercent(num) {
return Math.round(num * 100) + "%";
},
mouseenter($event, moreActionList, row) {
let _self = this;
_self.moreActionList = [];
_self.showMoreActionList = true;
_self.moreActionList = moreActionList.map((item) => ({
id: row.id,
label: item.label,
callback() {
_self.showMoreActionList = false;
_self.moreActionList = [];
item.callback && item.callback(row);
},
}));
_self.$nextTick(() => {
let targetInfo = $event.target.getBoundingClientRect();
let containerInfo = _self.$refs.moreActionList.getBoundingClientRect();
_self.moreActionStyle = {
top: targetInfo.y + targetInfo.height + 15 + "px",
left:
targetInfo.x - (containerInfo.width - targetInfo.width) / 2 + "px",
};
});
},
mouseleave() {
this.showMoreActionList = false;
},
enterMoreActionList() {
this.showMoreActionList = true;
},
leaveMoreActionList() {
this.showMoreActionList = false;
},
},
};
</script>
......@@ -389,4 +480,48 @@ export default {
.selected_icon.selected > span {
display: block;
}
.more_action_list {
position: fixed;
}
.more_action_list > li {
padding: 5px 20px;
background-color: #0f2683;
font-size: 12px;
line-height: 20px;
color: #fff;
cursor: pointer;
position: relative;
}
.more_action_list > li:first-child {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.more_action_list > li:first-child::before {
content: "";
position: absolute;
top: -14px;
right: calc(50% - 14px);
width: 28px;
height: 14px;
}
.more_action_list > li:first-child::after {
content: "";
position: absolute;
top: -14px;
right: calc(50% - 7px);
border-top: 0 solid transparent;
border-right: 7px solid transparent;
border-bottom: 14px solid #0f2683;
border-left: 7px solid transparent;
}
.more_action_list > li:last-child {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.more_action_list > li:hover {
background-color: #3f4f9c;
}
.more_action_list > li:first-child:hover::after {
border-bottom: 14px solid #3f4f9c;
}
</style>
src/pages/workbench/component-center/process-management/designer/index.vue
View file @ 53a2f599
<template>
<div>
list
<div class="process-designer-container">
<apass-list
ref="list"
search-placeholder="请输入关键字"
:list-filter="filterList"
:list-header="listHeader"
:list-data="listData"
:list-total="listTotal"
@list-action="init"
:list-padding-left="40"
>
<el-button type="primary" slot="header-left" @click="addNewProcess">
新建流程
</el-button>
<el-breadcrumb separator="/" slot="breadcrumb">
<el-breadcrumb-item>
在线组件工具
</el-breadcrumb-item>
<el-breadcrumb-item>
流程设计
</el-breadcrumb-item>
<el-breadcrumb-item>
流程管理
</el-breadcrumb-item>
</el-breadcrumb>
</apass-list>
<apass-dialog
ref="dialog"
:title="dialogInfo.title"
:msg="dialogInfo.msg"
:submit="dialogInfo.submit"
></apass-dialog>
</div>
</template>
<script>
import helper from "@/services/helper.js";
import apassList from "@/components/apass-list";
import apassDialog from "@/components/apass-dialog";
export default {
components: {
apassList,
apassDialog,
},
data: () => ({
filterList: [
{
name: "服务领域",
},
{
name: "工作区域",
},
{
name: "流程状态",
},
],
listHeader: [],
listData: [],
listTotal: 0,
dialogInfo: {
msg: "",
submit: null,
},
tempFilter: null,
}),
methods: {
init(filter) {
console.log(filter);
this.tempFilter = filter;
this.listTotal = 3;
this.listData = [
{
id: "WF00000001",
name: "保安资格申请流程",
sectors_name: "经济建设",
create_time: "2021-01-01T00:00:00Z",
state: "0",
},
{
id: "WF00000002",
name: "保安考试流程",
sectors_name: "经济建设",
create_time: "2021-01-01T00:00:00Z",
state: "1",
},
{
id: "WF00000003",
name: "申请材料审核流程",
sectors_name: "经济建设",
create_time: "2021-01-01T00:00:00Z",
state: "2",
},
];
},
initFilter() {
Promise.all([
this.$http.get("/apaas/service/v3/service/manager/servtype"),
this.$http.get("/apaas/service/v3/service/manager/servarea"),
])
.then((response) => {
let filterList = response.map((item) => {
return {
name: item.body.data[0].type_name,
prop: item.body.data[0].type_code,
data: item.body.data.map((v) => ({
name: v.name,
value: v.id,
})),
};
});
this.filterList = [
...filterList,
{
name: "流程状态",
prop: "state",
data: [
{
name: "已发布",
value: 2,
},
{
name: "已部署",
value: 1,
},
{
name: "未部署",
value: 0,
},
],
},
];
})
.catch((error) => {
console.log(error);
});
},
refresh() {
this.init(this.tempFilter);
},
addNewProcess() {
console.log("addNewProcess");
},
detailItem(item) {
this.$router.push(`/progress/designer/detail/${item.id}`);
},
publishItem(item) {
console.log(item);
},
editItem(item) {
console.log(item);
},
canceldeployItem(item) {
console.log(item);
},
copyItem(item) {
console.log(item);
},
deleteItem(item) {
console.log(item);
},
},
created() {
this.initFilter();
this.listHeader = [
{
label: "流程编号",
prop: "id",
width: 180,
},
{
label: "流程名称",
prop: "name",
type: "button",
callback: this.detailItem,
},
{
label: "服务领域",
prop: "sectors_name",
align: "center",
width: 240,
},
{
label: "创建时间",
prop: "create_time",
getText(item) {
return helper.dateStringTransform(item.create_time || "");
},
align: "center",
width: 180,
},
{
label: "状态",
prop: "state",
getText(item) {
return ["未部署", "已部署", "已发布"][item.state || 0];
},
align: "center",
width: 180,
},
{
label: "操作",
type: "buttons",
align: "center",
width: 300,
actionList: [
{
label: "发布",
callback: this.publishItem,
disableHide: true,
disabledRule(item) {
return item.state == 2;
},
},
{
label: "编辑",
callback: this.editItem,
},
],
moreActionList: [
{
label: "取消部署",
callback: this.canceldeployItem,
},
{
label: "复制",
callback: this.copyItem,
},
{
label: "删除",
callback: this.deleteItem,
},
],
},
];
},
};
</script>
<style scoped>
.process-designer-container {
height: 100%;
}
</style>
src/pages/workbench/fwgl/fwglList.vue
View file @ 53a2f599
......@@ -1059,21 +1059,22 @@ export default {
return "上架";
} else if (item.state == 1 || item.state == 3) {
return "下架";
} else {
return "-";
}
},
callback(item) {
if (item.state == 2) {
return _self.soldUpItem(item);
if (item.state == 0) {
return null; // 已下架，上架的操作需要普通用户申请
} else
if (item.state == 1) {
return _self.soldOutItem(item); // 已上架，超管用户可以直接下架
} else if (item.state == 2) {
return _self.soldUpItem(item); // 上架审核中，超管用户可以直接上架
} else if (item.state == 3) {
return _self.soldOutItem(item);
} else {
return null;
return _self.soldOutItem(item); // 下架审核中，超管用户可以直接下架
}
},
disabledRule(item) {
return item.state == 0 || item.state == 1;
return item.state == 0;
},
},
{
......@@ -1084,7 +1085,7 @@ export default {
// 只有非下架状态可以删除（已上架，下架审核中）
return item.state == 1 || item.state == 3;
},
},
}, // ["已下架", "已上架", "上架审核中", "下架审核中"]
],
},
];
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment