|
@@ -0,0 +1,978 @@
|
|
|
+<template>
|
|
|
+ <div :style="pageTableHeight" class="TablePage">
|
|
|
+ <PublicPageHeader class="TablePage_header" :page-title="dataTitle ? dataTitle : pageTitle">
|
|
|
+ <template slot="d_foot">
|
|
|
+ <SimpleQuery v-if="simpleQueryFlag" :selectOptions="advancedQueryValue" :simple-query-item="simpleQueryItem" @queryValue="queryValue" />
|
|
|
+ </template>
|
|
|
+ <template v-if="pageAuthBtnInstall">
|
|
|
+ <el-button size="small" type="primary" @click="onInstall">初始化</el-button>
|
|
|
+ </template>
|
|
|
+ <AuthButton :auth="pageAuthBtnAdd" />
|
|
|
+ <AuthButton :auth="pageAuthBtnQuery" />
|
|
|
+ <AuthButton :auth="pageAuthBtnExport" />
|
|
|
+ </PublicPageHeader>
|
|
|
+ <div :style="pageTableContentHeight" class="TablePage_content flex-wrap">
|
|
|
+ <template v-if="!dataFlag">
|
|
|
+ <div v-if="treeData.length" class="TablePage_content_left">
|
|
|
+ <PublicPageTree ref="pageTree" :tree-data="treeData" :dep-math="depMath" :tree-map="treeNodeMap" @treeNodeClick="treeNodeClick" />
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div :class="dataFlag ? 'tableAuto' : treeData.length ? 'tableSacle' : 'tableAuto'" class="TablePage_content_right">
|
|
|
+ <PublicPageTable ref="table" :loading="loading" :selected="selected" :table-cols="tableCols" :table-btns="authBtns" :data="tableData" :header-cell-class-name="headerCellClass" :row-class-name="rowClass" :cell-class-name="cellClass" :formatter="tableFormatter" :selectedDatas="selectedDatas" :selectedCheck="selectedDataCheck" :show-summary="summaryFlag" @mounted="tableMountedHandler" @load="load" @cell-click="cellClickHandler" @handleDetail="handleDetail" @handleEdit="handleEdit" @handleOther="handleOther" @handleRemove="handleRemove" @handleSelectionChange="handleSelectionChange" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="TablePage_dialog">
|
|
|
+ <!--新增/编辑-->
|
|
|
+ <PublicPageDialog :dialog-body="authId ? true : false " :dialog-loading="dialogLoading" :dialog-title="tableTitle" dialogSize="630px" :form-auth="formAuth" :dialog-drawer="flag" @handleClose="submitClickClose('ruleForm')" @handleSubmit="submitClickHandler">
|
|
|
+ <PublicPageForm ref="ruleForm" :label-width="labelWidth" :form-pass="tableData" :form-type="tableType" :form-item="formItem" :form-data="tableForm" />
|
|
|
+ </PublicPageDialog>
|
|
|
+ <!--高级查询-->
|
|
|
+ <PublicPageDialog dialog-title="高级查询" dialogSize="600px" :dialog-drawer="advancedDrawer" @handleClose="advancedClose" @handleSubmit="advancedTable('advancedDialogForm')">
|
|
|
+ <AdvancedQuery ref="advancedDialogForm" :selectOptions="simpleQueryValue" @getAdvancedQueryData="getAdvancedQueryData" />
|
|
|
+ <template slot="d_foot">
|
|
|
+ <el-button size="small" @click="restCollect('advancedDialogForm')" type="warning">重置</el-button>
|
|
|
+ <el-button size="small" @click="queryCollect('advancedDialogForm')" type="primary">收藏</el-button>
|
|
|
+ </template>
|
|
|
+ </PublicPageDialog>
|
|
|
+ <!--初始化-->
|
|
|
+ <PublicPageDialog dialog-title="初始化" dialogSize="600px" :dialog-drawer="installFlag" @handleClose="installClose" @handleSubmit="installTable('installForm')">
|
|
|
+ <AuthInstall ref="installForm" />
|
|
|
+ </PublicPageDialog>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import PublicPageHeader from '@/components/PublicPageHeader'
|
|
|
+import PublicPageTable from '@/components/SimpleTable'
|
|
|
+import PublicPageTree from '@/components/publicPageTree'
|
|
|
+import PublicPageDialog from '@/components/PublicPageDialog'
|
|
|
+import PublicPageForm from '@/components/publicPageForm'
|
|
|
+import AdvancedQuery from '@/components/AdvancedQuery'
|
|
|
+import AuthButton from '@/components/AuthButton'
|
|
|
+import AuthInstall from '@/components/AuthInstall'
|
|
|
+import SimpleQuery from '@/components/SimpleQuery'
|
|
|
+import { mapGetters } from 'vuex'
|
|
|
+import { Query, newData, modifyData, moveData, start, stop, startAll, stopAll } from "@/api/webApi"
|
|
|
+import { formatChange, listToTree } from '@/utils/validate'
|
|
|
+import { exportToExcel } from '@/utils/table'
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: 'TablePage',
|
|
|
+ components: { PublicPageHeader, PublicPageTable, PublicPageDialog, PublicPageTree, PublicPageForm, AdvancedQuery, AuthButton, SimpleQuery, AuthInstall },
|
|
|
+ props: {
|
|
|
+ dataTitle: {
|
|
|
+ type: String,
|
|
|
+ default: ''
|
|
|
+ },
|
|
|
+ dataFlag: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false
|
|
|
+ },
|
|
|
+ msgContent: {
|
|
|
+ type: Object,
|
|
|
+ default: () => new Object()
|
|
|
+ },
|
|
|
+ authId: {
|
|
|
+ type: Number,
|
|
|
+ default: 0
|
|
|
+ },
|
|
|
+ authQuery: {
|
|
|
+ type: Object,
|
|
|
+ default: () => new Object()
|
|
|
+ },
|
|
|
+ routerlist:{
|
|
|
+ type: Object,
|
|
|
+ default: () => new Object()
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ page: 0, //当前table页面
|
|
|
+ noMore: false, //当前table是否加载到最后开关
|
|
|
+ loading: false, //页面加载
|
|
|
+ dialogLoading: false, //新增/编辑确认按钮禁用
|
|
|
+ advancedDrawer: false, //高级查询弹框开关
|
|
|
+ defaultfilter: { 1: 1 }, //默认查询参数
|
|
|
+ pageQuery: {},
|
|
|
+ installFlag: false,
|
|
|
+ dialogFlag: false,
|
|
|
+ dialogName: '', //弹框名称
|
|
|
+ pageTitle: '', //页面名称
|
|
|
+ treeData: [], //tree数据
|
|
|
+ treeParameters: {}, //tree传递参数
|
|
|
+ treeNodeMap: {}, //tree传递map
|
|
|
+ tableCols: [], //表头数据
|
|
|
+ tableData: [], //表格数据
|
|
|
+ tableBtns: [], //表格按钮权限
|
|
|
+ authBtns: [], //表格里面的操作按钮
|
|
|
+ tableBtnForms: [], //表格按钮下的form表单权限
|
|
|
+ dataContent: {}, //表格查询数据
|
|
|
+ pageServiceId: null, //表格serviceid
|
|
|
+ formItem: [], //弹框表单渲染数据
|
|
|
+ flag: false, //弹框表单开关
|
|
|
+ formAuth: true, //弹框表单按钮开关
|
|
|
+ tableType: "add", //弹框表单弹框类型
|
|
|
+ tableTitle: "新增", //弹框表单标题
|
|
|
+ tableForm: {}, //弹框表单数据
|
|
|
+ rmFlag: false, //删除弹框开关
|
|
|
+ rmTitle: '', //删除弹框标题
|
|
|
+ tableObj: {}, //删除数据
|
|
|
+ tableOptions: {}, //表单数据下拉
|
|
|
+ labelWidth: '120px', //表单文字距离
|
|
|
+ fromDataReqCatch: [], //表单规则缓存
|
|
|
+ tableKey: null,//表格主键
|
|
|
+ depMath: 0,
|
|
|
+ selected: 0, //是否勾选
|
|
|
+ selectedDatas: [], //回显勾选的数据
|
|
|
+ selectedDatasCath: [],//回显数据缓存
|
|
|
+ selectedDataAlls: [], //勾选数据
|
|
|
+ selectedDataCheck: {}, //勾选树-选中
|
|
|
+ triggerserviceid: null, //勾选后查询的serviceid
|
|
|
+ summaryFlag: false, //是否显示合计行
|
|
|
+ simpleQueryFlag: false, //是否开启了简易查询
|
|
|
+ simpleQueryItem: [], //简易查询表单数据项
|
|
|
+ simpleQueryValue: [], //简易查询缓存值
|
|
|
+ advancedQueryValue: [], //高级查询缓存值
|
|
|
+ pageSizeDatas: ['outairportpage', 'landairportpage', 'transairportpage'],
|
|
|
+ pageInstall: 'permissionsManagementPage'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(['authArrs']),
|
|
|
+ pageTableHeight () {
|
|
|
+ if (this.dataFlag) return 'height:100%'
|
|
|
+ if (this.authId) return 'height:calc(100vh - 180px);padding:0'
|
|
|
+ return ''
|
|
|
+ },
|
|
|
+ pageTableContentHeight () {
|
|
|
+ if (this.dataFlag) return 'height:calc(100% - 60px)'
|
|
|
+ if (this.authId) return 'height:calc(100% - 130px)'
|
|
|
+ return ''
|
|
|
+ },
|
|
|
+ pageAuthBtnQuery () {
|
|
|
+ return this.tableBtns.filter(item => item.servicetype == 0)[0]
|
|
|
+ },
|
|
|
+ pageAuthBtnDetail () {
|
|
|
+ return this.tableBtns.filter(item => item.servicetype == 1)[0]
|
|
|
+ },
|
|
|
+ pageAuthBtnAdd () {
|
|
|
+ return this.tableBtns.filter(item => item.servicetype == 2)[0]
|
|
|
+ },
|
|
|
+ pageAuthBtnEdit () {
|
|
|
+ return this.tableBtns.filter(item => item.servicetype == 3)[0]
|
|
|
+ },
|
|
|
+ pageAuthBtnDel () {
|
|
|
+ return this.tableBtns.filter(item => item.servicetype == 4)[0]
|
|
|
+ },
|
|
|
+ pageAuthBtnOther () {
|
|
|
+ return this.tableBtns.filter(item => item.servicetype == 5)[0]
|
|
|
+ },
|
|
|
+ pageAuthBtnExport () {
|
|
|
+ return this.tableBtns.filter(item => item.servicetype == 6)[0]
|
|
|
+ },
|
|
|
+ pageAuthBtnInstall () {
|
|
|
+ return this.pageInstall == this.$route.path.replace('/', '')
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ routerlist: {
|
|
|
+ handler (row) {
|
|
|
+ if (row && Object.keys(row).length) {
|
|
|
+ this.authId ? this.pageInit(this.authId) : this.pageInit()
|
|
|
+ this.queryTableData(true)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ msgContent: {
|
|
|
+ handler (row) {
|
|
|
+ if (row && Object.keys(row).length) {
|
|
|
+ const { passparameters } = row
|
|
|
+ const filterItem = this.formatDefault(passparameters, row)
|
|
|
+ if (!Object.keys(filterItem).length) return
|
|
|
+ this.defaultfilter = filterItem
|
|
|
+ this.queryTableData(true)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deep: true,
|
|
|
+ immediate: true
|
|
|
+ },
|
|
|
+ authQuery: {
|
|
|
+ handler (row) {
|
|
|
+ if (row && Object.keys(row).length) {
|
|
|
+ this.defaultfilter = row
|
|
|
+ this.queryTableData(true)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deep: true,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted () {
|
|
|
+ this.authId ? this.pageInit(this.authId) : this.pageInit()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ //页面初始化
|
|
|
+ pageInit (authId) {
|
|
|
+ //获取页面查询参数
|
|
|
+ // const { query } = this.$route
|
|
|
+ // authId ? this.pageQuery = this.authQuery : this.pageQuery = query
|
|
|
+ //获取页面配置
|
|
|
+ const { pagecode, qid, auth_id } = this.routerlist && Object.keys(this.routerlist).length ? this.routerlist: this.$route.meta
|
|
|
+ //获取页面权限类型组件 pagetype 1模块 2页面 3按钮 4表格 5树形 6弹窗
|
|
|
+ const pageAuths = this.authArrs
|
|
|
+ if (!pageAuths.length) return
|
|
|
+ let pageAuthArrs = null
|
|
|
+ // console.log(pageAuths)
|
|
|
+ authId ? pageAuthArrs = pageAuths.filter(item => item['superiorid'] == authId) : pageAuthArrs = pageAuths.filter(item => item['superiorid'] == auth_id)
|
|
|
+ //获取当前页面权限类型
|
|
|
+ if (!pageAuthArrs.length) return
|
|
|
+ //获取tree权限
|
|
|
+ const pageAuthtrees = pageAuthArrs.filter(item => item.pagetype == 'tree')
|
|
|
+ if (pageAuthtrees?.length){ this.getPageTreeSetting(pageAuthtrees)}else{
|
|
|
+ this.treeData = []
|
|
|
+ }
|
|
|
+ //获取table权限
|
|
|
+ const pageAuthtables = pageAuthArrs.filter(item => item.pagetype == 'table')
|
|
|
+ if (pageAuthtables?.length) this.getPageTableSetting(pageAuths, pageAuthtables)
|
|
|
+ //获取按钮权限
|
|
|
+ const pageAuthbtns = pageAuthArrs.filter(item => item.pagetype == 'button')
|
|
|
+ if (pageAuthbtns?.length) this.getPageBtnSetting(pageAuthbtns)
|
|
|
+ const pageAuthFforms = pageAuthArrs.filter(item => item.pagetype == 'form')
|
|
|
+ //获取form表单弹框权限
|
|
|
+ if (pageAuthFforms?.length) this.getPageBtnFormSetting(pageAuths, pageAuthFforms)
|
|
|
+ },
|
|
|
+ //根据页面tree设置数据
|
|
|
+ getPageTreeSetting (pageAuthtrees) {
|
|
|
+ const { defaultfilter, dropdownlistid, dropdownlistlabel } = pageAuthtrees[0]
|
|
|
+ this.treeNodeMap = { nodeKey: dropdownlistid, nodeValue: dropdownlistlabel }
|
|
|
+ this.treeParameters = defaultfilter
|
|
|
+ this.treeData = pageAuthtrees
|
|
|
+ },
|
|
|
+ //根据页面table设置数据
|
|
|
+ getPageTableSetting (pageAuths, pageAuthtables) {
|
|
|
+ const authTableObj = pageAuthtables[0]
|
|
|
+ //获取当前页面table的配置
|
|
|
+ const { pagename, pageconfigurationid, serviceid, pagecode, userpermissionsid, defaultfilter, selected, triggerserviceid } = authTableObj
|
|
|
+ //获取当前页面table的按钮权限
|
|
|
+ const currPageBtns = pageAuths.filter(item => item['superiorid'] == pageconfigurationid && item.pagetype == 'button')
|
|
|
+ if (currPageBtns?.length) this.tableBtns.push(...currPageBtns)
|
|
|
+ this.authBtns = pageAuths.filter(item => item.superiorid == pageconfigurationid && item.pagetype == 'button')
|
|
|
+ this.pageServiceId = Object.keys(this.msgContent).length ? this.msgContent.serviceid : serviceid;
|
|
|
+ this.pageTitle = pagename
|
|
|
+ this.selected = selected
|
|
|
+ this.triggerserviceid = triggerserviceid
|
|
|
+ this.defaultfilter = Object.keys(this.pageQuery).length ? this.pageQuery : defaultfilter ? this.formatDefault(defaultfilter, authTableObj) : { 1: 1 }
|
|
|
+ const tableColumnArrs = pageAuths.filter(item => item['superiorid'] == pageconfigurationid && item['pagetype'] == 'column')
|
|
|
+ this.getColumnData(tableColumnArrs)
|
|
|
+ },
|
|
|
+ //根据页面按钮设置数据
|
|
|
+ getPageBtnSetting (pageAuthbtns) {
|
|
|
+ this.tableBtns.push(...pageAuthbtns)
|
|
|
+ },
|
|
|
+ //根据页面按钮设置表单form数据
|
|
|
+ getPageBtnFormSetting (pageAuths, pageAuthForms) {
|
|
|
+ const { pageconfigurationid } = [...pageAuthForms][0]
|
|
|
+ const tableColumnArrs = pageAuths.filter(item => item['superiorid'] == pageconfigurationid && item['pagetype'] == 'column')
|
|
|
+ const formItemCopy = tableColumnArrs.filter((item) => item.isdisplay != 0)
|
|
|
+ this.formItem = _.orderBy(formItemCopy, ['displaynumber'], ['asc'])
|
|
|
+ },
|
|
|
+ //获取表头数据
|
|
|
+ getColumnData (columnArrs = []) {
|
|
|
+ const returnData = [...columnArrs]
|
|
|
+ this.$store.dispatch('auth/changeAuthMsg', returnData)
|
|
|
+ const tableColsCopy = _.cloneDeep(returnData).filter((item) => item.isdisplay != 0)
|
|
|
+ const tableColsCopyOrder = _.orderBy(tableColsCopy, ['displaynumber'], ['asc'])
|
|
|
+ // const formItemCopy = _.cloneDeep(returnData).filter((item) => item.isdisplay == 2 || item.isdisplay == 3);
|
|
|
+ // this.formItem = _.orderBy(formItemCopy, ['displaynumber'], ['asc']);
|
|
|
+ const msgCounts = tableColsCopyOrder.filter(item => item.enablecount)
|
|
|
+ const simpleQueryItem = _.cloneDeep(returnData).filter((item) => item.easysearch && item.isfiltercolumn)
|
|
|
+ if (msgCounts.length) {
|
|
|
+ this.summaryFlag = true
|
|
|
+ }
|
|
|
+ this.tableCols = listToTree(tableColsCopyOrder, 'groupid', 'pagecode')
|
|
|
+ const columncode = returnData.find(
|
|
|
+ (item) => item.isprimarykey == 1
|
|
|
+ )
|
|
|
+ if (columncode && Object.keys(columncode).length) {
|
|
|
+ this.tableKey = columncode['pagecode']
|
|
|
+ }
|
|
|
+ if (simpleQueryItem?.length) {
|
|
|
+ this.simpleQueryFlag = true
|
|
|
+ this.simpleQueryItem = simpleQueryItem
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //获取tree点击
|
|
|
+ treeNodeClick (data) {
|
|
|
+ const nrow = _.cloneDeep(data)
|
|
|
+ this.selectedDataCheck = nrow
|
|
|
+ if (this.selected) {
|
|
|
+ this.treeCheckQuery(nrow)
|
|
|
+ } else {
|
|
|
+ const values = Object.values(data)
|
|
|
+ const filterItem = this.formatDefault(this.treeParameters, data)
|
|
|
+ if (!Object.keys(filterItem).length) return
|
|
|
+ this.defaultfilter = values.includes(-1) || values.includes('全部') ? { 1: 1 } : filterItem
|
|
|
+ this.queryTableData(true)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //存在勾选-点击树-查询
|
|
|
+ async treeCheckQuery (data) {
|
|
|
+ const values = Object.values(data)
|
|
|
+ const filterItem = this.formatDefault(this.treeParameters, data)
|
|
|
+ if (!Object.keys(filterItem).length) return
|
|
|
+ const itemFilter = values.includes(-1) || values.includes('全部') ? { 1: 1 } : filterItem
|
|
|
+ const datacontent = { filter: itemFilter }
|
|
|
+ this.loading = true
|
|
|
+ this.selectedDataAlls = []
|
|
|
+ try {
|
|
|
+ const { code, returnData } = await Query({
|
|
|
+ page: 1,
|
|
|
+ serviceid: this.triggerserviceid,
|
|
|
+ datacontent,
|
|
|
+ event: '0',
|
|
|
+ size: 9999
|
|
|
+ });
|
|
|
+ if (code == 0) {
|
|
|
+ const datas = []
|
|
|
+ this.tableData.filter(item => {
|
|
|
+ [...returnData].forEach(pt => {
|
|
|
+ if (item['serviceid'] == pt['serviceid']) {
|
|
|
+ datas.push(item)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ this.selectedDatas = [...datas]
|
|
|
+ this.selectedDatasCath = [...returnData]
|
|
|
+ this.selectedDataAlls.push([...datas])
|
|
|
+ } else {
|
|
|
+ this.$message.error("获取表格数据失败")
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ this.$message.error("获取表格数据失败")
|
|
|
+ }
|
|
|
+ this.loading = false
|
|
|
+ },
|
|
|
+ //格式化传递参数数据
|
|
|
+ formatDefault (item, data = {}) {
|
|
|
+ if (typeof item != 'string') return {}
|
|
|
+ const filterItem = {}
|
|
|
+ const parameters = item.replace('{', '').replace('}', '')
|
|
|
+ const parametersSplit = parameters?.split(',')
|
|
|
+ parametersSplit.map(item => {
|
|
|
+ const [key, val] = item?.split(':')
|
|
|
+ filterItem[key] = data[val]
|
|
|
+ })
|
|
|
+ return filterItem
|
|
|
+ },
|
|
|
+ //根据按钮权限查询表单权限
|
|
|
+ findBtntoForm (pageroute) {
|
|
|
+ return this.tableBtnForms.filter(item => item.pagecode == pageroute)
|
|
|
+ },
|
|
|
+ //表单-查看
|
|
|
+ handleDetail (row) {
|
|
|
+ const { openmode, pageroute } = this.pageAuthBtnDetail
|
|
|
+ if (!openmode) return
|
|
|
+ if (openmode != 2) this.autoBtnClick(openmode, pageroute)
|
|
|
+ this.flag = true
|
|
|
+ this.formAuth = false
|
|
|
+ this.tableType = "detail"
|
|
|
+ this.tableTitle = "查看"
|
|
|
+ this.tableForm = _.cloneDeep(row)
|
|
|
+ },
|
|
|
+ //表单-新增
|
|
|
+ async handleAdd () {
|
|
|
+ const { openmode, pageroute, pagecode } = this.pageAuthBtnAdd
|
|
|
+ if (!openmode) return
|
|
|
+ // if (!this.findBtntoForm(pageroute).length) return
|
|
|
+ if (openmode != 2) this.autoBtnClick(openmode, pageroute)
|
|
|
+ // const { pageconfigurationid } = this.findBtntoForm(pageroute)[0]
|
|
|
+ // const pageAuths = this.authArrs
|
|
|
+ // const tableColumnArrs = pageAuths.filter(item => item['superiorid'] == pageconfigurationid && item['pagetype'] == 'column')
|
|
|
+ // this.dialogName = pageroute
|
|
|
+ if (pagecode == 'startBtnAll') {
|
|
|
+ if (!Object.keys(this.selectedDataCheck).length) {
|
|
|
+ this.$message.error('请选中容器后再操作')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const { code, message } = await startAll(this.selectedDataCheck)
|
|
|
+ if (code == 0) {
|
|
|
+ this.$message.success(message || '操作成功')
|
|
|
+ this.queryTableData(true)
|
|
|
+ } else {
|
|
|
+ this.$message.error(message || '操作失败')
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (this.$refs['ruleForm']) {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs['ruleForm'].restForm()
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.flag = true;
|
|
|
+ this.tableType = "add"
|
|
|
+ this.tableTitle = "新增"
|
|
|
+ this.tableForm = {}
|
|
|
+ for (let k in this.defaultfilter) {
|
|
|
+ if (k != 1) {
|
|
|
+ this.tableForm[k] = this.defaultfilter[k]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for (let k in this.formItem) {
|
|
|
+ if (this.formItem[k].defaultvalue && this.formItem[k].defaultvalue != "") {
|
|
|
+ this.$set(this.tableForm, this.formItem[k].pagecode, this.formItem[k].defaultvalue)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // this.formItem = tableColumnArrs.filter(item => item.isdisplay == 1)
|
|
|
+ },
|
|
|
+ formatData (returnData) {
|
|
|
+ return typeof returnData == 'string' ? this.retParse(returnData) : returnData
|
|
|
+ },
|
|
|
+ retParse (returnData) {
|
|
|
+ try {
|
|
|
+ return JSON.parse(returnData) ? JSON.parse(returnData) : returnData
|
|
|
+ } catch (error) {
|
|
|
+ return returnData
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //回显下拉数据
|
|
|
+ resPassters (obj) {
|
|
|
+ const narr = []
|
|
|
+ const nitem = _.cloneDeep(obj)
|
|
|
+ const { passparameters } = nitem
|
|
|
+ if (!passparameters) return ''
|
|
|
+ const ndata = this.formatData(passparameters)
|
|
|
+ if (!Array.isArray(ndata)) return ''
|
|
|
+ ndata.map(({ pageconfigurationid }) => { narr.push(pageconfigurationid) })
|
|
|
+ return narr
|
|
|
+ },
|
|
|
+ //表格-编辑
|
|
|
+ handleEdit (row) {
|
|
|
+ const { openmode, pageroute } = this.pageAuthBtnEdit
|
|
|
+ if (!openmode) return
|
|
|
+ if (openmode != 2) this.autoBtnClick(openmode, pageroute)
|
|
|
+ this.flag = true
|
|
|
+ this.tableType = "edit"
|
|
|
+ this.tableTitle = "编辑"
|
|
|
+ const nrow = _.cloneDeep(row)
|
|
|
+ if (nrow.passparameters) {
|
|
|
+ nrow.passparameters = this.resPassters(row)
|
|
|
+ }
|
|
|
+ if (nrow.dropdownlist) {
|
|
|
+ nrow.dropdownlist = Number(nrow.dropdownlist)
|
|
|
+ }
|
|
|
+ this.tableForm = nrow
|
|
|
+ },
|
|
|
+ //表格-其他类型按钮操作
|
|
|
+ handleOther (row, auth) {
|
|
|
+ const { openmode, pageroute, passparameters } = this.pageAuthBtnOther
|
|
|
+ if (!openmode) return
|
|
|
+ if (openmode != 2) this.autoBtnClick(openmode, pageroute, passparameters, row)
|
|
|
+ const { pagecode } = auth
|
|
|
+ if (pagecode == 'stopBtn' || pagecode == 'startBtn') {
|
|
|
+ this.stateChange(row)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //启动 & 停止
|
|
|
+ async stateChange (row) {
|
|
|
+ const { runstate, serviceid, containercode } = row
|
|
|
+ const filter = { serviceid, containercode }
|
|
|
+ if (runstate == 1) {
|
|
|
+ const { code, returnData } = await stop(filter)
|
|
|
+ if (code == 0) {
|
|
|
+ this.$message.success(returnData || '操作成功')
|
|
|
+ this.queryTableData(true)
|
|
|
+ } else {
|
|
|
+ this.$message.error(returnData || '操作失败')
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ const { code, returnData } = await start(filter)
|
|
|
+ if (code == 0) {
|
|
|
+ this.$message.success(returnData || '操作成功')
|
|
|
+ this.queryTableData(true)
|
|
|
+ } else {
|
|
|
+ this.$message.error(returnData || '操作失败')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //表格-删除
|
|
|
+ handleRemove (row) {
|
|
|
+ const { openmode, pageroute } = this.pageAuthBtnDel
|
|
|
+ if (!openmode) return
|
|
|
+ if (openmode != 2) this.autoBtnClick(openmode, pageroute)
|
|
|
+ let name = ''
|
|
|
+ const nrow = _.cloneDeep(row)
|
|
|
+ for (const key in nrow) {
|
|
|
+ if (key.includes('name')) {
|
|
|
+ name = nrow[key] || ''
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$confirm(`确认要删除 ${name} 这条信息吗?`, '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.generalDataReception(3, row, this.tableKey)
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'info',
|
|
|
+ message: '已取消删除'
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //表格-勾选
|
|
|
+ handleSelectionChange (val) {
|
|
|
+ this.selectedDataAlls.push([...val])
|
|
|
+ const ndatas = _.cloneDeep(this.selectedDataAlls)
|
|
|
+ if (ndatas.length == 1) {
|
|
|
+ this.sendCheckData('add', ndatas[0])
|
|
|
+ } else {
|
|
|
+ const [nitems1, nitems2] = [ndatas.at(-1), ndatas.at(-2)]
|
|
|
+ if (nitems1.length > nitems2.length) {
|
|
|
+ const res = this.findRepetData(nitems1, nitems2)
|
|
|
+ this.sendCheckData('add', res)
|
|
|
+ } else {
|
|
|
+ const res = this.findRepetData(nitems1, nitems2)
|
|
|
+ this.sendCheckData('del', res)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ findRepetData (nitems1, nitems2) {
|
|
|
+ const key = 'serviceid'
|
|
|
+ const res = [...nitems1, ...nitems2].filter(
|
|
|
+ (item) =>
|
|
|
+ !(
|
|
|
+ nitems1.some((p) => item[key] == p[key]) &&
|
|
|
+ nitems2.some((c) => item[key] == c[key])
|
|
|
+ )
|
|
|
+ )
|
|
|
+ return res
|
|
|
+ },
|
|
|
+ //发送新增编辑删除数据
|
|
|
+ sendCheckData (types, data, key = 'serviceid') {
|
|
|
+ const event = types == 'add' ? 1 : types == 'edit' ? 2 : 3
|
|
|
+ const querys = []
|
|
|
+ const items = _.cloneDeep(data)
|
|
|
+ const { serviceid, servicename } = items[0]
|
|
|
+ const { containerid, containercode, containername } = this.selectedDataCheck
|
|
|
+ const pitem = {
|
|
|
+ serviceid,
|
|
|
+ servicename,
|
|
|
+ containerid,
|
|
|
+ containercode,
|
|
|
+ containername
|
|
|
+ }
|
|
|
+ const params = {
|
|
|
+ serviceid: this.triggerserviceid,
|
|
|
+ datacontent: formatChange(pitem, event, key),
|
|
|
+ event,
|
|
|
+ }
|
|
|
+ if (event == 3) {
|
|
|
+ params.datacontent[0].filter.containerid = containerid
|
|
|
+ delete params.datacontent[0].value.containerid
|
|
|
+ }
|
|
|
+ event == 1 ? querys.push(newData(params)) : querys.push(moveData(params))
|
|
|
+ this.getAnscyData(querys)
|
|
|
+ },
|
|
|
+ //获取异步数据
|
|
|
+ async getAnscyData (allResult) {
|
|
|
+ if (!allResult.length) return
|
|
|
+ this.loading = true
|
|
|
+ const results = await Promise.allSettled(allResult)
|
|
|
+ results.map((item) => {
|
|
|
+ const { status, value } = item
|
|
|
+ if (status == 'fulfilled') {
|
|
|
+ const { code } = value
|
|
|
+ if (code == 0) {
|
|
|
+ this.treeCheckQuery(this.selectedDataCheck)
|
|
|
+ this.$message.success('操作成功')
|
|
|
+ } else {
|
|
|
+ this.$message.error('操作失败')
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$message.error('网络错误')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ // this.loading = false
|
|
|
+ },
|
|
|
+ // 新增/编辑-取消
|
|
|
+ submitClickClose (formName) {
|
|
|
+ this.formAuth = true
|
|
|
+ this.flag = false
|
|
|
+ this.$refs[formName].restForm()
|
|
|
+ },
|
|
|
+ // 新增/编辑-确认
|
|
|
+ submitClickHandler () {
|
|
|
+ const flag = this.$refs["ruleForm"].submitClickHandler()
|
|
|
+ if (flag) this.tableType == "add" ? this.generalDataReception(1, this.tableForm) : this.generalDataReception(2, this.tableForm, this.tableKey)
|
|
|
+ },
|
|
|
+ //表格-增/删/改
|
|
|
+ async generalDataReception (event, data, key) {
|
|
|
+ this.dialogLoading = true
|
|
|
+ try {
|
|
|
+ const params = {
|
|
|
+ serviceid: this.pageServiceId,
|
|
|
+ datacontent: formatChange(data, event, key),
|
|
|
+ event: `${event}`,
|
|
|
+ };
|
|
|
+ const { code } =
|
|
|
+ event == 1
|
|
|
+ ? await newData(params)
|
|
|
+ : event == 2
|
|
|
+ ? await modifyData(params)
|
|
|
+ : await moveData(params);
|
|
|
+ if (code == 0) {
|
|
|
+ this.$message.success("操作成功")
|
|
|
+ this.flag = false
|
|
|
+ this.rmFlag = false
|
|
|
+ this.dialogLoading = false
|
|
|
+ this.tableObj = {}
|
|
|
+ this.tableForm = {}
|
|
|
+ this.resetTable()
|
|
|
+ this.load();
|
|
|
+ this.depMath = Math.random()
|
|
|
+ // this.$router.go(0);
|
|
|
+ } else {
|
|
|
+ this.$message.error("操作失败");
|
|
|
+ this.flag = false
|
|
|
+ this.rmFlag = false
|
|
|
+ this.dialogLoading = false
|
|
|
+ this.tableObj = {};
|
|
|
+ this.tableForm = {};
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ this.flag = false
|
|
|
+ this.rmFlag = false
|
|
|
+ this.dialogLoading = false
|
|
|
+ this.tableObj = {}
|
|
|
+ this.tableForm = {}
|
|
|
+ }
|
|
|
+ },
|
|
|
+ autoBtnClick (id, url, passparameters, row = {}) {
|
|
|
+ switch (Number(id)) {
|
|
|
+ case 1:
|
|
|
+ if (passparameters && Object.keys(row).length) {
|
|
|
+ const filterItem = this.formatDefault(passparameters, row)
|
|
|
+ this.$router.push({
|
|
|
+ path: url,
|
|
|
+ query: filterItem
|
|
|
+ })
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 2:
|
|
|
+ this.$router.push(url)
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //高级查询-弹框打开
|
|
|
+ async handleQuery () {
|
|
|
+ const { openmode, pageroute, pagecode } = this.pageAuthBtnQuery
|
|
|
+ if (!openmode) return
|
|
|
+ if (pagecode == 'stopBtnAll') {
|
|
|
+ if (!Object.keys(this.selectedDataCheck).length) {
|
|
|
+ this.$message.error('请选中容器后再操作')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const { code, message } = await stopAll(this.selectedDataCheck)
|
|
|
+ if (code == 0) {
|
|
|
+ this.$message.success(message || '操作成功')
|
|
|
+ this.queryTableData(true)
|
|
|
+ } else {
|
|
|
+ this.$message.error(message || '操作失败')
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (openmode != 3) this.advancedDrawer = true // this.autoBtnClick(openmode, pageroute)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //简易查询-确定
|
|
|
+ queryValue (dataRules) {
|
|
|
+ const arr = [...dataRules]
|
|
|
+ const arrmap = {}
|
|
|
+ if (arr?.length) {
|
|
|
+ arr.forEach(item => {
|
|
|
+ const { column, value } = item
|
|
|
+ item.value = typeof value == 'string' ? value.replace(/\s*/g, "") : value
|
|
|
+ arrmap[column] = value
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.defaultfilter = Object.keys(arrmap).length ? arrmap : arr.length ? arr : { 1: 1 }
|
|
|
+ this.simpleQueryValue = arr
|
|
|
+ this.queryTableData(true)
|
|
|
+ },
|
|
|
+ //高级查询-确定
|
|
|
+ advancedTable (refName) {
|
|
|
+ this.$refs[refName].advancedQueryHandler()
|
|
|
+ },
|
|
|
+ //高级查询-取消
|
|
|
+ advancedClose () {
|
|
|
+ this.advancedDrawer = false
|
|
|
+ // this.defaultfilter = { 1: 1 }
|
|
|
+ // this.queryTableData(true)
|
|
|
+ },
|
|
|
+ //初始化
|
|
|
+ onInstall () {
|
|
|
+ if (!Object.keys(this.selectedDataCheck).length) {
|
|
|
+ this.$message.error('请选中权限后再操作')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const { pagetype } = this.selectedDataCheck
|
|
|
+ if (pagetype != 'table') {
|
|
|
+ this.$message.error('请选择表格后再操作')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.installFlag = true
|
|
|
+ },
|
|
|
+ //初始化-关闭
|
|
|
+ installClose () {
|
|
|
+ this.installFlag = false
|
|
|
+ },
|
|
|
+ //初始化-确定
|
|
|
+ installTable () {
|
|
|
+ this.installSubmit()
|
|
|
+ this.installFlag = false
|
|
|
+ },
|
|
|
+ async installSubmit () {
|
|
|
+ const { pageconfigurationid } = this.selectedDataCheck
|
|
|
+ const { code, returnData } = await Query({
|
|
|
+ serviceid: 134,
|
|
|
+ datacontent: {
|
|
|
+ tableName: this.$refs['installForm'].tableinfo,
|
|
|
+ datasourceid: this.$refs['installForm'].datasourceid,
|
|
|
+ pageconfigurationid
|
|
|
+ },
|
|
|
+ deletedatacontent: {
|
|
|
+ datacontent: [
|
|
|
+ {
|
|
|
+ filter: {
|
|
|
+ superiorid: pageconfigurationid
|
|
|
+ },
|
|
|
+ value: {}
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ event: '3'
|
|
|
+ },
|
|
|
+ event: '0'
|
|
|
+ })
|
|
|
+ if (code == 0 && returnData?.length) {
|
|
|
+ this.$message.success('数据初始化成功')
|
|
|
+ this.$refs['pageTree'].pageInit()
|
|
|
+ this.queryTableData(true)
|
|
|
+ this.$refs['installForm'].tableinfo = ''
|
|
|
+ this.$refs['installForm'].datasourceid = ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //高级查询-确定-数据
|
|
|
+ getAdvancedQueryData (dataRules) {
|
|
|
+ const arr = [...dataRules]
|
|
|
+ if (arr && arr.length) {
|
|
|
+ arr.forEach(item => {
|
|
|
+ item.value = typeof item.value == 'string' ? item.value.replace(/\s*/g, "") : item.value
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.defaultfilter = arr
|
|
|
+ this.advancedQueryValue = arr
|
|
|
+ this.queryTableData(true)
|
|
|
+ },
|
|
|
+ //高级查询-收藏
|
|
|
+ queryCollect (refName) {
|
|
|
+ this.$refs[refName].advancedQueryCollect()
|
|
|
+ },
|
|
|
+ //高级查询-重置
|
|
|
+ restCollect (refName) {
|
|
|
+ this.defaultfilter = { 1: 1 }
|
|
|
+ this.queryTableData(true)
|
|
|
+ this.$refs[refName].advancedRestCollect()
|
|
|
+ },
|
|
|
+ // 给表头单元格加上 ascending 或 descending 使用 element 自带的排序箭头变色
|
|
|
+ headerCellClass () {
|
|
|
+ return function ({ row, column, rowIndex, columnIndex }) {
|
|
|
+ const classes = []
|
|
|
+ const rule = this.tableDataSortRules[column.property]
|
|
|
+ if (rule) {
|
|
|
+ classes.push(rule)
|
|
|
+ }
|
|
|
+ return classes.join(' ')
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //添加-表格-行样式
|
|
|
+ rowClass () {
|
|
|
+ return function ({ row, rowIndex }) {
|
|
|
+ const classes = []
|
|
|
+ if (row.deleted === 'DEL') {
|
|
|
+ classes.push('bgl-deleted')
|
|
|
+ }
|
|
|
+ return classes.join(' ')
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //添加-表格-单元格样式
|
|
|
+ cellClass () {
|
|
|
+ return function ({ row, column, rowIndex, columnIndex }) {
|
|
|
+ const classes = []
|
|
|
+ const { property } = column
|
|
|
+ const ndata = _.cloneDeep(this.tableCols).filter(item => item.pagecode == property)
|
|
|
+ if (ndata?.length) {
|
|
|
+ const { pageroute } = ndata[0]
|
|
|
+ if (pageroute) classes.push('cell-click')
|
|
|
+ }
|
|
|
+ return classes.join(' ')
|
|
|
+ }
|
|
|
+ },
|
|
|
+ formatPass (pass = []) {
|
|
|
+ if (typeof pass != 'string') return {}
|
|
|
+ const ndata = JSON.parse(pass)
|
|
|
+ if (!ndata) return {}
|
|
|
+ const nitem = {}
|
|
|
+ ndata.map(item => {
|
|
|
+ const ns = Object.values(item)
|
|
|
+ nitem[ns[0]] = ns[1]
|
|
|
+ })
|
|
|
+ return nitem
|
|
|
+ },
|
|
|
+ //添加-表格-单元格-点击事件
|
|
|
+ cellClickHandler (row, column, cell, event) {
|
|
|
+ const { property } = column
|
|
|
+ const ndata = _.cloneDeep(this.tableCols).filter(item => item.pagecode == property)
|
|
|
+ const params = {}
|
|
|
+ if (ndata?.length) {
|
|
|
+ const { defaultfilter, pageroute, passparameters } = ndata[0]
|
|
|
+ if (!pageroute) return
|
|
|
+ if (defaultfilter || passparameters) {
|
|
|
+ if (passparameters) {
|
|
|
+ // const nitem = this.formatPass(passparameters)
|
|
|
+ const passparametersArray = JSON.parse(passparameters)
|
|
|
+ passparametersArray.map(item => {
|
|
|
+ if (row[item.pagecode]) {
|
|
|
+ const alias = item.alias
|
|
|
+ const pagecode = item.pagecode
|
|
|
+ if (alias) {
|
|
|
+ params[alias] = row[item['pagecode']]
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ params[pagecode] = row[item['pagecode']]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.$router.push({
|
|
|
+ path: pageroute,
|
|
|
+ query: params
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (defaultfilter) {
|
|
|
+ const filterItem = this.formatDefault(defaultfilter, row)
|
|
|
+ this.$router.push({
|
|
|
+ path: pageroute,
|
|
|
+ query: filterItem
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ this.$router.push(pageroute)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //导出
|
|
|
+ handleExport () {
|
|
|
+ if (!this.tableData.length) {
|
|
|
+ this.$message.info('无数据')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const table = this.$refs['table'].$el.cloneNode(true)
|
|
|
+ const fileName = this.pageTitle + '.xlsx'
|
|
|
+ exportToExcel(table, this.pageTitle, fileName)
|
|
|
+ },
|
|
|
+ tableFormatter () {
|
|
|
+ return function (row, column, cellValue) {
|
|
|
+ switch (column.property) {
|
|
|
+ case 'departureTime':
|
|
|
+ return (cellValue ?? '').replace('T', ' ')
|
|
|
+ case 'deleted':
|
|
|
+ return cellValue === 'DEL' ? cellValue : ''
|
|
|
+ case 'activated':
|
|
|
+ return Number(cellValue) === 1 ? '激活' : '未激活'
|
|
|
+ default:
|
|
|
+ return cellValue ?? ''
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ tableMountedHandler (refName, ref) {
|
|
|
+ this.$refs[refName] = ref
|
|
|
+ },
|
|
|
+ resetTable () {
|
|
|
+ this.dataContent = {}
|
|
|
+ this.page = 0;
|
|
|
+ this.noMore = false;
|
|
|
+ this.tableData = [];
|
|
|
+ },
|
|
|
+ load () {
|
|
|
+ if (this.noMore || this.loading) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.queryTableData()
|
|
|
+ },
|
|
|
+ async queryTableData (jumpSing = false) {
|
|
|
+ if (jumpSing) {
|
|
|
+ const initialize = _.once(this.resetTable)
|
|
|
+ initialize()
|
|
|
+ }
|
|
|
+ this.loading = true;
|
|
|
+ const datacontent = { filter: this.defaultfilter }
|
|
|
+ const parmas = {
|
|
|
+ page: ++this.page,
|
|
|
+ serviceid: this.pageServiceId,
|
|
|
+ datacontent,
|
|
|
+ event: '0'
|
|
|
+ }
|
|
|
+ if (this.selected || this.pageSizeDatas.includes(this.$route.path.replace('/', ''))) {
|
|
|
+ parmas.size = 9999
|
|
|
+ }
|
|
|
+ try {
|
|
|
+ const { code, returnData } = await Query(parmas);
|
|
|
+ if (code == 0) {
|
|
|
+ if (returnData.length === 0) {
|
|
|
+ this.page--
|
|
|
+ this.noMore = true
|
|
|
+ }
|
|
|
+ this.tableData.push(...returnData)
|
|
|
+ } else {
|
|
|
+ this.page--
|
|
|
+ this.noMore = true
|
|
|
+ this.$message.error("获取表格数据失败")
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ this.page--
|
|
|
+ this.noMore = true
|
|
|
+ }
|
|
|
+ if (this.selected || this.pageSizeDatas.includes(this.$route.path.replace('/', ''))) {
|
|
|
+ this.noMore = true
|
|
|
+ }
|
|
|
+ this.loading = false
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.TablePage {
|
|
|
+ height: calc(100vh - 90px);
|
|
|
+ padding: 20px;
|
|
|
+ &_content {
|
|
|
+ margin-top: 20px;
|
|
|
+ height: calc(100vh - 190px);
|
|
|
+ &_left {
|
|
|
+ width: 360px;
|
|
|
+ margin-right: 20px;
|
|
|
+ }
|
|
|
+ &_right {
|
|
|
+ }
|
|
|
+ .tableAuto {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ .tableSacle {
|
|
|
+ width: calc(100% - 380px);
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|