main
项洋 1 week ago
parent de93b7b254
commit 689c62785a

@ -90,7 +90,3 @@
.el-submenu__icon-arrow {
display: none;
}
.el-dropdown .el-dropdown-link{
color: var(--el-color-primary) !important;
}

@ -4,12 +4,11 @@
@import './element-ui.scss';
@import './sidebar.scss';
@import './btn.scss';
@import './ruoyi.scss';
@import "./font.css";
@import './public.scss';
@import './font.css';
body {
height: 100%;
margin: 0;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
@ -27,6 +26,7 @@ html {
#app {
height: 100%;
background-color: #F2F4F6;
}
*,
@ -124,6 +124,8 @@ aside {
//main-container
.app-container {
height: 100%;
overflow-y: scroll;
padding: 20px;
}
@ -132,6 +134,10 @@ aside {
position: relative;
}
.pagination-container {
margin-top: 30px;
}
.text-center {
text-align: center
}

@ -0,0 +1,527 @@
.L-main {
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
background-color: #F2F4F6;
.content-search {
padding-top: 20px;
margin-bottom: 15px;
background-color: #fff;
border-radius: 5px;
.search-title {
font-family: Alibaba PuHuiTi;
font-weight: bold;
font-size: 16px;
color: #192734;
padding-left: 20px;
position: relative;
padding-bottom: 15px;
border-bottom: 1px solid #F2F4F6;
&::before {
content: "";
display: block;
width: 4px;
height: 20px;
border-radius: 5px;
position: absolute;
top: 0px;
left: 0px;
background-color: #2F8AE5;
}
}
.demo-form-inline {
padding: 20px 20px 30px 20px;
}
.el-form-item {
width: 100%;
.el-form-item__content {
width: calc(100% - 120px);
.el-select {
width: 100%;
}
}
}
.tyshxydm-class {
.el-form-item__content {
width: calc(100% - 140px);
}
}
.unit-form {
.el-form-item__content {
width: 100%;
}
}
}
main {
flex: 1;
padding: 20px 0px;
background-color: #fff;
border-radius: 5px;
.search-title {
display: flex;
justify-content: space-between;
border-bottom: 1px solid #F2F4F6;
padding: 0px 10px 0px 0px;
.search-title-span {
font-family: Alibaba PuHuiTi;
font-weight: bold;
font-size: 16px;
color: #192734;
padding-left: 20px;
position: relative;
&::before {
content: "";
display: block;
width: 4px;
height: 20px;
border-radius: 5px;
position: absolute;
top: 0px;
left: 0px;
background-color: #2F8AE5;
}
}
}
.search-title-two {
padding-bottom: 15px;
}
section {
margin: 10px 0;
padding: 0px 10px;
.el-table {
th {
background: rgba(98, 153, 204, 0.1);
}
td {
border-bottom: none;
}
.evenNumber-row {
background-color: #F6F9FD;
}
}
}
}
}
#L-pagination {
margin-top: 10px;
padding: 0px 10px;
.btn-prev,
.btn-next {
padding: 0px 15px;
}
}
// -
.L-task-info {
height: 100%;
width: 100%;
overflow-y: scroll;
background-color: #f2f2f2;
display: flex;
overflow: hidden;
.el-row {
height: 100%;
display: flex;
.el-col {
height: 100%;
}
}
.info-left,
.info-right {
height: 100%;
background-color: #fff;
border-radius: 5px;
overflow: hidden;
}
.info-left {
flex: 5;
}
.info-right {
flex: 1;
}
.info-right {
margin-left: 10px;
.info-title {
font-family: Alibaba PuHuiTi;
font-weight: bold;
font-size: 16px;
color: #192734;
position: relative;
padding: 15px 0 15px 20px;
border-bottom: 1px solid #F2F4F6;
&::before {
content: "";
display: block;
width: 4px;
height: 20px;
border-radius: 5px;
position: absolute;
top: 15px;
left: 0px;
background-color: #2F8AE5;
}
}
.timeline {
padding: 20px;
height: calc(100% - 60px);
overflow-y: scroll;
.timeline-items {
display: flex;
align-items: center;
margin-bottom: 40px;
.left-box {
position: relative;
.main-img {
width: 45px;
margin-right: 20px;
}
.icon-jt {
position: absolute;
width: 15px;
height: 7px;
bottom: -20px;
left: 15px;
}
}
.right-box {
display: flex;
flex-direction: column;
justify-content: space-between;
.span-title {
font-family: Alibaba PuHuiTi;
font-weight: 500;
font-size: 14px;
color: #192734;
margin-bottom: 8px;
}
.span-time {
font-family: Alibaba PuHuiTiR;
font-weight: 400;
font-size: 14px;
color: #5C6166;
}
}
}
}
}
}
.audit-pages-box,
.info-left {
height: 100%;
background-color: #fff;
border-radius: 5px;
.content-info {
padding: 15px 0;
margin-bottom: 15px;
background-color: #fff;
border-radius: 5px;
.info-title {
font-family: Alibaba PuHuiTi;
font-weight: bold;
font-size: 16px;
color: #192734;
padding-left: 20px;
position: relative;
padding-bottom: 15px;
border-bottom: 1px solid #F2F4F6;
&::before {
content: "";
display: block;
width: 4px;
height: 20px;
border-radius: 5px;
position: absolute;
top: 0px;
left: 0px;
background-color: #2F8AE5;
}
}
.teshu-top-info {
padding: 0px 20px;
}
.top-info {
padding: 20px;
background: #FAFBFC;
.top-row {
margin-bottom: 20px;
}
.el-col {
color: #192733;
font-family: Alibaba PuHuiTi;
font-weight: 400;
font-size: 14px;
span {
font-family: Alibaba PuHuiTi;
font-weight: 400;
font-size: 14px;
color: #5C6166;
}
}
}
}
.content-info-two {
// border-bottom: 1px solid #ccc;
// margin-bottom: 20px;
}
.info-cut-off-rule {
border-bottom: 1px solid #F2F4F6;
display: flex;
margin-bottom: 20px;
div {
padding: 10px;
padding: 5px 15px;
border: 1px solid #e0dddd;
font-weight: 400;
font-family: Alibaba PuHuiTiR;
font-size: 14px;
color: #000000;
border-bottom: none;
background-color: #e0dddd;
cursor: pointer;
margin-right: 10px;
}
.left-tab {
margin-left: 20px;
border-right: none;
}
.active-tab {
color: #fff;
background-color: #1485EF;
border: 1px solid #1485EF;
}
}
.info-cut-off-rule-my {
padding-top: 15px;
padding-bottom: 15px;
border-bottom: 1px solid #F2F4F6;
margin-bottom: 20px;
.info-title {
font-family: Alibaba PuHuiTi;
font-weight: bold;
font-size: 16px;
color: #192734;
padding-left: 20px;
position: relative;
&::before {
content: "";
display: block;
width: 4px;
height: 20px;
border-radius: 5px;
position: absolute;
top: 0px;
left: 0px;
background-color: #2F8AE5;
}
}
}
.info-bottom-box {
padding: 0px 20px;
section {
.el-table {
th {
background: rgba(98, 153, 204, 0.1);
}
td {
border-bottom: none;
}
.evenNumber-row {
background-color: #F6F9FD;
}
}
}
}
}
.audit-pages-box-two,
.info-left-two {
background-color: #F2F4F6 !important;
display: flex;
flex-direction: column;
.renwuxiangqing {
flex: 1;
background-color: #fff;
border-radius: 5px;
}
}
// ---
.taskDialogBox {
.select-box {
position: relative;
.el-select {
width: 100%;
}
.btn-box {
position: absolute;
right: calc(-100% - 10px);
}
}
.newTask-form-item {
.el-form-item__content {
text-align: center;
}
}
}
// form--
.L-assets-info {
height: 100%;
padding: 20px 40px 20px 10px;
overflow-y: scroll;
.assets-info-top {
height: calc(100% - 20px);
.top-title-box {
font-weight: 700;
font-size: 18px;
color: #3D3D3D;
padding-left: 30px;
}
.top-title-two-box {
font-weight: 700;
font-size: 16px;
color: #3D3D3D;
padding-left: 50px;
}
.assets-info-box {
// padding-bottom: 100px;
.demo-ruleForm {
.upload-file {
cursor: pointer;
}
.el-select,
.el-autocomplete,
.el-date-editor,
.el-cascader {
width: 100%;
}
// 访
.fangwenwangzhi {
.el-input-group__prepend {
padding: 0 10px;
}
.el-input--suffix {
width: 80px;
.el-input__suffix {
right: 15px;
}
}
.wangzhispan {
margin-left: 15px;
}
}
// IpPort
.IpPort {
.line {
text-align: center;
}
}
//
// .yumingdaoqishijian,.shiyongshijian {
// .el-date-editor {
// width: 100%;
// }
// }
//
.daoqitixingren {
.el-form-item__content {
.el-row {
display: flex;
}
}
}
}
}
}
}
input[aria-hidden="true"] {
display: none !important;
}
.el-radio:focus:not(.is-focus):not(:active):not(.is-disabled) .el-radio__inner {
box-shadow: none;
}
.bottomclass {
text-align: center;
background-color: #fff;
}

@ -9,7 +9,7 @@
:props="defaultProps"
:expand-on-click-node="false"
:filter-node-method="filterNode"
ref="tree"
ref="treeRef"
node-key="id"
default-expand-all
highlight-current
@ -21,7 +21,7 @@
<div class="L-main" id="L-size-main">
<div class="content-search" id="L-header">
<div class="search-title">查询条件</div>
<el-form :inline="true" ref="queryForm" :model="formInline" size="small" class="demo-form-inline">
<el-form :inline="true" ref="queryFormRef" :model="formInline" size="small" class="demo-form-inline">
<el-row>
<el-col :span="6">
<el-form-item label="所属单位:" prop="dwmc">
@ -49,8 +49,8 @@
</el-col>
<el-col :span="6" style="text-align: right;">
<el-form-item class="unit-form">
<el-button size="mini" @click="resetQuery('queryFrom')"></el-button>
<el-button size="mini" type="primary" @click="handleQuery('queryFrom')"></el-button>
<el-button size="small" @click="resetQuery('queryFrom')"></el-button>
<el-button size="small" type="primary" @click="handleQuery('queryFrom')"></el-button>
</el-form-item>
</el-col>
</el-row>
@ -89,8 +89,8 @@
<el-button
type="info"
plain
icon="el-icon-upload2"
size="mini"
:icon="Upload"
size="small"
@click="handleImport"
>导入</el-button>
</el-col>
@ -98,8 +98,8 @@
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
:icon="Download"
size="small"
@click="handleExport"
>导出</el-button>
</el-col>
@ -107,8 +107,8 @@
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
:icon="Plus"
size="small"
@click="handleAdd"
>新增资产</el-button>
</el-col>
@ -120,13 +120,13 @@
<el-table-column label="移动应用名称" key="appName" prop="appName" align="center" />
<el-table-column label="所属单位" key="ssdw" prop="ssdw" align="center" />
<!-- <el-table-column label="icp备案状态" key="dwmc" prop="dwmc" align="center">
<template slot-scope="scope">
<template #default="scope">
<dict-tag :options="dict.type.project_middle_type" :value="scope.row.projectMiddleType"/>
</template>
</el-table-column> -->
<el-table-column label="新增时间" key="createTime" prop="createTime" align="center" />
<el-table-column label="移动应用系统状态" key="status" prop="status" class-name="table-status" align="center">
<!-- <template slot-scope="scope">
<!-- <template #default="scope">
<span v-if="scope.row.icpState == 1" style="color: #F58A0C;">
未备案
</span>
@ -137,7 +137,7 @@
非网站系统
</span>
</template> -->
<template slot-scope="scope">
<template #default="scope">
<span v-if="scope.row.appState == 1" style="color: #16B771;">
正常
</span>
@ -162,7 +162,7 @@
</template>
</el-table-column>
<el-table-column label="操作" prop="userId" class-name="table-operation" align="center">
<template slot-scope="scope">
<template #default="scope">
<div style="display: flex;align-items: center;justify-content: center;">
<div style="display: flex;align-items: center;cursor: pointer;" @click="goInfo(scope.row,1)">
<img src="@/assets/images/icon-ck@2x.png" alt="" style="width: 20px;margin-right: 5px;">
@ -187,13 +187,13 @@
:page="formInline.current"
:limit="formInline.size"
@pagination="getPagination"
:current-page.sync="formInline.current"
:current-page="formInline.current"
></my-pagination>
</main>
<!-- 资产导入对话框 -->
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
<el-dialog v-model="upload.open" :title="upload.title" width="400px" append-to-body>
<el-upload
ref="upload"
ref="uploadRef"
:limit="1"
accept=".xlsx, .xls"
:headers="upload.headers"
@ -204,223 +204,261 @@
:auto-upload="false"
drag
>
<i class="el-icon-upload"></i>
<el-icon><Upload /></el-icon>
<div class="el-upload__text">将文件拖到此处<em>点击上传</em></div>
<div class="el-upload__tip text-center" slot="tip">
<!-- <div class="el-upload__tip" slot="tip">
<el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的用户数据
</div> -->
<span>仅允许导入xlsxlsx格式文件</span>
<el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="importTemplate"></el-link>
</div>
<template #tip>
<div class="el-upload__tip text-center">
<!-- <div class="el-upload__tip">
<el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的用户数据
</div> -->
<span>仅允许导入xlsxlsx格式文件</span>
<el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="importTemplate"></el-link>
</div>
</template>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm"> </el-button>
<el-button @click="upload.open = false"> </el-button>
</div>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="submitFileForm"> </el-button>
<el-button @click="upload.open = false"> </el-button>
</div>
</template>
</el-dialog>
</div>
</el-col>
</el-row>
</template>
<script>
<script setup>
import { ref, reactive, onMounted, onUnmounted, nextTick } from 'vue'
import { useRouter, useRoute } from 'vue-router'
import { ElMessage, ElMessageBox } from 'element-plus'
import { Download, Upload, Plus } from '@element-plus/icons-vue'
import myPagination from "@/views/components/Pagination/index.vue"
// import myDialog from "@/views/components/myDialog/index.vue"
import { getToken } from "@/utils/auth";
import { assetAppList, deleteAssetApp, schema } from "@/api/auditPagesApi/index";
export default {
dicts: ['zc_xtzt','zc_xtlx'],
components:{myPagination},
data() {
return {
//
deptOptions: undefined,
defaultProps: {
children: "children",
label: "label"
},
formInline:{
dwmc:"",
yymc:"",
startTime:"",
endTime:"",
current:1,
size:10,
},
time:[],
total:0,
tableData:[],
loading:false,
tabHeader: undefined,
//
upload: {
//
open: false,
//
title: "移动应用程序资产导入",
//
isUploading: false,
//
updateSupport: 0,
//
headers: { Authorization: "Bearer " + getToken() },
//
// url: process.env.VUE_APP_BASE_API + "/tc/assetApp/importData"
url: location.origin + "/api/tc/assetApp/importData"
},
}
},
mounted(){
if( Object.keys(this.$route.params).length != 0) {
this.formInline = this.$route.params;
}else{
this.formInline.current = 1
this.formInline.size = 20
import { getToken } from "@/utils/auth"
import { assetAppList, deleteAssetApp, schema } from "@/api/auditPagesApi/index"
const router = useRouter()
const route = useRoute()
//
const deptOptions = ref(undefined)
const defaultProps = reactive({
children: "children",
label: "label"
})
const formInline = reactive({
dwmc: "",
yymc: "",
startTime: "",
endTime: "",
current: 1,
size: 10,
})
const time = ref([])
const total = ref(0)
const tableData = ref([])
const loading = ref(false)
const tabHeader = ref(undefined)
// refs
const treeRef = ref(null)
const queryFormRef = ref(null)
const uploadRef = ref(null)
//
const upload = reactive({
//
open: false,
//
title: "移动应用程序资产导入",
//
isUploading: false,
//
updateSupport: 0,
//
headers: { Authorization: "Bearer " + getToken() },
//
// url: import.meta.env.VITE_APP_BASE_API + "/tc/assetApp/importData"
url: location.origin + "/api/tc/assetApp/importData"
})
onMounted(() => {
if (Object.keys(route.params).length != 0) {
Object.assign(formInline, route.params)
} else {
formInline.current = 1
formInline.size = 20
}
getList()
getDeptTree()
cancalDebounce()
window.addEventListener('resize', cancalDebounce)
})
onUnmounted(() => {
window.removeEventListener('resize', cancalDebounce)
})
//
const getDeptTree = () => {
schema({type:4}).then(response => {
deptOptions.value = response.data
})
}
//
const filterNode = (value, data) => {
if (!value) return true
return data.label.indexOf(value) !== -1
}
//
const handleNodeClick = (data) => {
formInline.deptId = data.id
handleQuery()
}
//
const getList = () => {
loading.value = true
assetAppList(formInline).then(res => {
loading.value = false
total.value = res.data.total
tableData.value = res.data.records
})
}
//
const resetQuery = () => {
queryFormRef.value?.resetFields()
time.value = []
formInline.deptId = undefined
treeRef.value?.setCurrentKey(null)
handleQuery()
}
//
const handleQuery = () => {
formInline.current = 1
if (time.value && time.value.length > 0) {
formInline.startTime = time.value[0]
formInline.endTime = time.value[1]
}
getList()
}
//
const getPagination = (pages) => {
formInline.current = pages.page
formInline.size = pages.limit
getList()
}
//
const handleImport = () => {
upload.open = true
}
//
const handleExport = () => {
download('/tc/assetApp/export', {
...formInline
}, `移动应用程序资产${new Date().getTime()}.xlsx`)
}
/** 下载模板操作 */
const importTemplate = () => {
download('/tc/assetApp/importTemplate', {
}, `移动应用程序资产导入模板${new Date().getTime()}.xlsx`)
}
//
const handleFileUploadProgress = () => {
upload.isUploading = true
}
//
const handleFileSuccess = (response) => {
upload.open = false
upload.isUploading = false
uploadRef.value.clearFiles()
ElMessageBox.alert(`<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>${response.msg}</div>`, "导入结果", {
dangerouslyUseHTMLString: true
})
getList()
}
//
const submitFileForm = () => {
uploadRef.value.submit()
}
//
const handleAdd = () => {
router.push({
name: 'AssetsAuth',
query: {
pageType: "add",
type: 4,
}
this.getList();
this.getDeptTree();
this.cancalDebounce();
window.addEventListener('resize', this.cancalDebounce);
},
destroyed() {
window.removeEventListener('resize', this.cancalDebounce);
},
methods:{
/** 查询部门下拉树结构 */
getDeptTree() {
schema({type:4}).then(response => {
this.deptOptions = response.data;
});
},
//
filterNode(value, data) {
if (!value) return true;
return data.label.indexOf(value) !== -1;
},
//
handleNodeClick(data) {
this.formInline.deptId = data.id;
this.handleQuery();
},
//
getList(){
this.loading = true;
assetAppList(this.formInline).then(res=>{
this.loading = false;
this.total = res.data.total;
this.tableData = res.data.records;
})
},
//
resetQuery(){
this.resetForm("queryForm");
this.time = [];
this.formInline.deptId = undefined;
this.$refs.tree.setCurrentKey(null);
this.handleQuery();
},
//
handleQuery(){
this.formInline.current = 1;
if(this.time) {
this.formInline.startTime = this.time[0]
this.formInline.endTime = this.time[1]
})
}
//
const goInfo = (row, id) => {
if (id == 1) {
router.push({
name: 'AssetsAuth',
query: {
pageType: "look",
type: 4,
id: row.id,
queryData: formInline
}
this.getList();
},
//
getPagination(pages){
this.formInline.current = pages.page;
this.formInline.size = pages.limit;
this.getList();
},
//
handleImport(){
this.upload.open = true;
},
//
handleExport(){
this.download('/tc/assetApp/export', {
...this.formInline
}, `移动应用程序资产${new Date().getTime()}.xlsx`)
},
/** 下载模板操作 */
importTemplate() {
this.download('/tc/assetApp/importTemplate', {
}, `移动应用程序资产导入模板${new Date().getTime()}.xlsx`)
},
//
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
},
//
handleFileSuccess(response, file, fileList) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
this.getList();
},
//
submitFileForm() {
this.$refs.upload.submit();
},
//
handleAdd(){
this.$router.push({name: 'AssetsAuth',query: {
pageType: "add",
type:4,
}})
},
//
goInfo(row,id){
if(id == 1) {
this.$router.push({name: 'AssetsAuth',query: {
pageType: "look",
type:4,
id:row.id,
queryData:this.formInline
}})
} else if(id == 2) {
this.$router.push({name: 'AssetsAuth',query: {
pageType: "change",
type:4,
id:row.id,
queryData:this.formInline
}})
} else if(id == 3) {
const userIds = row.id;
this.$modal.confirm('是否确认删除用户编号为"' + userIds + '"的数据项?').then(function() {
return deleteAssetApp(userIds);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
}
},
//
edit(){
},
//
delInfo(){},
// table
tableRowClassName({row, rowIndex}){
if (rowIndex % 2 !== 0) {
return 'evenNumber-row';
})
} else if (id == 2) {
router.push({
name: 'AssetsAuth',
query: {
pageType: "change",
type: 4,
id: row.id,
queryData: formInline
}
return '';
},
//
cancalDebounce(){
const element = document.getElementById('L-size-main'); // ID
const header = document.getElementById('L-header'); // ID
const pagination = document.getElementById('L-pagination'); // ID
const elementHeight = element.offsetHeight;
const headerHeight = header.offsetHeight;
const paginationtHeight = pagination.offsetHeight;
this.tabHeader = elementHeight - headerHeight - paginationtHeight - 110;
})
} else if (id == 3) {
const userIds = row.id
ElMessageBox.confirm('是否确认删除用户编号为"' + userIds + '"的数据项?').then(() => {
return deleteAssetApp(userIds)
}).then(() => {
getList()
ElMessage.success("删除成功")
}).catch(() => {})
}
}
// table
const tableRowClassName = ({rowIndex}) => {
if (rowIndex % 2 !== 0) {
return 'evenNumber-row'
}
return ''
}
//
const cancalDebounce = () => {
nextTick(() => {
const element = document.getElementById('L-size-main')
const header = document.getElementById('L-header')
const pagination = document.getElementById('L-pagination')
if (element && header && pagination) {
const elementHeight = element.offsetHeight
const headerHeight = header.offsetHeight
const paginationtHeight = pagination.offsetHeight
tabHeader.value = elementHeight - headerHeight - paginationtHeight - 110
}
},
})
}
</script>

Loading…
Cancel
Save