hi-ucs/back/src/views/modules/ability/bsabilityai.vue

351 lines
10 KiB
Vue

<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-ability__bsabilityai">
<el-form :inline="true" :model="dataForm">
<el-form-item>
<el-input
v-model="dataForm.name"
placeholder="名称"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getDataList2(dataForm.name)">{{
$t("query")
}}</el-button>
</el-form-item>
<el-form-item>
<el-button type="info" @click="exportHandle()">{{
$t("export")
}}</el-button>
</el-form-item>
<el-form-item>
<el-button
v-if="$hasPermission('ability:bsabilityai:save')"
type="primary"
@click="addOrUpdateHandleAI()"
>挂接</el-button
>
</el-form-item>
<el-form-item>
<el-button
v-if="$hasPermission('ability:bsabilityai:delete')"
type="danger"
@click="deleteHandle2()"
>{{ $t("deleteBatch") }}</el-button
>
</el-form-item>
<el-form-item>
<el-button @click="reset">重置</el-button>
</el-form-item>
</el-form>
<el-table
v-loading="dataListLoading"
v-if="dataList[0].infoList"
:data="dataList"
:height="qp ? '650px' : '650px'"
border
@selection-change="dataListSelectionChangeHandle"
style="width: 100%"
>
<el-table-column
type="selection"
header-align="center"
align="center"
width="50"
></el-table-column>
<af-table-column
prop="name"
label="组件名称"
header-align="center"
align="center"
></af-table-column>
<af-table-column
v-for="(item, index) in dataList[0].infoList"
:key="index"
:label="item.attrType"
header-align="center"
align="center"
>
<template slot-scope="scope">
{{ findValue(scope.row.infoList, item.attrType) }}
</template>
</af-table-column>
<el-table-column
:label="$t('handle')"
fixed="right"
header-align="center"
align="center"
width="150"
>
<template slot-scope="scope">
<el-button
v-if="$hasPermission('ability:bsabilityai:update')"
type="text"
size="small"
@click="UpdateHandle(scope.row)"
>{{ $t("update") }}</el-button
>
<el-button
v-if="$hasPermission('ability:bsabilityai:delete')"
type="text"
size="small"
@click="deleteHandle2(scope.row.id)"
>{{ $t("delete") }}</el-button
>
<el-button type="text" size="small" @click="showDetail(scope.row)"
>展示</el-button
>
<el-button type="text" size="small" @click="showDocument(scope.row)"
>开发文档</el-button
>
<el-button type="text" size="small" @click="showRelateApplication(scope.row)">关联应用</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
:current-page="page"
:page-sizes="[10, 20, 50, 100]"
:page-size="limit"
:total="Number(total)"
layout="total, sizes, prev, pager, next, jumper"
@size-change="pageSizeChangeHandle"
@current-change="pageCurrentChangeHandle"
>
</el-pagination>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update
:disabled="disabled"
v-if="addOrUpdateVisible"
ref="addOrUpdate"
@refreshDataList="getDataList"
></add-or-update>
<relate-application v-if="relateApplicationVisible" ref="relateApplication" :relateInfo="relateInfo" @isShowRelatePopup="handleIsShowRelatePopup"></relate-application>
</div>
</el-card>
</template>
<script>
import mixinViewModule from "@/mixins/view-module";
import AddOrUpdate from "./bsabilityai-add-or-update";
import dictionaries from "@/utils/dictionaries";
import qs from "qs";
import RelateApplication from "./bsabilityai-relate-application.vue"
export default {
mixins: [mixinViewModule],
data() {
return {
mixinViewModuleOptions: {
getDataListURL: "/resource/page",
getDataListIsPage: true,
exportURL: "/ability/bsabilityai/export",
deleteURL: "/resource/delete",
deleteIsBatch: true,
},
disabled: false,
sceneArr: dictionaries.sceneArr,
fieldArr: dictionaries.fieldArr,
shareFormArr: dictionaries.shareFormArr,
dataForm: {
name: "",
creator: "",
delFlag: 0,
selectType: 0,
type: "组件服务",
},
qp: false,
// 关联应用弹窗
relateApplicationVisible: false,
relateInfo: {
id: '',
responseData: {},
linkType: ''
}
};
},
watch: {},
components: {
AddOrUpdate,
RelateApplication
},
created() {
this.dataForm.name = "";
this.dataForm.type = "组件服务";
},
mounted() {
window.addEventListener("resize", this.a);
this.fullScreen();
},
methods: {
reset() {
this.$http
.get(
this.mixinViewModuleOptions.getDataListURL +
"?" +
qs.stringify({
// order: this.order,
// orderField: this.orderField,
// type: '组件服务',
page: 1,
limit: 10,
creator: "",
selectType: 0,
delFlag: 0,
type: "组件服务",
name: "",
})
)
.then(({ data: res }) => {
this.dataForm.name = "";
if (res.code !== 0) {
this.dataList = [];
this.total = 0;
return this.$message.error(res.msg);
}
this.dataList = this.mixinViewModuleOptions.getDataListIsPage
? res.data.list
: res.data;
this.total = this.mixinViewModuleOptions.getDataListIsPage
? res.data.total
: 0;
if (this.mixinViewModuleOptions.requestCallback) {
this.mixinViewModuleOptions.requestCallback(res.data);
}
this.dataListLoading = false;
})
.catch(() => {
this.dataListLoading = false;
});
},
findValue(list, type) {
const found = list.find((item) => item.attrType === type);
if (found) {
return found.attrValue;
} else {
return "暂无数据";
}
},
showDetail(val) {
// this.addOrUpdateHandle(id)
this.addOrUpdateVisible = true;
this.disabled = false;
console.log("显示数据=============》", val);
this.$nextTick(() => {
this.$refs.addOrUpdate.UpdateState = false;
this.$refs.addOrUpdate.dataFormShowDetails = val;
this.$refs.addOrUpdate.init();
});
this.disabled = true;
},
showDocument(val) {
console.log(val);
window.open(
window.SITE_CONFIG.frontUrl + "?id=" + val.id + "&&type=" + val.type,
"_blank"
);
},
getDataList2(names) {
if (names != null) {
this.$http
.get(
this.mixinViewModuleOptions.getDataListURL +
"?" +
qs.stringify({
// order: this.order,
// orderField: this.orderField,
// type: '组件服务',
pageNum: 1,
pageSize: this.limit,
type: "组件服务",
creator: "",
selectType: 0,
delFlag: 0,
name: names,
})
)
.then(({ data: res }) => {
console.log("res", res);
if (res.code !== 0) {
this.dataList = [];
this.total = 0;
return this.$message.error(res.msg);
}
if (res.data.list.length !== 0) {
this.dataList = res.data.list;
this.total = this.mixinViewModuleOptions.getDataListIsPage
? res.data.total
: 0;
if (this.mixinViewModuleOptions.requestCallback) {
this.mixinViewModuleOptions.requestCallback(res.data);
}
this.dataListLoading = false;
} else {
this.$message.error("未查询到相关信息");
this.reset();
}
})
.catch(() => {
this.dataListLoading = false;
});
} else {
this.$message.error("查询信息不能为空");
}
},
fullScreen() {
if (window.outerHeight === screen.availHeight) {
if (window.outerWidth === screen.availWidth) {
console.log(
"全屏1",
window.outerHeight,
screen.availHeight,
window.outerWidth,
screen.availWidth
);
this.qp = false;
} else {
console.log(
"不是全屏2",
window.outerHeight,
screen.availHeight,
window.outerWidth,
screen.availWidth
);
this.qp = true;
}
} else {
console.log(
"不是全屏3",
window.outerHeight,
screen.availHeight,
window.outerWidth,
screen.availWidth
);
this.qp = true;
}
},
// 点击关联应用按钮
showRelateApplication(row){
this.$http.get(`dataResourceRel/queryApplicationRelByResourceId?referenceId=${row.id}`).then(({ data: res }) => {
if( res && res.data ) {
this.relateApplicationVisible = true;
this.relateInfo = {
id: row.id,
responseData: res.data,
linkType: '2'
};
}
}).catch(() => { })
},
// 是否展示关联应用弹窗
handleIsShowRelatePopup(type) {
this.relateApplicationVisible = type;
}
},
};
</script>
<style lang="scss" scoped>
.el-tooltip__popper {
max-width: 50%;
}
</style>