微调
This commit is contained in:
guanj
@@ -1,71 +1,72 @@
|
|||||||
import createAxios from '@/utils/request'
|
import createAxios from '@/utils/request'
|
||||||
|
|
||||||
const SYSTEM_PREFIX = '/system-boot'
|
const SYSTEM_PREFIX = '/system-boot'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 上传文件
|
* 上传文件
|
||||||
* @param file
|
* @param file
|
||||||
*/
|
*/
|
||||||
export const uploadFile = (file: any, path: string) => {
|
export const uploadFile = (file: any, path: string) => {
|
||||||
let form = new FormData()
|
let form = new FormData()
|
||||||
form.append('file', file)
|
form.append('file', file)
|
||||||
form.append('path', path)
|
form.append('path', path)
|
||||||
return createAxios({
|
return createAxios({
|
||||||
url: SYSTEM_PREFIX + '/file/upload',
|
url: SYSTEM_PREFIX + '/file/upload',
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: {
|
headers: {
|
||||||
'Content-Type': 'multipart/form-data'
|
'Content-Type': 'multipart/form-data'
|
||||||
},
|
},
|
||||||
data: form
|
data: form
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 删除文件
|
* 删除文件
|
||||||
*/
|
*/
|
||||||
export const deleteFile = (filePath: string) => {
|
export const deleteFile = (filePath: string) => {
|
||||||
let form = new FormData()
|
let form = new FormData()
|
||||||
form.append('filePath', filePath)
|
form.append('filePath', filePath)
|
||||||
return createAxios({
|
return createAxios({
|
||||||
url: SYSTEM_PREFIX + '/file/delete',
|
url: SYSTEM_PREFIX + '/file/delete',
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
data: form
|
data: form
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 下载文件
|
* 下载文件
|
||||||
*/
|
*/
|
||||||
export const downloadFile = (filePath: any) => {
|
export const downloadFile = (filePath: any) => {
|
||||||
// let form = new FormData()
|
// let form = new FormData()
|
||||||
// form.append('filePath', filePath)
|
// form.append('filePath', filePath)
|
||||||
return createAxios({
|
return createAxios({
|
||||||
url: SYSTEM_PREFIX + '/file/download',
|
url: SYSTEM_PREFIX + '/file/download',
|
||||||
method: 'GET',
|
method: 'GET',
|
||||||
params: filePath,
|
params: filePath,
|
||||||
responseType: 'blob'
|
responseType: 'blob'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取文件的短期url展示
|
* 获取文件的短期url展示
|
||||||
*/
|
*/
|
||||||
export const getFileUrl = (filePath: string) => {
|
export const getFileUrl = (params:any) => {
|
||||||
let form = new FormData()
|
let form = new FormData()
|
||||||
form.append('filePath', filePath)
|
// form.append('filePath', filePath)
|
||||||
return createAxios({
|
return createAxios({
|
||||||
url: SYSTEM_PREFIX + '/file/getFileUrl',
|
url: SYSTEM_PREFIX + '/file/getFileUrl',
|
||||||
method: 'POST'
|
method: 'get',
|
||||||
})
|
params
|
||||||
}
|
})
|
||||||
|
}
|
||||||
/**
|
|
||||||
* 根据获取文件的一个短期url及文件名
|
/**
|
||||||
*/
|
* 根据获取文件的一个短期url及文件名
|
||||||
export const getFileNameAndFilePath = (query: any) => {
|
*/
|
||||||
return createAxios({
|
export const getFileNameAndFilePath = (query: any) => {
|
||||||
url: SYSTEM_PREFIX + '/file/getFileVO',
|
return createAxios({
|
||||||
method: 'GET',
|
url: SYSTEM_PREFIX + '/file/getFileVO',
|
||||||
params: query
|
method: 'GET',
|
||||||
})
|
params: query
|
||||||
}
|
})
|
||||||
|
}
|
||||||
|
|||||||
@@ -1,251 +1,259 @@
|
|||||||
<template>
|
<template>
|
||||||
<!-- text -->
|
<!-- text -->
|
||||||
<div v-if="field.render == 'renderFormatter'">
|
<div v-if="field.render == 'renderFormatter'">
|
||||||
{{ fieldValue }}
|
{{ fieldValue }}
|
||||||
</div>
|
</div>
|
||||||
<!-- Icon -->
|
<!-- Icon -->
|
||||||
<Icon class="ba-icon-dark" v-if="field.render == 'icon' && fieldValue" :name="fieldValue ? fieldValue : field.default ?? ''" />
|
<Icon class="ba-icon-dark" v-if="field.render == 'icon' && fieldValue"
|
||||||
|
:name="fieldValue ? fieldValue : field.default ?? ''" />
|
||||||
<!-- switch -->
|
|
||||||
<el-switch v-if="field.render == 'switch'" @change="onChangeField(field, $event)"
|
<!-- switch -->
|
||||||
:model-value="fieldValue.toString()" :loading="row.loading" inline-prompt :active-value="field.activeValue"
|
<el-switch v-if="field.render == 'switch'" @change="onChangeField(field, $event)"
|
||||||
:active-text="field.activeText" :inactive-value="field.inactiveValue" :inactive-text="field.inactiveText" />
|
:model-value="fieldValue.toString()" :loading="row.loading" inline-prompt :active-value="field.activeValue"
|
||||||
|
:active-text="field.activeText" :inactive-value="field.inactiveValue" :inactive-text="field.inactiveText" />
|
||||||
<!-- image -->
|
|
||||||
<div v-if="field.render == 'image' && fieldValue" class="ba-render-image">
|
<!-- image -->
|
||||||
<el-image :hide-on-click-modal="true" :preview-teleported="true" :preview-src-list="[fieldValue]"
|
<div v-if="field.render == 'image' && fieldValue" class="ba-render-image">
|
||||||
:src="fieldValue.length > 100 ? fieldValue : fullUrl(fieldValue)"></el-image>
|
<el-image :hide-on-click-modal="true" :preview-teleported="true" :preview-src-list="[fieldValue]"
|
||||||
</div>
|
:src="fieldValue.length > 100 ? fieldValue : getUrl(fieldValue)"></el-image>
|
||||||
|
</div>
|
||||||
<!-- tag -->
|
|
||||||
<div v-if="field.render == 'tag' && fieldValue !== ''">
|
<!-- tag -->
|
||||||
<el-tag :type="getTagType(fieldValue, field.custom) || 'primary'" :effect="field.effect ||'light'" size="small">
|
<div v-if="field.render == 'tag' && fieldValue !== ''">
|
||||||
{{ field.replaceValue ? field.replaceValue[fieldValue] : fieldValue }}
|
<el-tag :type="getTagType(fieldValue, field.custom) || 'primary'" :effect="field.effect || 'light'"
|
||||||
</el-tag>
|
size="small">
|
||||||
</div>
|
{{ field.replaceValue ? field.replaceValue[fieldValue] : fieldValue }}
|
||||||
|
</el-tag>
|
||||||
<!-- datetime -->
|
</div>
|
||||||
<div v-if="field.render == 'datetime'">
|
|
||||||
{{ !fieldValue ? '/' : timeFormat(fieldValue, field.timeFormat ?? undefined) }}
|
<!-- datetime -->
|
||||||
</div>
|
<div v-if="field.render == 'datetime'">
|
||||||
|
{{ !fieldValue ? '/' : timeFormat(fieldValue, field.timeFormat ?? undefined) }}
|
||||||
<!-- color -->
|
</div>
|
||||||
<div v-if="field.render == 'color'">
|
|
||||||
<div :style="{ background: fieldValue }" class="ba-render-color"></div>
|
<!-- color -->
|
||||||
</div>
|
<div v-if="field.render == 'color'">
|
||||||
|
<div :style="{ background: fieldValue }" class="ba-render-color"></div>
|
||||||
<!-- customTemplate 自定义模板 -->
|
</div>
|
||||||
<div v-if="field.render == 'customTemplate'"
|
|
||||||
v-html="field.customTemplate ? field.customTemplate(row, field, fieldValue, column, index) : ''"></div>
|
<!-- customTemplate 自定义模板 -->
|
||||||
|
<div v-if="field.render == 'customTemplate'"
|
||||||
<!-- 自定义组件/函数渲染 -->
|
v-html="field.customTemplate ? field.customTemplate(row, field, fieldValue, column, index) : ''"></div>
|
||||||
<component v-if="field.render == 'customRender'" :is="field.customRender" :renderRow="row" :renderField="field"
|
|
||||||
:renderValue="fieldValue" :renderColumn="column" :renderIndex="index" />
|
<!-- 自定义组件/函数渲染 -->
|
||||||
|
<component v-if="field.render == 'customRender'" :is="field.customRender" :renderRow="row" :renderField="field"
|
||||||
<!-- 按钮组 -->
|
:renderValue="fieldValue" :renderColumn="column" :renderIndex="index" />
|
||||||
<div v-if="field.render == 'buttons' && buttons" class="cn-render-buttons">
|
|
||||||
<template v-for="(btn, idx) in buttons" :key="idx">
|
<!-- 按钮组 -->
|
||||||
<!-- 常规按钮 -->
|
<div v-if="field.render == 'buttons' && buttons" class="cn-render-buttons">
|
||||||
<el-button link v-if="btn.render == 'basicButton'" @click="onButtonClick(btn)" :class="btn.class"
|
<template v-for="(btn, idx) in buttons" :key="idx">
|
||||||
class="table-operate" :type="btn.type" :disabled="btn.showDisabled && btn.showDisabled(row, field)"
|
<!-- 常规按钮 -->
|
||||||
:loading="props.row.loading || false" v-bind="btn.attr">
|
<el-button link v-if="btn.render == 'basicButton'" @click="onButtonClick(btn)" :class="btn.class"
|
||||||
<div v-if="btn.text || btn.title" class="table-operate-text">{{ btn.text || btn.title }}</div>
|
class="table-operate" :type="btn.type" :disabled="btn.showDisabled && btn.showDisabled(row, field)"
|
||||||
</el-button>
|
:loading="props.row.loading || false" v-bind="btn.attr">
|
||||||
|
<div v-if="btn.text || btn.title" class="table-operate-text">{{ btn.text || btn.title }}</div>
|
||||||
<!-- 带提示信息的按钮 -->
|
</el-button>
|
||||||
<el-tooltip v-if="btn.render == 'tipButton'" :disabled="btn.title && !btn.disabledTip ? false : true"
|
|
||||||
:content="btn.title" placement="top">
|
<!-- 带提示信息的按钮 -->
|
||||||
<el-button link @click="onButtonClick(btn)" :class="btn.class" class="table-operate" :type="btn.type"
|
<el-tooltip v-if="btn.render == 'tipButton'" :disabled="btn.title && !btn.disabledTip ? false : true"
|
||||||
v-bind="btn.attr">
|
:content="btn.title" placement="top">
|
||||||
<div v-if="btn.text || btn.title" class="table-operate-text">
|
<el-button link @click="onButtonClick(btn)" :class="btn.class" class="table-operate" :type="btn.type"
|
||||||
{{ btn.text || btn.title }}
|
v-bind="btn.attr">
|
||||||
</div>
|
<div v-if="btn.text || btn.title" class="table-operate-text">
|
||||||
</el-button>
|
{{ btn.text || btn.title }}
|
||||||
</el-tooltip>
|
</div>
|
||||||
|
</el-button>
|
||||||
<!-- 带确认框的按钮 -->
|
</el-tooltip>
|
||||||
<el-popconfirm v-if="btn.render == 'confirmButton'" :disabled="btn.disabled && btn.disabled(row, field)"
|
|
||||||
v-bind="btn.popconfirm" @confirm="onButtonClick(btn)">
|
<!-- 带确认框的按钮 -->
|
||||||
<template #reference>
|
<el-popconfirm v-if="btn.render == 'confirmButton'" :disabled="btn.disabled && btn.disabled(row, field)"
|
||||||
<div style="display: inline-block">
|
v-bind="btn.popconfirm" @confirm="onButtonClick(btn)">
|
||||||
<el-button link :class="btn.class" class="table-operate" :type="btn.type" v-bind="btn.attr">
|
<template #reference>
|
||||||
<div v-if="btn.text || btn.title" class="table-operate-text">
|
<div style="display: inline-block">
|
||||||
{{ btn.text || btn.title }}
|
<el-button link :class="btn.class" class="table-operate" :type="btn.type" v-bind="btn.attr">
|
||||||
</div>
|
<div v-if="btn.text || btn.title" class="table-operate-text">
|
||||||
</el-button>
|
{{ btn.text || btn.title }}
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</el-button>
|
||||||
</el-popconfirm>
|
</div>
|
||||||
|
</template>
|
||||||
<el-dropdown v-if="btn.render == 'dropdown'" trigger="click" @command="handlerCommand">
|
</el-popconfirm>
|
||||||
<el-button link type="primary" class="table-operate">
|
|
||||||
<div class="table-operate-text">更多</div>
|
<el-dropdown v-if="btn.render == 'dropdown'" trigger="click" @command="handlerCommand">
|
||||||
</el-button>
|
<el-button link type="primary" class="table-operate">
|
||||||
<template #dropdown>
|
<div class="table-operate-text">更多</div>
|
||||||
<el-dropdown-menu>
|
</el-button>
|
||||||
<el-dropdown-item v-for="item in btn.buttons" :key="item.text" :command="item"
|
<template #dropdown>
|
||||||
:disabled="item.showDisabled && item.showDisabled(row, field)" :style="{
|
<el-dropdown-menu>
|
||||||
color: item.type === 'primary' ? 'var(--el-color-primary)' : 'var(--el-color-danger)'
|
<el-dropdown-item v-for="item in btn.buttons" :key="item.text" :command="item"
|
||||||
}">
|
:disabled="item.showDisabled && item.showDisabled(row, field)" :style="{
|
||||||
{{ item.text }}
|
color: item.type === 'primary' ? 'var(--el-color-primary)' : 'var(--el-color-danger)'
|
||||||
</el-dropdown-item>
|
}">
|
||||||
</el-dropdown-menu>
|
{{ item.text }}
|
||||||
</template>
|
</el-dropdown-item>
|
||||||
</el-dropdown>
|
</el-dropdown-menu>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</el-dropdown>
|
||||||
</template>
|
</template>
|
||||||
|
</div>
|
||||||
<script setup lang="ts">
|
</template>
|
||||||
import { ref, inject } from 'vue'
|
|
||||||
import { ElMessageBox, type TagProps } from 'element-plus'
|
<script setup lang="ts">
|
||||||
import type TableStoreClass from '@/utils/tableStore'
|
import { ref, inject } from 'vue'
|
||||||
import { fullUrl, timeFormat } from '@/utils/common'
|
import { ElMessageBox, type TagProps } from 'element-plus'
|
||||||
import type { VxeColumnProps } from 'vxe-table'
|
import type TableStoreClass from '@/utils/tableStore'
|
||||||
|
import { fullUrl, timeFormat } from '@/utils/common'
|
||||||
const TableStore = inject('tableStore') as TableStoreClass
|
import { getFileUrl } from '@/api/system-boot/file'
|
||||||
|
import type { VxeColumnProps } from 'vxe-table'
|
||||||
interface Props {
|
|
||||||
row: TableRow
|
const TableStore = inject('tableStore') as TableStoreClass
|
||||||
field: TableColumn
|
|
||||||
column: VxeColumnProps
|
interface Props {
|
||||||
index: number
|
row: TableRow
|
||||||
}
|
field: TableColumn
|
||||||
const props = defineProps<Props>()
|
column: VxeColumnProps
|
||||||
|
index: number
|
||||||
// 字段值（单元格值）
|
}
|
||||||
const fieldName = ref(props.field.field)
|
const props = defineProps<Props>()
|
||||||
const fieldValue = ref(fieldName.value ? props.row[fieldName.value] : '')
|
|
||||||
if (fieldName.value && fieldName.value.indexOf('.') > -1) {
|
// 字段值（单元格值）
|
||||||
let fieldNameArr = fieldName.value.split('.')
|
const fieldName = ref(props.field.field)
|
||||||
let val: any = ref(props.row[fieldNameArr[0]])
|
const fieldValue = ref(fieldName.value ? props.row[fieldName.value] : '')
|
||||||
for (let index = 1; index < fieldNameArr.length; index++) {
|
if (fieldName.value && fieldName.value.indexOf('.') > -1) {
|
||||||
val.value = val.value ? val.value[fieldNameArr[index]] ?? '' : ''
|
let fieldNameArr = fieldName.value.split('.')
|
||||||
}
|
let val: any = ref(props.row[fieldNameArr[0]])
|
||||||
fieldValue.value = val.value
|
for (let index = 1; index < fieldNameArr.length; index++) {
|
||||||
}
|
val.value = val.value ? val.value[fieldNameArr[index]] ?? '' : ''
|
||||||
|
}
|
||||||
if (props.field.renderFormatter && typeof props.field.renderFormatter == 'function') {
|
fieldValue.value = val.value
|
||||||
fieldValue.value = props.field.renderFormatter(props.row, props.field, fieldValue.value, props.column, props.index)
|
}
|
||||||
}
|
|
||||||
|
if (props.field.renderFormatter && typeof props.field.renderFormatter == 'function') {
|
||||||
const onChangeField = (row: any, value: any) => {
|
fieldValue.value = props.field.renderFormatter(props.row, props.field, fieldValue.value, props.column, props.index)
|
||||||
row.onChangeField && row.onChangeField(props.row, value)
|
}
|
||||||
|
|
||||||
// TableStore.onTableAction('field-change', { value: value, ...props })
|
const onChangeField = (row: any, value: any) => {
|
||||||
}
|
row.onChangeField && row.onChangeField(props.row, value)
|
||||||
|
|
||||||
const onButtonClick = (btn: OptButton) => {
|
// TableStore.onTableAction('field-change', { value: value, ...props })
|
||||||
btn.click && btn.click(props.row, props.field)
|
}
|
||||||
}
|
const getUrl = (url: string) => {
|
||||||
|
getFileUrl({ filePath: url }).then(res => {
|
||||||
const getTagType = (value: string, custom: any): TagProps['type'] => {
|
return res.data
|
||||||
return custom && custom[value] ? custom[value] : ''
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
// 按钮组处理 最多显示三个按钮 多余的显示为下拉
|
const onButtonClick = (btn: OptButton) => {
|
||||||
const buttonsFilter = props.field.buttons?.filter(btn => !(btn.disabled && btn.disabled(props.row, props.field))) || []
|
btn.click && btn.click(props.row, props.field)
|
||||||
const buttons = ref<any[]>([])
|
}
|
||||||
if (buttonsFilter.length > 3) {
|
|
||||||
buttonsFilter?.forEach((btn, index) => {
|
const getTagType = (value: string, custom: any): TagProps['type'] => {
|
||||||
btn.text = btn.text || btn.title
|
return custom && custom[value] ? custom[value] : ''
|
||||||
if (index < 2) {
|
}
|
||||||
buttons.value.push(btn)
|
|
||||||
} else {
|
// 按钮组处理 最多显示三个按钮 多余的显示为下拉
|
||||||
if (buttons.value.length > 2) {
|
const buttonsFilter = props.field.buttons?.filter(btn => !(btn.disabled && btn.disabled(props.row, props.field))) || []
|
||||||
buttons.value[buttons.value.length - 1].buttons.push(btn)
|
const buttons = ref<any[]>([])
|
||||||
} else {
|
if (buttonsFilter.length > 3) {
|
||||||
buttons.value.push({
|
buttonsFilter?.forEach((btn, index) => {
|
||||||
render: 'dropdown',
|
btn.text = btn.text || btn.title
|
||||||
buttons: [btn]
|
if (index < 2) {
|
||||||
})
|
buttons.value.push(btn)
|
||||||
}
|
} else {
|
||||||
}
|
if (buttons.value.length > 2) {
|
||||||
})
|
buttons.value[buttons.value.length - 1].buttons.push(btn)
|
||||||
} else {
|
} else {
|
||||||
buttons.value = buttonsFilter
|
buttons.value.push({
|
||||||
}
|
render: 'dropdown',
|
||||||
const handlerCommand = (item: OptButton) => {
|
buttons: [btn]
|
||||||
switch (item.render) {
|
})
|
||||||
case 'basicButton':
|
}
|
||||||
onButtonClick(item)
|
}
|
||||||
break
|
})
|
||||||
case 'confirmButton':
|
} else {
|
||||||
ElMessageBox.confirm(item.popconfirm?.title || '提示', {
|
buttons.value = buttonsFilter
|
||||||
confirmButtonText: item.popconfirm?.confirmButtonText || '确认',
|
}
|
||||||
cancelButtonText: item.popconfirm?.cancelButtonText || '取消',
|
const handlerCommand = (item: OptButton) => {
|
||||||
type: 'warning'
|
switch (item.render) {
|
||||||
}).then(() => {
|
case 'basicButton':
|
||||||
onButtonClick(item)
|
onButtonClick(item)
|
||||||
})
|
break
|
||||||
default:
|
case 'confirmButton':
|
||||||
break
|
ElMessageBox.confirm(item.popconfirm?.title || '提示', {
|
||||||
}
|
confirmButtonText: item.popconfirm?.confirmButtonText || '确认',
|
||||||
}
|
cancelButtonText: item.popconfirm?.cancelButtonText || '取消',
|
||||||
</script>
|
type: 'warning'
|
||||||
|
}).then(() => {
|
||||||
<style scoped lang="scss">
|
onButtonClick(item)
|
||||||
.m-10 {
|
})
|
||||||
margin: 4px;
|
default:
|
||||||
}
|
break
|
||||||
|
}
|
||||||
.ba-render-image {
|
}
|
||||||
text-align: center;
|
</script>
|
||||||
}
|
|
||||||
|
<style scoped lang="scss">
|
||||||
.images-item {
|
.m-10 {
|
||||||
width: 50px;
|
margin: 4px;
|
||||||
margin: 0 5px;
|
}
|
||||||
}
|
|
||||||
|
.ba-render-image {
|
||||||
.el-image {
|
text-align: center;
|
||||||
height: 36px;
|
}
|
||||||
// width: 36px;
|
|
||||||
}
|
.images-item {
|
||||||
|
width: 50px;
|
||||||
.table-operate-text {
|
margin: 0 5px;
|
||||||
padding-left: 5px;
|
}
|
||||||
font-size: 12px;
|
|
||||||
}
|
.el-image {
|
||||||
|
height: 36px;
|
||||||
.table-operate {
|
// width: 36px;
|
||||||
padding: 4px 5px;
|
}
|
||||||
height: auto;
|
|
||||||
}
|
.table-operate-text {
|
||||||
|
padding-left: 5px;
|
||||||
.cn-render-buttons {
|
font-size: 12px;
|
||||||
display: flex;
|
}
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
.table-operate {
|
||||||
|
padding: 4px 5px;
|
||||||
.icon {
|
height: auto;
|
||||||
font-size: 12px !important;
|
}
|
||||||
// color: var(--ba-bg-color-overlay) !important;
|
|
||||||
}
|
.cn-render-buttons {
|
||||||
}
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
.move-button {
|
justify-content: center;
|
||||||
cursor: move;
|
|
||||||
}
|
.icon {
|
||||||
|
font-size: 12px !important;
|
||||||
.ml-6 {
|
// color: var(--ba-bg-color-overlay) !important;
|
||||||
display: inline-flex;
|
}
|
||||||
vertical-align: middle;
|
}
|
||||||
margin-left: 6px;
|
|
||||||
}
|
.move-button {
|
||||||
|
cursor: move;
|
||||||
.ml-6+.el-button {
|
}
|
||||||
margin-left: 6px;
|
|
||||||
}
|
.ml-6 {
|
||||||
|
display: inline-flex;
|
||||||
.ba-render-color {
|
vertical-align: middle;
|
||||||
height: 25px;
|
margin-left: 6px;
|
||||||
width: 100%;
|
}
|
||||||
}
|
|
||||||
|
.ml-6+.el-button {
|
||||||
.cn-render-buttons {
|
margin-left: 6px;
|
||||||
:deep(.el-button) {
|
}
|
||||||
margin-left: 0;
|
|
||||||
}
|
.ba-render-color {
|
||||||
}
|
height: 25px;
|
||||||
</style>
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cn-render-buttons {
|
||||||
|
:deep(.el-button) {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@@ -83,7 +83,6 @@ import { useAdminInfo } from '@/stores/adminInfo'
|
|||||||
import router from '@/router'
|
import router from '@/router'
|
||||||
import globalPopUp from './globalPopUp.vue'
|
import globalPopUp from './globalPopUp.vue'
|
||||||
import { routePush } from '@/utils/router'
|
import { routePush } from '@/utils/router'
|
||||||
import { fullUrl } from '@/utils/common'
|
|
||||||
import html2canvas from 'html2canvas'
|
import html2canvas from 'html2canvas'
|
||||||
import PopupPwd from './popup/password.vue'
|
import PopupPwd from './popup/password.vue'
|
||||||
import AdminInfo from './popup/adminInfo.vue'
|
import AdminInfo from './popup/adminInfo.vue'
|
||||||
|
|||||||
158
src/main.ts
158
src/main.ts
@@ -1,79 +1,79 @@
|
|||||||
import { createApp, reactive } from 'vue'
|
import { createApp, reactive } from 'vue'
|
||||||
import App from './App.vue'
|
import App from './App.vue'
|
||||||
import router from './router'
|
import router from './router'
|
||||||
import pinia from '@/stores/index'
|
import pinia from '@/stores/index'
|
||||||
import { registerIcons } from '@/utils/common'
|
import { registerIcons } from '@/utils/common'
|
||||||
import mitt from 'mitt'
|
import mitt from 'mitt'
|
||||||
import VXETable from 'vxe-table'
|
import VXETable from 'vxe-table'
|
||||||
import XEUtils from 'xe-utils'
|
import XEUtils from 'xe-utils'
|
||||||
import 'vxe-table/lib/style.css'
|
import 'vxe-table/lib/style.css'
|
||||||
import ElementPlus from 'element-plus'
|
import ElementPlus from 'element-plus'
|
||||||
import 'element-plus/dist/index.css'
|
import 'element-plus/dist/index.css'
|
||||||
import 'element-plus/theme-chalk/display.css'
|
import 'element-plus/theme-chalk/display.css'
|
||||||
import '@fortawesome/fontawesome-free/css/all.css'
|
import '@fortawesome/fontawesome-free/css/all.css'
|
||||||
import '@/styles/index.scss'
|
import '@/styles/index.scss'
|
||||||
import '@/assets/font/iconfont.css'
|
import '@/assets/font/iconfont.css'
|
||||||
import { ElDialog } from 'element-plus'
|
import { ElDialog } from 'element-plus'
|
||||||
import BaiduMap from 'vue-baidu-map-3x'
|
import BaiduMap from 'vue-baidu-map-3x'
|
||||||
import BaiduMapOffline from 'vue-baidu-map-offline'
|
import BaiduMapOffline from 'vue-baidu-map-offline'
|
||||||
import ExcelJS from 'exceljs'
|
import ExcelJS from 'exceljs'
|
||||||
import VXETablePluginExportXLSX from 'vxe-table-plugin-export-xlsx'
|
import VXETablePluginExportXLSX from 'vxe-table-plugin-export-xlsx'
|
||||||
// 方式1：NPM 安装，注入 ExcelJS 对象
|
// 方式1：NPM 安装，注入 ExcelJS 对象
|
||||||
VXETable.use(VXETablePluginExportXLSX, {
|
VXETable.use(VXETablePluginExportXLSX, {
|
||||||
ExcelJS
|
ExcelJS
|
||||||
})
|
})
|
||||||
window.XEUtils = XEUtils
|
window.XEUtils = XEUtils
|
||||||
|
|
||||||
// 初始化多语言
|
// 初始化多语言
|
||||||
import { setupI18n } from '@/plugins/vueI18n'
|
import { setupI18n } from '@/plugins/vueI18n'
|
||||||
|
|
||||||
// 引入 form-create
|
// 引入 form-create
|
||||||
import { setupFormCreate } from '@/plugins/formCreate'
|
import { setupFormCreate } from '@/plugins/formCreate'
|
||||||
|
|
||||||
// 创建实例
|
// 创建实例
|
||||||
const setupAll = async () => {
|
const setupAll = async () => {
|
||||||
const app = createApp(App)
|
const app = createApp(App)
|
||||||
|
|
||||||
//开启离线地图
|
//开启离线地图
|
||||||
// app.use(BaiduMapOffline, {
|
app.use(BaiduMapOffline, {
|
||||||
// offline: true,
|
offline: true,
|
||||||
// offlineConfig: {
|
offlineConfig: {
|
||||||
// imgext: '.png',
|
imgext: '.png',
|
||||||
// customstyle: '',
|
customstyle: '',
|
||||||
// tiles_dir: '',
|
tiles_dir: '',
|
||||||
// tiles_hybrid: '',
|
tiles_hybrid: '',
|
||||||
// tiles_self: '',
|
tiles_self: '',
|
||||||
// tiles_v_dir: '',
|
tiles_v_dir: '',
|
||||||
// tiles_satellite_dir: '',
|
tiles_satellite_dir: '',
|
||||||
// tiles_road_dir: '',
|
tiles_road_dir: '',
|
||||||
// tiles_v_road_dir: '',
|
tiles_v_road_dir: '',
|
||||||
// home: './plugin/offline/'
|
home: './plugin/offline/'
|
||||||
// }
|
}
|
||||||
// })
|
})
|
||||||
app.use(BaiduMap, {
|
app.use(BaiduMap, {
|
||||||
// ak: 'Yp57V71dkOPiXjiN8VdcFRsVELzlVNKK',
|
// ak: 'Yp57V71dkOPiXjiN8VdcFRsVELzlVNKK',
|
||||||
ak: 'RpQi6WNFZ9tseKzhdwOQsXwFsoVntnsN',
|
ak: 'RpQi6WNFZ9tseKzhdwOQsXwFsoVntnsN',
|
||||||
v: '3.0'
|
v: '3.0'
|
||||||
})
|
})
|
||||||
|
|
||||||
await setupI18n(app)
|
await setupI18n(app)
|
||||||
app.use(router)
|
app.use(router)
|
||||||
app.use(pinia)
|
app.use(pinia)
|
||||||
app.use(ElementPlus)
|
app.use(ElementPlus)
|
||||||
app.use(VXETable)
|
app.use(VXETable)
|
||||||
;(app._context.components.ElDialog as typeof ElDialog).props.closeOnClickModal.default = false
|
;(app._context.components.ElDialog as typeof ElDialog).props.closeOnClickModal.default = false
|
||||||
registerIcons(app) // icons
|
registerIcons(app) // icons
|
||||||
|
|
||||||
app.config.globalProperties.eventBus = mitt()
|
app.config.globalProperties.eventBus = mitt()
|
||||||
// 配置全局变量
|
// 配置全局变量
|
||||||
app.config.globalProperties.$allVariables = reactive({
|
app.config.globalProperties.$allVariables = reactive({
|
||||||
butLoading: false
|
butLoading: false
|
||||||
})
|
})
|
||||||
setupFormCreate(app)
|
setupFormCreate(app)
|
||||||
|
|
||||||
await router.isReady()
|
await router.isReady()
|
||||||
|
|
||||||
app.mount('#app')
|
app.mount('#app')
|
||||||
}
|
}
|
||||||
|
|
||||||
setupAll()
|
setupAll()
|
||||||
|
|||||||
@@ -347,12 +347,12 @@ const onSubmit = async () => {
|
|||||||
}))
|
}))
|
||||||
|
|
||||||
// 设置有功功率图表
|
// 设置有功功率图表
|
||||||
setEChart(1, res1.data.data, '有功功率', 'kW')
|
setEChart(1, res1.data.data, '有功功率', 'W')
|
||||||
|
|
||||||
// 获取无功功率数据并设置图表
|
// 获取无功功率数据并设置图表
|
||||||
const res2 = await queryCarryCapacityQData(form)
|
const res2 = await queryCarryCapacityQData(form)
|
||||||
q_βminMap.value = res2.data.q_βminMap
|
q_βminMap.value = res2.data.q_βminMap
|
||||||
setEChart(2, res2.data.data, '无功功率', 'kVar')
|
setEChart(2, res2.data.data, '无功功率', 'Var')
|
||||||
|
|
||||||
// 获取谐波电流数据并设置图表
|
// 获取谐波电流数据并设置图表
|
||||||
const res3 = await queryCarryCapacityIData(form)
|
const res3 = await queryCarryCapacityIData(form)
|
||||||
|
|||||||
@@ -1,464 +1,465 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="pd10">
|
<div class="pd10">
|
||||||
<el-card>
|
<el-card>
|
||||||
<el-form ref="formRef" inline :rules="rules" :model="form" label-width="120px" class="form-four">
|
<el-form ref="formRef" inline :rules="rules" :model="form" label-width="120px" class="form-four">
|
||||||
<el-form-item label="页面名称:" prop="pageName">
|
<el-form-item label="页面名称:" prop="pageName">
|
||||||
<el-input
|
<el-input
|
||||||
maxlength="32"
|
maxlength="32"
|
||||||
show-word-limit
|
show-word-limit
|
||||||
v-model.trim="form.pageName"
|
v-model.trim="form.pageName"
|
||||||
placeholder="请输入页面名称"
|
placeholder="请输入页面名称"
|
||||||
></el-input>
|
></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
<el-form-item label="页面排序:" prop="sort">
|
<el-form-item label="页面排序:" prop="sort">
|
||||||
<el-input
|
<el-input
|
||||||
maxlength="32"
|
maxlength="32"
|
||||||
show-word-limit-number
|
show-word-limit-number
|
||||||
v-model.trim.number="form.sort"
|
v-model.trim.number="form.sort"
|
||||||
:min="0"
|
:min="0"
|
||||||
:step="1"
|
:step="1"
|
||||||
step-strictly
|
step-strictly
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
<el-form-item label="备注:" class="top">
|
<el-form-item label="备注:" class="top">
|
||||||
<el-input
|
<el-input
|
||||||
maxlength="300"
|
maxlength="300"
|
||||||
show-word-limit
|
show-word-limit
|
||||||
type="textarea"
|
type="textarea"
|
||||||
:rows="1"
|
:rows="1"
|
||||||
placeholder="请输入内容"
|
placeholder="请输入内容"
|
||||||
v-model.trim="form.remark"
|
v-model.trim="form.remark"
|
||||||
></el-input>
|
></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<div style="width: 100%; display: flex; justify-content: end">
|
<div style="width: 100%; display: flex; justify-content: end">
|
||||||
<el-button type="primary" icon="el-icon-Check" @click="onSubmit">保存</el-button>
|
<el-button type="primary" icon="el-icon-Check" @click="onSubmit">保存</el-button>
|
||||||
<back-component />
|
<back-component />
|
||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
</el-card>
|
</el-card>
|
||||||
<el-card class="mt10" :style="height">
|
<el-card class="mt10" :style="height">
|
||||||
<div style="display: flex">
|
<div style="display: flex">
|
||||||
<div style="width: 605px; overflow: auto" :style="indicatorHeight" class="mr10">
|
<div style="width: 605px; overflow: auto" :style="indicatorHeight" class="mr10">
|
||||||
<el-collapse v-model="activeNames" :expand-icon-position="position">
|
<el-collapse v-model="activeNames" :expand-icon-position="position">
|
||||||
<el-collapse-item
|
<el-collapse-item
|
||||||
v-for="item in treeComponents"
|
v-for="item in treeComponents"
|
||||||
:key="item.id"
|
:key="item.id"
|
||||||
:title="item.name"
|
:title="item.name"
|
||||||
:name="item.id"
|
:name="item.id"
|
||||||
>
|
>
|
||||||
<el-collapse v-model="activeNames1" class="ml20">
|
<el-collapse v-model="activeNames1" class="ml20">
|
||||||
<el-collapse-item v-for="k in item.children" :key="k.id" :title="k.name" :name="k.id">
|
<el-collapse-item v-for="k in item.children" :key="k.id" :title="k.name" :name="k.id">
|
||||||
<div class="Box">
|
<div class="Box">
|
||||||
<div
|
<div
|
||||||
v-for="(s, index) in k.children"
|
v-for="(s, index) in k.children"
|
||||||
:key="index"
|
:key="index"
|
||||||
class="mr10 mb10 imgBox"
|
class="mr10 mb10 imgBox"
|
||||||
draggable="true"
|
draggable="true"
|
||||||
unselectable="on"
|
unselectable="on"
|
||||||
@drag="drag(s)"
|
@drag="drag(s)"
|
||||||
@dragend="dragEnd(s)"
|
@dragend="dragEnd(s)"
|
||||||
>
|
>
|
||||||
<div class="textName">{{ s.name }}</div>
|
<div class="textName">{{ s.name }}</div>
|
||||||
<img :src="s.image" style="width: 180px" />
|
<img :src="s.image" style="width: 180px" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-collapse-item>
|
</el-collapse-item>
|
||||||
</el-collapse>
|
</el-collapse>
|
||||||
</el-collapse-item>
|
</el-collapse-item>
|
||||||
</el-collapse>
|
</el-collapse>
|
||||||
</div>
|
</div>
|
||||||
<div style="flex: 1" ref="wrapper">
|
<div style="flex: 1" ref="wrapper">
|
||||||
<GridLayout
|
<GridLayout
|
||||||
class="GridLayout"
|
class="GridLayout"
|
||||||
ref="gridLayout"
|
ref="gridLayout"
|
||||||
v-model:layout="layout"
|
v-model:layout="layout"
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
:style="{ height: GridHeight + 'px' }"
|
:style="{ height: GridHeight + 'px' }"
|
||||||
:row-height="rowHeight"
|
:row-height="rowHeight"
|
||||||
:col-num="12"
|
:col-num="12"
|
||||||
:vertical-compact="false"
|
prevent-collision
|
||||||
>
|
:vertical-compact="false"
|
||||||
<template #item="{ item }">
|
>
|
||||||
<div class="imgBox">
|
<template #item="{ item }">
|
||||||
<div class="textName">{{ item.name }}</div>
|
<div class="imgBox">
|
||||||
<img
|
<div class="textName">{{ item.name }}</div>
|
||||||
:src="getImg(item.path)"
|
<img
|
||||||
:style="{
|
:src="getImg(item.path)"
|
||||||
height:
|
:style="{
|
||||||
item.h * rowHeight -
|
height:
|
||||||
(item.h == 1
|
item.h * rowHeight -
|
||||||
? 30
|
(item.h == 1
|
||||||
: item.h == 2
|
? 30
|
||||||
? 20
|
: item.h == 2
|
||||||
: item.h == 3
|
? 20
|
||||||
? 10
|
: item.h == 3
|
||||||
: item.h == 4
|
? 10
|
||||||
? -0
|
: item.h == 4
|
||||||
: item.h == 5
|
? -0
|
||||||
? -10
|
: item.h == 5
|
||||||
: -20) +
|
? -10
|
||||||
'px'
|
: -20) +
|
||||||
}"
|
'px'
|
||||||
/>
|
}"
|
||||||
<CloseBold class="remove" @click="removeItem(item.i)" />
|
/>
|
||||||
</div>
|
<CloseBold class="remove" @click="removeItem(item.i)" />
|
||||||
<!-- <span class="text">{{ `${item?.name}` }}</span>
|
</div>
|
||||||
-->
|
<!-- <span class="text">{{ `${item?.name}` }}</span>
|
||||||
</template>
|
-->
|
||||||
</GridLayout>
|
</template>
|
||||||
</div>
|
</GridLayout>
|
||||||
</div>
|
</div>
|
||||||
</el-card>
|
</div>
|
||||||
</div>
|
</el-card>
|
||||||
</template>
|
</div>
|
||||||
<script setup lang="ts">
|
</template>
|
||||||
import { ref, reactive, onMounted } from 'vue'
|
<script setup lang="ts">
|
||||||
import { useRouter } from 'vue-router'
|
import { ref, reactive, onMounted } from 'vue'
|
||||||
import BackComponent from '@/components/icon/back/index.vue'
|
import { useRouter } from 'vue-router'
|
||||||
import { mainHeight } from '@/utils/layout'
|
import BackComponent from '@/components/icon/back/index.vue'
|
||||||
import type { CollapseIconPositionType } from 'element-plus'
|
import { mainHeight } from '@/utils/layout'
|
||||||
import { componentTree } from '@/api/user-boot/user'
|
import type { CollapseIconPositionType } from 'element-plus'
|
||||||
import { GridLayout, GridItem } from 'grid-layout-plus'
|
import { componentTree } from '@/api/user-boot/user'
|
||||||
import { throttle } from 'lodash-es'
|
import { GridLayout, GridItem } from 'grid-layout-plus'
|
||||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
import { throttle } from 'lodash-es'
|
||||||
import { Tools, CloseBold } from '@element-plus/icons-vue'
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||||
import { addDashboard, updateDashboard, queryById } from '@/api/system-boot/csstatisticalset'
|
import { Tools, CloseBold } from '@element-plus/icons-vue'
|
||||||
import html2canvas from 'html2canvas'
|
import { addDashboard, updateDashboard, queryById } from '@/api/system-boot/csstatisticalset'
|
||||||
const { go } = useRouter()
|
import html2canvas from 'html2canvas'
|
||||||
const { query } = useRoute()
|
const { go } = useRouter()
|
||||||
const height = mainHeight(108)
|
const { query } = useRoute()
|
||||||
const indicatorHeight = mainHeight(128)
|
const height = mainHeight(108)
|
||||||
const rowHeight = ref(0)
|
const indicatorHeight = mainHeight(128)
|
||||||
const GridHeight = ref(0)
|
const rowHeight = ref(0)
|
||||||
const position = ref<CollapseIconPositionType>('left')
|
const GridHeight = ref(0)
|
||||||
const form: any = reactive({
|
const position = ref<CollapseIconPositionType>('left')
|
||||||
pageName: '',
|
const form: any = reactive({
|
||||||
thumbnail: '',
|
pageName: '',
|
||||||
containerConfig: [],
|
thumbnail: '',
|
||||||
sort: '100',
|
containerConfig: [],
|
||||||
id: '',
|
sort: '100',
|
||||||
remark: ''
|
id: '',
|
||||||
})
|
remark: ''
|
||||||
const activeNames = ref([])
|
})
|
||||||
const activeNames1 = ref([])
|
const activeNames = ref([])
|
||||||
const rules = {
|
const activeNames1 = ref([])
|
||||||
pageName: [{ required: true, message: '请输入页面名称', trigger: 'blur' }],
|
const rules = {
|
||||||
projectIds: [{ required: true, message: '请选择工程页面', trigger: 'change' }],
|
pageName: [{ required: true, message: '请输入页面名称', trigger: 'blur' }],
|
||||||
sort: [{ required: true, message: '请输入排序', trigger: 'blur' }]
|
projectIds: [{ required: true, message: '请选择工程页面', trigger: 'change' }],
|
||||||
}
|
sort: [{ required: true, message: '请输入排序', trigger: 'blur' }]
|
||||||
const formRef = ref()
|
}
|
||||||
const layout: any = ref([
|
const formRef = ref()
|
||||||
// { x: 0, y: 0, w: 4, h: 2, i: '0', name: '', path: '' },
|
const layout: any = ref([
|
||||||
// { x: 4, y: 0, w: 4, h: 2, i: '1', name: '', path: '' },
|
// { x: 0, y: 0, w: 4, h: 2, i: '0', name: '', path: '' },
|
||||||
// { x: 8, y: 0, w: 4, h: 2, i: '2', name: '', path: '' },
|
// { x: 4, y: 0, w: 4, h: 2, i: '1', name: '', path: '' },
|
||||||
// { x: 0, y: 0, w: 4, h: 2, i: '3', name: '', path: '' },
|
// { x: 8, y: 0, w: 4, h: 2, i: '2', name: '', path: '' },
|
||||||
// { x: 4, y: 0, w: 4, h: 2, i: '4', name: '', path: '' },
|
// { x: 0, y: 0, w: 4, h: 2, i: '3', name: '', path: '' },
|
||||||
// { x: 8, y: 0, w: 4, h: 2, i: '5', name: '', path: '' },
|
// { x: 4, y: 0, w: 4, h: 2, i: '4', name: '', path: '' },
|
||||||
// { x: 0, y: 0, w: 4, h: 2, i: '6', name: '', path: '' },
|
// { x: 8, y: 0, w: 4, h: 2, i: '5', name: '', path: '' },
|
||||||
// { x: 4, y: 0, w: 4, h: 2, i: '7', name: '', path: '' },
|
// { x: 0, y: 0, w: 4, h: 2, i: '6', name: '', path: '' },
|
||||||
// { x: 8, y: 0, w: 4, h: 2, i: '8', name: '', path: '' }
|
// { x: 4, y: 0, w: 4, h: 2, i: '7', name: '', path: '' },
|
||||||
])
|
// { x: 8, y: 0, w: 4, h: 2, i: '8', name: '', path: '' }
|
||||||
const treeComponents: any = ref([]) //组件树
|
])
|
||||||
const treeComponentsCopy: any = ref([]) //组件树
|
const treeComponents: any = ref([]) //组件树
|
||||||
const info = () => {
|
const treeComponentsCopy: any = ref([]) //组件树
|
||||||
activeNames.value = []
|
const info = () => {
|
||||||
activeNames1.value = []
|
activeNames.value = []
|
||||||
componentTree().then(res => {
|
activeNames1.value = []
|
||||||
treeComponents.value = res.data
|
componentTree().then(res => {
|
||||||
activeNames.value = treeComponents.value.map(item => item.id)
|
treeComponents.value = res.data
|
||||||
res.data.forEach(item => {
|
activeNames.value = treeComponents.value.map(item => item.id)
|
||||||
item.children.forEach(k => {
|
res.data.forEach(item => {
|
||||||
activeNames1.value.push(k.id)
|
item.children.forEach(k => {
|
||||||
})
|
activeNames1.value.push(k.id)
|
||||||
})
|
})
|
||||||
treeComponentsCopy.value = tree2List(JSON.parse(JSON.stringify(res.data)), 0)
|
})
|
||||||
})
|
treeComponentsCopy.value = tree2List(JSON.parse(JSON.stringify(res.data)), 0)
|
||||||
|
})
|
||||||
if (query.id) {
|
|
||||||
queryById({ id: query.id }).then(res => {
|
if (query.id) {
|
||||||
layout.value = JSON.parse(res.data.containerConfig)
|
queryById({ id: query.id }).then(res => {
|
||||||
form.pageName = res.data.pageName
|
layout.value = JSON.parse(res.data.containerConfig)
|
||||||
form.sort = res.data.sort
|
form.pageName = res.data.pageName
|
||||||
form.remark = res.data.remark
|
form.sort = res.data.sort
|
||||||
form.id = res.data.id
|
form.remark = res.data.remark
|
||||||
})
|
form.id = res.data.id
|
||||||
}
|
})
|
||||||
}
|
}
|
||||||
|
}
|
||||||
// 扁平化树
|
|
||||||
const tree2List = (list: any, id: any) => {
|
// 扁平化树
|
||||||
//存储结果的数组
|
const tree2List = (list: any, id: any) => {
|
||||||
let arr: any = []
|
//存储结果的数组
|
||||||
// 遍历 tree 数组
|
let arr: any = []
|
||||||
list.forEach((item: any) => {
|
// 遍历 tree 数组
|
||||||
item.uPid = id
|
list.forEach((item: any) => {
|
||||||
item.uId = Math.random() * 1000
|
item.uPid = id
|
||||||
// 判断item是否存在children
|
item.uId = Math.random() * 1000
|
||||||
if (!item.children) return arr.push(item)
|
// 判断item是否存在children
|
||||||
// 函数递归，对children数组进行tree2List的转换
|
if (!item.children) return arr.push(item)
|
||||||
const children = tree2List(item.children, item.uId)
|
// 函数递归，对children数组进行tree2List的转换
|
||||||
// 删除item的children属性
|
const children = tree2List(item.children, item.uId)
|
||||||
delete item.children
|
// 删除item的children属性
|
||||||
// 把item和children数组添加至结果数组
|
delete item.children
|
||||||
//..children: 意思是把children数组展开
|
// 把item和children数组添加至结果数组
|
||||||
arr.push(item, ...children)
|
//..children: 意思是把children数组展开
|
||||||
})
|
arr.push(item, ...children)
|
||||||
// 返回结果数组
|
})
|
||||||
return arr
|
// 返回结果数组
|
||||||
}
|
return arr
|
||||||
// 删除拖拽
|
}
|
||||||
const removeItem = (id: string) => {
|
// 删除拖拽
|
||||||
const index = layout.value.findIndex(item => item.i === id)
|
const removeItem = (id: string) => {
|
||||||
|
const index = layout.value.findIndex(item => item.i === id)
|
||||||
if (index > -1) {
|
|
||||||
layout.value.splice(index, 1)
|
if (index > -1) {
|
||||||
}
|
layout.value.splice(index, 1)
|
||||||
}
|
}
|
||||||
const wrapper = ref<HTMLElement>()
|
}
|
||||||
const gridLayout = ref<InstanceType<typeof GridLayout>>()
|
const wrapper = ref<HTMLElement>()
|
||||||
|
const gridLayout = ref<InstanceType<typeof GridLayout>>()
|
||||||
const mouseAt = { x: -1, y: -1 }
|
|
||||||
|
const mouseAt = { x: -1, y: -1 }
|
||||||
function syncMousePosition(event: MouseEvent) {
|
|
||||||
mouseAt.x = event.clientX
|
function syncMousePosition(event: MouseEvent) {
|
||||||
mouseAt.y = event.clientY
|
mouseAt.x = event.clientX
|
||||||
}
|
mouseAt.y = event.clientY
|
||||||
|
}
|
||||||
const dropId = 'drop'
|
|
||||||
const dragItem = { x: -1, y: -1, w: 4, h: 2, i: '' }
|
const dropId = 'drop'
|
||||||
|
const dragItem = { x: -1, y: -1, w: 4, h: 2, i: '' }
|
||||||
const drag = throttle(row => {
|
|
||||||
// console.log("🚀 ~ drag ~ row:", row)
|
const drag = throttle(row => {
|
||||||
|
// console.log("🚀 ~ drag ~ row:", row)
|
||||||
const parentRect = wrapper.value?.getBoundingClientRect()
|
|
||||||
|
const parentRect = wrapper.value?.getBoundingClientRect()
|
||||||
if (!parentRect || !gridLayout.value) return
|
|
||||||
|
if (!parentRect || !gridLayout.value) return
|
||||||
const mouseInGrid =
|
|
||||||
mouseAt.x > parentRect.left &&
|
const mouseInGrid =
|
||||||
mouseAt.x < parentRect.right &&
|
mouseAt.x > parentRect.left &&
|
||||||
mouseAt.y > parentRect.top &&
|
mouseAt.x < parentRect.right &&
|
||||||
mouseAt.y < parentRect.bottom
|
mouseAt.y > parentRect.top &&
|
||||||
|
mouseAt.y < parentRect.bottom
|
||||||
if (mouseInGrid && !layout.value.find(item => item.i === dropId)) {
|
|
||||||
layout.value.push({
|
if (mouseInGrid && !layout.value.find(item => item.i === dropId)) {
|
||||||
x: (layout.value.length * 2) % 6,
|
layout.value.push({
|
||||||
y: layout.value.length + 6, // puts it at the bottom
|
x: (layout.value.length * 2) % 6,
|
||||||
w: 4,
|
y: layout.value.length + 6, // puts it at the bottom
|
||||||
h: 2,
|
w: 4,
|
||||||
i: dropId
|
h: 2,
|
||||||
})
|
i: dropId
|
||||||
}
|
})
|
||||||
|
}
|
||||||
const index = layout.value.findIndex(item => item.i === dropId)
|
|
||||||
|
const index = layout.value.findIndex(item => item.i === dropId)
|
||||||
if (index !== -1) {
|
|
||||||
const item = gridLayout.value.getItem(dropId)
|
if (index !== -1) {
|
||||||
|
const item = gridLayout.value.getItem(dropId)
|
||||||
if (!item) return
|
|
||||||
|
if (!item) return
|
||||||
try {
|
|
||||||
item.wrapper.style.display = 'none'
|
try {
|
||||||
} catch (e) {}
|
item.wrapper.style.display = 'none'
|
||||||
|
} catch (e) {}
|
||||||
Object.assign(item.state, {
|
|
||||||
top: mouseAt.y - parentRect.top,
|
Object.assign(item.state, {
|
||||||
left: mouseAt.x - parentRect.left
|
top: mouseAt.y - parentRect.top,
|
||||||
})
|
left: mouseAt.x - parentRect.left
|
||||||
const newPos = item.calcXY(mouseAt.y - parentRect.top, mouseAt.x - parentRect.left)
|
})
|
||||||
|
const newPos = item.calcXY(mouseAt.y - parentRect.top, mouseAt.x - parentRect.left)
|
||||||
if (mouseInGrid) {
|
|
||||||
gridLayout.value.dragEvent('dragstart', dropId, newPos.x, newPos.y, dragItem.h, dragItem.w)
|
if (mouseInGrid) {
|
||||||
dragItem.i = String(index)
|
gridLayout.value.dragEvent('dragstart', dropId, newPos.x, newPos.y, dragItem.h, dragItem.w)
|
||||||
dragItem.x = layout.value[index].x
|
dragItem.i = String(index)
|
||||||
dragItem.y = layout.value[index].y
|
dragItem.x = layout.value[index].x
|
||||||
} else {
|
dragItem.y = layout.value[index].y
|
||||||
gridLayout.value.dragEvent('dragend', dropId, newPos.x, newPos.y, dragItem.h, dragItem.w)
|
} else {
|
||||||
layout.value = layout.value.filter(item => item.i !== dropId)
|
gridLayout.value.dragEvent('dragend', dropId, newPos.x, newPos.y, dragItem.h, dragItem.w)
|
||||||
}
|
layout.value = layout.value.filter(item => item.i !== dropId)
|
||||||
}
|
}
|
||||||
})
|
}
|
||||||
|
})
|
||||||
function dragEnd(row: any) {
|
|
||||||
console.log('🚀 ~ drag ~ row:', row)
|
function dragEnd(row: any) {
|
||||||
const parentRect = wrapper.value?.getBoundingClientRect()
|
console.log('🚀 ~ drag ~ row:', row)
|
||||||
|
const parentRect = wrapper.value?.getBoundingClientRect()
|
||||||
if (!parentRect || !gridLayout.value) return
|
|
||||||
|
if (!parentRect || !gridLayout.value) return
|
||||||
const mouseInGrid =
|
|
||||||
mouseAt.x > parentRect.left &&
|
const mouseInGrid =
|
||||||
mouseAt.x < parentRect.right &&
|
mouseAt.x > parentRect.left &&
|
||||||
mouseAt.y > parentRect.top &&
|
mouseAt.x < parentRect.right &&
|
||||||
mouseAt.y < parentRect.bottom
|
mouseAt.y > parentRect.top &&
|
||||||
|
mouseAt.y < parentRect.bottom
|
||||||
if (mouseInGrid) {
|
|
||||||
gridLayout.value.dragEvent('dragend', dropId, dragItem.x, dragItem.y, dragItem.h, dragItem.w)
|
if (mouseInGrid) {
|
||||||
layout.value = layout.value.filter(item => item.i !== dropId)
|
gridLayout.value.dragEvent('dragend', dropId, dragItem.x, dragItem.y, dragItem.h, dragItem.w)
|
||||||
} else {
|
layout.value = layout.value.filter(item => item.i !== dropId)
|
||||||
return
|
} else {
|
||||||
}
|
return
|
||||||
|
}
|
||||||
layout.value.push({
|
|
||||||
x: dragItem.x,
|
layout.value.push({
|
||||||
y: dragItem.y,
|
x: dragItem.x,
|
||||||
w: dragItem.w,
|
y: dragItem.y,
|
||||||
h: dragItem.h,
|
w: dragItem.w,
|
||||||
i: dragItem.i,
|
h: dragItem.h,
|
||||||
name: row.name,
|
i: dragItem.i,
|
||||||
path: row.path,
|
name: row.name,
|
||||||
icon: row.icon,
|
path: row.path,
|
||||||
timeKey: row.timeKey
|
icon: row.icon,
|
||||||
})
|
timeKey: row.timeKey
|
||||||
gridLayout.value.dragEvent('dragend', dragItem.i, dragItem.x, dragItem.y, dragItem.h, dragItem.w)
|
})
|
||||||
const item = gridLayout.value.getItem(dropId)
|
gridLayout.value.dragEvent('dragend', dragItem.i, dragItem.x, dragItem.y, dragItem.h, dragItem.w)
|
||||||
if (!item) return
|
const item = gridLayout.value.getItem(dropId)
|
||||||
try {
|
if (!item) return
|
||||||
item.wrapper.style.display = ''
|
try {
|
||||||
} catch (e) {}
|
item.wrapper.style.display = ''
|
||||||
}
|
} catch (e) {}
|
||||||
// 保存
|
}
|
||||||
const onSubmit = () => {
|
// 保存
|
||||||
if (layout.value.length == 0) {
|
const onSubmit = () => {
|
||||||
return ElMessage.warning('页面设计不能为空!')
|
if (layout.value.length == 0) {
|
||||||
}
|
return ElMessage.warning('页面设计不能为空!')
|
||||||
const maxValue = Math.max(...layout.value.map(item => item.y + item.h))
|
}
|
||||||
if (maxValue > 6) {
|
const maxValue = Math.max(...layout.value.map(item => item.y + item.h))
|
||||||
return ElMessage.warning('组件不能超出当前容器!')
|
if (maxValue > 6) {
|
||||||
}
|
return ElMessage.warning('组件不能超出当前容器!')
|
||||||
|
}
|
||||||
formRef.value.validate(async (valid: boolean) => {
|
|
||||||
let url = ''
|
formRef.value.validate(async (valid: boolean) => {
|
||||||
await html2canvas(document.querySelector('.GridLayout'), {
|
let url = ''
|
||||||
useCORS: true
|
await html2canvas(document.querySelector('.GridLayout'), {
|
||||||
}).then(canvas => {
|
useCORS: true
|
||||||
url = canvas.toDataURL('image/png')
|
}).then(canvas => {
|
||||||
})
|
url = canvas.toDataURL('image/png')
|
||||||
|
})
|
||||||
if (valid) {
|
|
||||||
if (form.id == '') {
|
if (valid) {
|
||||||
addDashboard({ ...form, containerConfig: JSON.stringify(layout.value), thumbnail: url }).then(
|
if (form.id == '') {
|
||||||
(res: any) => {
|
addDashboard({ ...form, containerConfig: JSON.stringify(layout.value), thumbnail: url }).then(
|
||||||
ElMessage.success('新增页面成功!')
|
(res: any) => {
|
||||||
go(-1)
|
ElMessage.success('新增页面成功!')
|
||||||
}
|
go(-1)
|
||||||
)
|
}
|
||||||
} else {
|
)
|
||||||
updateDashboard({ ...form, containerConfig: JSON.stringify(layout.value), thumbnail: url }).then(
|
} else {
|
||||||
(res: any) => {
|
updateDashboard({ ...form, containerConfig: JSON.stringify(layout.value), thumbnail: url }).then(
|
||||||
ElMessage.success('修改页面成功!')
|
(res: any) => {
|
||||||
go(-1)
|
ElMessage.success('修改页面成功!')
|
||||||
}
|
go(-1)
|
||||||
)
|
}
|
||||||
}
|
)
|
||||||
}
|
}
|
||||||
})
|
}
|
||||||
}
|
})
|
||||||
const getImg = throttle((path: string) => {
|
}
|
||||||
if (path != undefined) return treeComponentsCopy.value.filter(item => item.path == path)[0]?.image
|
const getImg = throttle((path: string) => {
|
||||||
})
|
if (path != undefined) return treeComponentsCopy.value.filter(item => item.path == path)[0]?.image
|
||||||
onMounted(() => {
|
})
|
||||||
info()
|
onMounted(() => {
|
||||||
|
info()
|
||||||
GridHeight.value = wrapper.value?.offsetWidth / 1.77777
|
|
||||||
rowHeight.value = GridHeight.value / 6 - 11.5
|
GridHeight.value = wrapper.value?.offsetWidth / 1.77777
|
||||||
document.documentElement.style.setProperty('--GridLayout-height', rowHeight.value + 10 + 'px')
|
rowHeight.value = GridHeight.value / 6 - 11.5
|
||||||
document.addEventListener('dragover', syncMousePosition)
|
document.documentElement.style.setProperty('--GridLayout-height', rowHeight.value + 10 + 'px')
|
||||||
})
|
document.addEventListener('dragover', syncMousePosition)
|
||||||
|
})
|
||||||
onBeforeUnmount(() => {
|
|
||||||
document.removeEventListener('dragover', syncMousePosition)
|
onBeforeUnmount(() => {
|
||||||
})
|
document.removeEventListener('dragover', syncMousePosition)
|
||||||
// onMounted(() => {
|
})
|
||||||
|
// onMounted(() => {
|
||||||
// // document.addEventListener('dragover', syncMousePosition)
|
|
||||||
// })
|
// // document.addEventListener('dragover', syncMousePosition)
|
||||||
</script>
|
// })
|
||||||
<style lang="scss" scoped>
|
</script>
|
||||||
.form-four {
|
<style lang="scss" scoped>
|
||||||
display: flex;
|
.form-four {
|
||||||
flex-wrap: wrap;
|
display: flex;
|
||||||
justify-content: space-between;
|
flex-wrap: wrap;
|
||||||
.el-form-item {
|
justify-content: space-between;
|
||||||
display: flex;
|
.el-form-item {
|
||||||
flex: 1;
|
display: flex;
|
||||||
align-items: center;
|
flex: 1;
|
||||||
.el-form-item__content {
|
align-items: center;
|
||||||
width: 100%;
|
.el-form-item__content {
|
||||||
flex: 1;
|
width: 100%;
|
||||||
.el-select,
|
flex: 1;
|
||||||
.el-cascader,
|
.el-select,
|
||||||
.el-input__inner,
|
.el-cascader,
|
||||||
.el-date-editor {
|
.el-input__inner,
|
||||||
width: 100%;
|
.el-date-editor {
|
||||||
}
|
width: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
:deep(.el-card__body) {
|
}
|
||||||
padding: 20px 20px 12px;
|
:deep(.el-card__body) {
|
||||||
}
|
padding: 20px 20px 12px;
|
||||||
.Box {
|
}
|
||||||
display: flex;
|
.Box {
|
||||||
flex-wrap: wrap;
|
display: flex;
|
||||||
}
|
flex-wrap: wrap;
|
||||||
.imgBox {
|
}
|
||||||
// padding: 10px;
|
.imgBox {
|
||||||
display: flex;
|
// padding: 10px;
|
||||||
flex-direction: column;
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
box-shadow: var(--el-box-shadow-light);
|
|
||||||
--el-card-border-color: var(--el-border-color-light);
|
box-shadow: var(--el-box-shadow-light);
|
||||||
--el-card-border-radius: 4px;
|
--el-card-border-color: var(--el-border-color-light);
|
||||||
--el-card-padding: 20px;
|
--el-card-border-radius: 4px;
|
||||||
--el-card-bg-color: var(--el-fill-color-blank);
|
--el-card-padding: 20px;
|
||||||
background-color: var(--el-card-bg-color);
|
--el-card-bg-color: var(--el-fill-color-blank);
|
||||||
border: 1px solid var(--el-card-border-color);
|
background-color: var(--el-card-bg-color);
|
||||||
border-radius: var(--el-card-border-radius);
|
border: 1px solid var(--el-card-border-color);
|
||||||
color: var(--el-text-color-primary);
|
border-radius: var(--el-card-border-radius);
|
||||||
overflow: hidden;
|
color: var(--el-text-color-primary);
|
||||||
transition: var(--el-transition-duration) 0.3s;
|
overflow: hidden;
|
||||||
.textName {
|
transition: var(--el-transition-duration) 0.3s;
|
||||||
padding: 2px 5px;
|
.textName {
|
||||||
background-color: var(--el-color-primary);
|
padding: 2px 5px;
|
||||||
color: #fff;
|
background-color: var(--el-color-primary);
|
||||||
}
|
color: #fff;
|
||||||
user-select: none; /* 标准属性 */
|
}
|
||||||
-webkit-user-select: none; /* Chrome/Safari */
|
user-select: none; /* 标准属性 */
|
||||||
-moz-user-select: none; /* Firefox */
|
-webkit-user-select: none; /* Chrome/Safari */
|
||||||
-ms-user-select: none; /* IE/Edge */
|
-moz-user-select: none; /* Firefox */
|
||||||
}
|
-ms-user-select: none; /* IE/Edge */
|
||||||
.vgl-layout {
|
}
|
||||||
background-color: #eee;
|
.vgl-layout {
|
||||||
}
|
background-color: #eee;
|
||||||
|
}
|
||||||
.remove {
|
|
||||||
position: absolute;
|
.remove {
|
||||||
top: 5px;
|
position: absolute;
|
||||||
right: 2px;
|
top: 5px;
|
||||||
width: 16px;
|
right: 2px;
|
||||||
color: #fff;
|
width: 16px;
|
||||||
cursor: pointer;
|
color: #fff;
|
||||||
}
|
cursor: pointer;
|
||||||
|
}
|
||||||
.vgl-layout::before {
|
|
||||||
position: absolute;
|
.vgl-layout::before {
|
||||||
width: calc(100% - 5px);
|
position: absolute;
|
||||||
height: calc(100% - 5px);
|
width: calc(100% - 5px);
|
||||||
margin: 5px;
|
height: calc(100% - 5px);
|
||||||
content: '';
|
margin: 5px;
|
||||||
background-image: linear-gradient(to right, lightgrey 1px, transparent 1px),
|
content: '';
|
||||||
linear-gradient(to bottom, lightgrey 1px, transparent 1px);
|
background-image: linear-gradient(to right, lightgrey 1px, transparent 1px),
|
||||||
background-repeat: repeat;
|
linear-gradient(to bottom, lightgrey 1px, transparent 1px);
|
||||||
background-size: calc(calc(100% - 5px) / 12) var(--GridLayout-height);
|
background-repeat: repeat;
|
||||||
}
|
background-size: calc(calc(100% - 5px) / 12) var(--GridLayout-height);
|
||||||
|
}
|
||||||
:deep(.vgl-item:not(.vgl-item--placeholder)) {
|
|
||||||
background-color: #fff;
|
:deep(.vgl-item:not(.vgl-item--placeholder)) {
|
||||||
border: 1px solid black;
|
background-color: #fff;
|
||||||
}
|
border: 1px solid black;
|
||||||
</style>
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@@ -47,7 +47,7 @@ import Table from '@/components/table/index.vue'
|
|||||||
import BackComponent from '@/components/icon/back/index.vue'
|
import BackComponent from '@/components/icon/back/index.vue'
|
||||||
import completenessDetails from './completenessDetails.vue'
|
import completenessDetails from './completenessDetails.vue'
|
||||||
import { genFileId, ElMessage } from 'element-plus'
|
import { genFileId, ElMessage } from 'element-plus'
|
||||||
import { uploadUserData ,deleteUserDataByIds} from '@/api/advance-boot/division'
|
import { uploadUserData, deleteUserDataByIds } from '@/api/advance-boot/division'
|
||||||
import type { UploadInstance, UploadProps, UploadRawFile } from 'element-plus'
|
import type { UploadInstance, UploadProps, UploadRawFile } from 'element-plus'
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: 'division/aListOfLoadData'
|
name: 'division/aListOfLoadData'
|
||||||
@@ -78,6 +78,9 @@ const tableStore = new TableStore({
|
|||||||
title: '完整性详情',
|
title: '完整性详情',
|
||||||
type: 'primary',
|
type: 'primary',
|
||||||
icon: 'el-icon-Plus',
|
icon: 'el-icon-Plus',
|
||||||
|
disabled: row => {
|
||||||
|
return row.integrity == 1
|
||||||
|
},
|
||||||
render: 'basicButton',
|
render: 'basicButton',
|
||||||
click: row => {
|
click: row => {
|
||||||
completenessDetailsRef.value.open(row.id)
|
completenessDetailsRef.value.open(row.id)
|
||||||
@@ -129,7 +132,7 @@ const submitupload = () => {
|
|||||||
ElMessage.warning('请上传文件！')
|
ElMessage.warning('请上传文件！')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
ElMessage.info('上传中,请稍等...')
|
ElMessage.info('上传中,请稍等...')
|
||||||
const formData = new FormData()
|
const formData = new FormData()
|
||||||
formData.append('file', fileList.value[0].raw)
|
formData.append('file', fileList.value[0].raw)
|
||||||
loading.value = true
|
loading.value = true
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
<template>
|
<template>
|
||||||
|
|
||||||
<el-dialog v-model="dialogVisible" draggable title="完整性不足详情" width="1000">
|
<el-dialog v-model="dialogVisible" draggable title="完整性不足详情" width="1000">
|
||||||
<TableHeader :showReset="false" ref="TableHeaderRef">
|
<TableHeader :showReset="false" ref="TableHeaderRef">
|
||||||
<template #select>
|
<template #select>
|
||||||
@@ -13,11 +12,9 @@
|
|||||||
</template>
|
</template>
|
||||||
</TableHeader>
|
</TableHeader>
|
||||||
<Table ref="tableRef"></Table>
|
<Table ref="tableRef"></Table>
|
||||||
|
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
<script setup lang='ts'>
|
<script setup lang="ts">
|
||||||
import TableStore from '@/utils/tableStore'
|
import TableStore from '@/utils/tableStore'
|
||||||
import TableHeader from '@/components/table/header/index.vue'
|
import TableHeader from '@/components/table/header/index.vue'
|
||||||
import Table from '@/components/table/index.vue'
|
import Table from '@/components/table/index.vue'
|
||||||
@@ -33,15 +30,20 @@ const tableStore = new TableStore({
|
|||||||
{ title: '数据名', field: 'name' },
|
{ title: '数据名', field: 'name' },
|
||||||
{ title: '用户名', field: 'userName' },
|
{ title: '用户名', field: 'userName' },
|
||||||
{ title: '测量点局号', field: 'lineNo' },
|
{ title: '测量点局号', field: 'lineNo' },
|
||||||
{ title: '日期', field: 'upDataTime' },
|
{ title: '日期', field: 'updateTime' },
|
||||||
{ title: '完整性', field: 'integrity' },
|
{
|
||||||
|
title: '完整性(%)',
|
||||||
|
field: 'integrity',
|
||||||
|
formatter: (row: any) => {
|
||||||
|
return Math.floor(row.cellValue * 10000) / 100
|
||||||
|
}
|
||||||
|
}
|
||||||
],
|
],
|
||||||
loadCallback: () => {
|
loadCallback: () => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
tableStore.table.height = mainHeight(0,2).height as any
|
tableStore.table.height = mainHeight(0, 2).height as any
|
||||||
// console.log("🚀 ~ setTimeout ~ tableStore.table.height:", tableStore.table.height)
|
// console.log("🚀 ~ setTimeout ~ tableStore.table.height:", tableStore.table.height)
|
||||||
|
}, 0)
|
||||||
}, 0)
|
|
||||||
// setTimeout(() => { tableStore.table.height = 'calc((100vh) / 2)'}, 1000)
|
// setTimeout(() => { tableStore.table.height = 'calc((100vh) / 2)'}, 1000)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@@ -49,17 +51,12 @@ const tableStore = new TableStore({
|
|||||||
provide('tableStore', tableStore)
|
provide('tableStore', tableStore)
|
||||||
tableStore.table.params.searchValue = ''
|
tableStore.table.params.searchValue = ''
|
||||||
const open = (id: string) => {
|
const open = (id: string) => {
|
||||||
|
|
||||||
tableStore.table.params.userDataId = id
|
tableStore.table.params.userDataId = id
|
||||||
dialogVisible.value = true
|
dialogVisible.value = true
|
||||||
|
|
||||||
tableStore.index()
|
tableStore.index()
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
defineExpose({ open })
|
defineExpose({ open })
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped></style>
|
<style lang="scss" scoped></style>
|
||||||
|
|||||||
@@ -5,7 +5,7 @@
|
|||||||
<!-- <div style="font-size: 14px; font-weight: 500">
|
<!-- <div style="font-size: 14px; font-weight: 500">
|
||||||
|
|
||||||
</div> -->
|
</div> -->
|
||||||
<span class="monitoring-point"> {{ query.name || '' }}</span>
|
<span class="monitoring-point">{{ query.name || '' }}</span>
|
||||||
<back-component />
|
<back-component />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -21,9 +21,11 @@
|
|||||||
<div style="height: calc(100vh - 250px); overflow-y: auto">
|
<div style="height: calc(100vh - 250px); overflow-y: auto">
|
||||||
<div
|
<div
|
||||||
class="box boxTab mb10"
|
class="box boxTab mb10"
|
||||||
:style="`height: calc((100vh - 280px) / ${
|
:style="{
|
||||||
item.list.length == 0 ? 1 : item.list.length > 3 ? 3 : item.list.length
|
height: `calc((100vh - 280px) / ${
|
||||||
})`"
|
item.list.length == 0 ? 1 : item.list.length > 3 ? 3 : item.list.length
|
||||||
|
})`
|
||||||
|
}"
|
||||||
v-for="(value, i) in item.dynamicOptions"
|
v-for="(value, i) in item.dynamicOptions"
|
||||||
:key="i"
|
:key="i"
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -1,202 +1,211 @@
|
|||||||
<template>
|
<template>
|
||||||
<div style="display: flex; flex-direction: column; height: 100%">
|
<div style="display: flex; flex-direction: column; height: 100%">
|
||||||
<TableHeader ref="TableHeaderRef" :showSearch="false">
|
<TableHeader ref="TableHeaderRef" :showSearch="false">
|
||||||
<template v-slot:select>
|
<template v-slot:select>
|
||||||
<el-form-item label="日期">
|
<el-form-item label="日期">
|
||||||
<DatePicker ref="datePickerRef"></DatePicker>
|
<DatePicker ref="datePickerRef"></DatePicker>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="对比">
|
<el-form-item label="对比">
|
||||||
<el-select v-model="searchType" clearable placeholder="可选择同比、环比">
|
<el-select v-model="searchType" clearable placeholder="可选择同比、环比">
|
||||||
<el-option
|
<el-option v-for="item in searchTypeOptions" :key="item.value" :label="item.label"
|
||||||
v-for="item in searchTypeOptions"
|
:value="item.value" />
|
||||||
:key="item.value"
|
</el-select>
|
||||||
:label="item.label"
|
</el-form-item>
|
||||||
:value="item.value"
|
</template>
|
||||||
/>
|
<template v-slot:operation>
|
||||||
</el-select>
|
<el-button type="primary" @click="init" icon="el-icon-Search">查询</el-button>
|
||||||
</el-form-item>
|
</template>
|
||||||
</template>
|
</TableHeader>
|
||||||
<template v-slot:operation>
|
|
||||||
<el-button type="primary" @click="init" icon="el-icon-Search">查询</el-button>
|
<div style="flex: 1; display: flex; overflow: hidden" class="mt10" v-loading="loading">
|
||||||
</template>
|
<div style="flex: 1">
|
||||||
</TableHeader>
|
<my-echart :options="options1" />
|
||||||
|
</div>
|
||||||
<div style="flex: 1; display: flex; overflow: hidden" class="mt10" v-loading="loading">
|
<div style="flex: 1">
|
||||||
<div style="flex: 1">
|
<my-echart :options="options2" />
|
||||||
<my-echart :options="options1" />
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="flex: 1">
|
</div>
|
||||||
<my-echart :options="options2" />
|
</template>
|
||||||
</div>
|
<script setup lang="ts">
|
||||||
</div>
|
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||||
</div>
|
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||||
</template>
|
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||||
<script setup lang="ts">
|
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
import { getProbabilityDistribution } from '@/api/event-boot/monitor'
|
||||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
import { getRunInfoData, getComFlagInfoData } from '@/api/device-boot/communicate'
|
||||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
import TableHeader from '@/components/table/header/index.vue'
|
||||||
import { getProbabilityDistribution } from '@/api/event-boot/monitor'
|
import TableStore from '@/utils/tableStore'
|
||||||
import { getRunInfoData, getComFlagInfoData } from '@/api/device-boot/communicate'
|
const tableStore = new TableStore({
|
||||||
import TableHeader from '@/components/table/header/index.vue'
|
url: '',
|
||||||
import TableStore from '@/utils/tableStore'
|
method: 'POST',
|
||||||
const tableStore = new TableStore({
|
column: []
|
||||||
url: '',
|
})
|
||||||
method: 'POST',
|
const datePickerRef = ref()
|
||||||
column: []
|
const monitoringPoint = useMonitoringPoint()
|
||||||
})
|
const loading = ref(true)
|
||||||
const datePickerRef = ref()
|
const formData = reactive({
|
||||||
const monitoringPoint = useMonitoringPoint()
|
id: monitoringPoint.state.lineId,
|
||||||
const loading = ref(true)
|
searchBeginTime: '',
|
||||||
const formData = reactive({
|
searchEndTime: '',
|
||||||
id: monitoringPoint.state.lineId,
|
periodBeginTime: '',
|
||||||
searchBeginTime: '',
|
periodEndTime: ''
|
||||||
searchEndTime: '',
|
})
|
||||||
periodBeginTime: '',
|
const searchType = ref('')
|
||||||
periodEndTime: ''
|
const searchTypeOptions = [
|
||||||
})
|
{
|
||||||
const searchType = ref('')
|
label: '同比',
|
||||||
const searchTypeOptions = [
|
value: '1'
|
||||||
{
|
},
|
||||||
label: '同比',
|
{
|
||||||
value: '1'
|
label: '环比',
|
||||||
},
|
value: '2'
|
||||||
{
|
}
|
||||||
label: '环比',
|
]
|
||||||
value: '2'
|
const options1 = ref({})
|
||||||
}
|
const options2 = ref({})
|
||||||
]
|
onMounted(() => {
|
||||||
const options1 = ref({})
|
init()
|
||||||
const options2 = ref({})
|
})
|
||||||
onMounted(() => {
|
const init = () => {
|
||||||
init()
|
loading.value = true
|
||||||
})
|
formData.id = monitoringPoint.state.lineId
|
||||||
const init = () => {
|
formData.searchBeginTime = datePickerRef.value.timeValue[0]
|
||||||
loading.value = true
|
formData.searchEndTime = datePickerRef.value.timeValue[1]
|
||||||
formData.id = monitoringPoint.state.lineId
|
if (searchType.value == '1') {
|
||||||
formData.searchBeginTime = datePickerRef.value.timeValue[0]
|
;[formData.periodBeginTime, formData.periodEndTime] = datePickerRef.value.getYearOnYear(
|
||||||
formData.searchEndTime = datePickerRef.value.timeValue[1]
|
formData.searchBeginTime,
|
||||||
if (searchType.value == '1') {
|
formData.searchEndTime
|
||||||
;[formData.periodBeginTime, formData.periodEndTime] = datePickerRef.value.getYearOnYear(
|
)
|
||||||
formData.searchBeginTime,
|
} else if (searchType.value == '2') {
|
||||||
formData.searchEndTime
|
;[formData.periodBeginTime, formData.periodEndTime] = datePickerRef.value.getMonthOnMonth(
|
||||||
)
|
formData.searchBeginTime,
|
||||||
} else if (searchType.value == '2') {
|
formData.searchEndTime
|
||||||
;[formData.periodBeginTime, formData.periodEndTime] = datePickerRef.value.getMonthOnMonth(
|
)
|
||||||
formData.searchBeginTime,
|
} else {
|
||||||
formData.searchEndTime
|
formData.periodBeginTime = ''
|
||||||
)
|
formData.periodEndTime = ''
|
||||||
} else {
|
}
|
||||||
formData.periodBeginTime = ''
|
Promise.all([getComFlagInfoData(formData), getRunInfoData(formData)])
|
||||||
formData.periodEndTime = ''
|
.then((res: any) => {
|
||||||
}
|
handlerOptions1(res[0].data)
|
||||||
Promise.all([getComFlagInfoData(formData), getRunInfoData(formData)])
|
handlerOptions2(res[1].data)
|
||||||
.then((res: any) => {
|
loading.value = false
|
||||||
handlerOptions1(res[0].data)
|
})
|
||||||
handlerOptions2(res[1].data)
|
.catch(() => {
|
||||||
loading.value = false
|
loading.value = false
|
||||||
})
|
})
|
||||||
.catch(() => {
|
}
|
||||||
loading.value = false
|
const handlerOptions1 = (data: any) => {
|
||||||
})
|
options1.value = {
|
||||||
}
|
title: {
|
||||||
const handlerOptions1 = (data: any) => {
|
text: '运行状态'
|
||||||
options1.value = {
|
},
|
||||||
title: {
|
legend: {
|
||||||
text: '运行状态'
|
show: false
|
||||||
},
|
},
|
||||||
legend: {
|
tooltip: {
|
||||||
show: false
|
formatter: function (params: any) {
|
||||||
},
|
var res = params[0].data[0] + '<br/>终端运行状态为：'
|
||||||
tooltip: {
|
var texts = ''
|
||||||
formatter: function (params: any) {
|
if (params[0].data[1] === 2 || params[0].data[1] === '2') {
|
||||||
var res = params[0].data[0] + '<br/>终端运行状态为：'
|
texts = '退出'
|
||||||
var texts = ''
|
} else if (params[0].data[1] === 0 || params[0].data[1] === '0') {
|
||||||
if (params[0].data[1] === 2 || params[0].data[1] === '2') {
|
texts = '中断'
|
||||||
texts = '退出'
|
} else if (params[0].data[1] === 1 || params[0].data[1] === '1') {
|
||||||
} else if (params[0].data[1] === 0 || params[0].data[1] === '0') {
|
texts = '正常'
|
||||||
texts = '中断'
|
}
|
||||||
} else if (params[0].data[1] === 1 || params[0].data[1] === '1') {
|
res = res + texts
|
||||||
texts = '正常'
|
return res
|
||||||
}
|
}
|
||||||
res = res + texts
|
},
|
||||||
return res
|
xAxis: {
|
||||||
}
|
// type: 'category',
|
||||||
},
|
// data: data.updateTime
|
||||||
xAxis: {
|
type: 'time',
|
||||||
// type: 'category',
|
name: '时间',
|
||||||
// data: data.updateTime
|
//
|
||||||
type: 'time',
|
axisLabel: {
|
||||||
name: '时间',
|
formatter: {
|
||||||
//
|
day: '{MM}-{dd}',
|
||||||
axisLabel: {
|
month: '{MM}',
|
||||||
formatter: {
|
year: '{yyyy}'
|
||||||
day: '{MM}-{dd}',
|
}
|
||||||
month: '{MM}',
|
}
|
||||||
year: '{yyyy}'
|
},
|
||||||
}
|
yAxis: {
|
||||||
}
|
name: '状态',
|
||||||
},
|
type: 'value',
|
||||||
yAxis: {
|
axisLabel: {
|
||||||
name: '状态',
|
// 这里重新定义就可以
|
||||||
type: 'value',
|
formatter: function (value: number) {
|
||||||
axisLabel: {
|
var texts = []
|
||||||
// 这里重新定义就可以
|
if (value === 2) {
|
||||||
formatter: function (value: number) {
|
texts.push('退出')
|
||||||
var texts = []
|
} else if (value === 0) {
|
||||||
if (value === 2) {
|
texts.push('中断')
|
||||||
texts.push('退出')
|
} else if (value === 1) {
|
||||||
} else if (value === 0) {
|
texts.push('正常')
|
||||||
texts.push('中断')
|
}
|
||||||
} else if (value === 1) {
|
return texts
|
||||||
texts.push('正常')
|
}
|
||||||
}
|
}
|
||||||
return texts
|
},
|
||||||
}
|
series: [
|
||||||
}
|
{
|
||||||
},
|
name: '中断运行状态',
|
||||||
series: [
|
data: data.type.map((item: any, index: number) => [data.updateTime[index], item]),
|
||||||
{
|
type: 'line',
|
||||||
name: '中断运行状态',
|
step: 'end'
|
||||||
data: data.type.map((item: any, index: number) => [data.updateTime[index], item]),
|
}
|
||||||
type: 'line',
|
]
|
||||||
step: 'end'
|
}
|
||||||
}
|
}
|
||||||
]
|
const handlerOptions2 = (data: any) => {
|
||||||
}
|
let title = ''
|
||||||
}
|
if (data.integrityData.some((item: any) => item > 100)) {
|
||||||
const handlerOptions2 = (data: any) => {
|
title = '数据存在异常，已进行转换处理'
|
||||||
options2.value = {
|
data.integrityData = data.integrityData.map(item => {
|
||||||
title: {
|
return item > 100 ? 100 : item;
|
||||||
text: '在线率和完整性'
|
});
|
||||||
},
|
}
|
||||||
xAxis: {
|
|
||||||
type: 'category',
|
options2.value = {
|
||||||
data: formData.periodBeginTime
|
title: {
|
||||||
? [
|
text: '在线率和完整性',
|
||||||
`${formData.searchBeginTime} 至 ${formData.searchEndTime}`,
|
subtext: title,
|
||||||
`${formData.periodBeginTime} 至 ${formData.periodEndTime}`
|
subtextStyle: {
|
||||||
]
|
color: 'red' // 设置副标题颜色为红色
|
||||||
: [`${formData.searchBeginTime} 至 ${formData.searchEndTime}`]
|
}
|
||||||
},
|
},
|
||||||
yAxis: {
|
xAxis: {
|
||||||
name: '%',
|
type: 'category',
|
||||||
type: 'value'
|
data: formData.periodBeginTime
|
||||||
},
|
? [
|
||||||
series: [
|
`${formData.searchBeginTime} 至 ${formData.searchEndTime}`,
|
||||||
{
|
`${formData.periodBeginTime} 至 ${formData.periodEndTime}`
|
||||||
name: '在线率',
|
]
|
||||||
data: data.onlineRateData,
|
: [`${formData.searchBeginTime} 至 ${formData.searchEndTime}`]
|
||||||
type: 'bar'
|
},
|
||||||
},
|
yAxis: {
|
||||||
{
|
name: '%',
|
||||||
name: '完整性',
|
type: 'value'
|
||||||
data: data.integrityData,
|
},
|
||||||
type: 'bar'
|
series: [
|
||||||
}
|
{
|
||||||
]
|
name: '在线率',
|
||||||
}
|
data: data.onlineRateData,
|
||||||
}
|
type: 'bar'
|
||||||
provide('tableStore', tableStore)
|
},
|
||||||
</script>
|
{
|
||||||
<style></style>
|
name: '完整性',
|
||||||
|
data: data.integrityData,
|
||||||
|
type: 'bar'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
provide('tableStore', tableStore)
|
||||||
|
</script>
|
||||||
|
<style></style>
|
||||||
|
|||||||
@@ -1,267 +1,267 @@
|
|||||||
<template>
|
<template>
|
||||||
<SecondSheet>
|
<SecondSheet>
|
||||||
<div style='height: 100%; overflow: hidden'>
|
<div style='height: 100%; overflow: hidden' >
|
||||||
<div class='switch-tab'>
|
<div class='switch-tab'>
|
||||||
<el-radio-group v-model='radio' size='small'>
|
<el-radio-group v-model='radio' >
|
||||||
<el-radio-button value='三维图'>三维图</el-radio-button>
|
<el-radio-button value='三维图'>三维图</el-radio-button>
|
||||||
<el-radio-button value='表格'>表格</el-radio-button>
|
<el-radio-button value='表格'>表格</el-radio-button>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</div>
|
</div>
|
||||||
<Table ref='tableRef' height='auto' isGroup />
|
<Table ref='tableRef' isGroup />
|
||||||
<SecondSheet v-if="radio === '三维图'">
|
<SecondSheet v-if="radio === '三维图'">
|
||||||
<MyEchart :options='options' v-if='options'></MyEchart>
|
<MyEchart :options='options' v-if='options'></MyEchart>
|
||||||
</SecondSheet>
|
</SecondSheet>
|
||||||
</div>
|
</div>
|
||||||
</SecondSheet>
|
</SecondSheet>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang='ts' setup>
|
<script lang='ts' setup>
|
||||||
import { ref, provide } from 'vue'
|
import { ref, provide } from 'vue'
|
||||||
import SecondSheet from '@/components/secondSheet/index.vue'
|
import SecondSheet from '@/components/secondSheet/index.vue'
|
||||||
import Table from '@/components/table/index.vue'
|
import Table from '@/components/table/index.vue'
|
||||||
import TableStore from '@/utils/tableStore'
|
import TableStore from '@/utils/tableStore'
|
||||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||||
|
|
||||||
const radio = ref('三维图')
|
const radio = ref('三维图')
|
||||||
const options = ref()
|
const options = ref()
|
||||||
const apiData = ref()
|
const apiData = ref()
|
||||||
const tableStore3D = new TableStore({
|
const tableStore3D = new TableStore({
|
||||||
showPage: false,
|
showPage: false,
|
||||||
// 若页面表格高度需要调整，请修改publicHeight(内容区域除表格外其他内容的高度)
|
// 若页面表格高度需要调整，请修改publicHeight(内容区域除表格外其他内容的高度)
|
||||||
url: '/advance-boot/sgEvent/3DList',
|
url: '/advance-boot/sgEvent/3DList',
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
column: [
|
column: [
|
||||||
{
|
{
|
||||||
title: '电压暂降频次统计表',
|
title: '电压暂降频次统计表',
|
||||||
children: [
|
children: [
|
||||||
{ title: '暂降幅值(p.u.)', field: 'amplitude', width: '130' },
|
{ title: '暂降幅值(p.u.)', field: 'amplitude', width: '130' },
|
||||||
{
|
{
|
||||||
title: '持续时间(s)',
|
title: '持续时间(s)',
|
||||||
field: 'loginName',
|
field: 'loginName',
|
||||||
children: []
|
children: []
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
loadCallback: () => {
|
loadCallback: () => {
|
||||||
const eventCount = tableStore3D.table.data.values
|
const eventCount = tableStore3D.table.data.values
|
||||||
tableStore3D.table.data = {
|
tableStore3D.table.data = {
|
||||||
amplitudes: ['0.8~0.9', '0.7~0.8', '0.6~0.7', '0.5~0.6', '0.4~0.5', '0.1~0.4'],
|
amplitudes: ['0.8~0.9', '0.7~0.8', '0.6~0.7', '0.5~0.6', '0.4~0.5', '0.1~0.4'],
|
||||||
durations: ['0.01~0.02', '0.02~0.05', '0.05~0.07', '0.07~0.10', '0.10~1.00'],
|
durations: ['0.01~0.02', '0.02~0.05', '0.05~0.07', '0.07~0.10', '0.10~1.00'],
|
||||||
values: [
|
values: [
|
||||||
['0.8~0.9', '0.01~0.02', eventCount[0][2]],
|
['0.8~0.9', '0.01~0.02', eventCount[0][2]],
|
||||||
['0.8~0.9', '0.02~0.05', eventCount[1][2]],
|
['0.8~0.9', '0.02~0.05', eventCount[1][2]],
|
||||||
['0.8~0.9', '0.05~0.07', eventCount[2][2]],
|
['0.8~0.9', '0.05~0.07', eventCount[2][2]],
|
||||||
['0.8~0.9', '0.07~0.10', eventCount[3][2]],
|
['0.8~0.9', '0.07~0.10', eventCount[3][2]],
|
||||||
['0.8~0.9', '0.10~1.00', eventCount[4][2]],
|
['0.8~0.9', '0.10~1.00', eventCount[4][2]],
|
||||||
['0.7~0.8', '0.01~0.02', eventCount[5][2]],
|
['0.7~0.8', '0.01~0.02', eventCount[5][2]],
|
||||||
['0.7~0.8', '0.02~0.05', eventCount[6][2]],
|
['0.7~0.8', '0.02~0.05', eventCount[6][2]],
|
||||||
['0.7~0.8', '0.05~0.07', eventCount[7][2]],
|
['0.7~0.8', '0.05~0.07', eventCount[7][2]],
|
||||||
['0.7~0.8', '0.07~0.10', eventCount[8][2]],
|
['0.7~0.8', '0.07~0.10', eventCount[8][2]],
|
||||||
['0.7~0.8', '0.10~1.00', eventCount[9][2]],
|
['0.7~0.8', '0.10~1.00', eventCount[9][2]],
|
||||||
['0.6~0.7', '0.01~0.02', eventCount[10][2]],
|
['0.6~0.7', '0.01~0.02', eventCount[10][2]],
|
||||||
['0.6~0.7', '0.02~0.05', eventCount[11][2]],
|
['0.6~0.7', '0.02~0.05', eventCount[11][2]],
|
||||||
['0.6~0.7', '0.05~0.07', eventCount[12][2]],
|
['0.6~0.7', '0.05~0.07', eventCount[12][2]],
|
||||||
['0.6~0.7', '0.07~0.10', eventCount[13][2]],
|
['0.6~0.7', '0.07~0.10', eventCount[13][2]],
|
||||||
['0.6~0.7', '0.10~1.00', eventCount[14][2]],
|
['0.6~0.7', '0.10~1.00', eventCount[14][2]],
|
||||||
['0.5~0.6', '0.01~0.02', eventCount[15][2]],
|
['0.5~0.6', '0.01~0.02', eventCount[15][2]],
|
||||||
['0.5~0.6', '0.02~0.05', eventCount[16][2]],
|
['0.5~0.6', '0.02~0.05', eventCount[16][2]],
|
||||||
['0.5~0.6', '0.05~0.07', eventCount[17][2]],
|
['0.5~0.6', '0.05~0.07', eventCount[17][2]],
|
||||||
['0.5~0.6', '0.07~0.10', eventCount[18][2]],
|
['0.5~0.6', '0.07~0.10', eventCount[18][2]],
|
||||||
['0.5~0.6', '0.10~1.00', eventCount[19][2]],
|
['0.5~0.6', '0.10~1.00', eventCount[19][2]],
|
||||||
['0.4~0.5', '0.01~0.02', eventCount[20][2]],
|
['0.4~0.5', '0.01~0.02', eventCount[20][2]],
|
||||||
['0.4~0.5', '0.02~0.05', eventCount[21][2]],
|
['0.4~0.5', '0.02~0.05', eventCount[21][2]],
|
||||||
['0.4~0.5', '0.05~0.07', eventCount[22][2]],
|
['0.4~0.5', '0.05~0.07', eventCount[22][2]],
|
||||||
['0.4~0.5', '0.07~0.10', eventCount[23][2]],
|
['0.4~0.5', '0.07~0.10', eventCount[23][2]],
|
||||||
['0.4~0.5', '0.10~1.00', eventCount[24][2]],
|
['0.4~0.5', '0.10~1.00', eventCount[24][2]],
|
||||||
['0.1~0.4', '0.01~0.02', eventCount[25][2]],
|
['0.1~0.4', '0.01~0.02', eventCount[25][2]],
|
||||||
['0.1~0.4', '0.02~0.05', eventCount[26][2]],
|
['0.1~0.4', '0.02~0.05', eventCount[26][2]],
|
||||||
['0.1~0.4', '0.05~0.07', eventCount[27][2]],
|
['0.1~0.4', '0.05~0.07', eventCount[27][2]],
|
||||||
['0.1~0.4', '0.07~0.10', eventCount[28][2]],
|
['0.1~0.4', '0.07~0.10', eventCount[28][2]],
|
||||||
['0.1~0.4', '0.10~1.00', eventCount[29][2]]
|
['0.1~0.4', '0.10~1.00', eventCount[29][2]]
|
||||||
],
|
],
|
||||||
table: {
|
table: {
|
||||||
total: 6,
|
total: 6,
|
||||||
rows: [
|
rows: [
|
||||||
{
|
{
|
||||||
amplitude: '0.8~0.9',
|
amplitude: '0.8~0.9',
|
||||||
d001_002s: eventCount[0][2],
|
d001_002s: eventCount[0][2],
|
||||||
d002_005s: eventCount[1][2],
|
d002_005s: eventCount[1][2],
|
||||||
d005_007s: eventCount[2][2],
|
d005_007s: eventCount[2][2],
|
||||||
d007_010s: eventCount[3][2],
|
d007_010s: eventCount[3][2],
|
||||||
d010_100s: eventCount[4][2]
|
d010_100s: eventCount[4][2]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
amplitude: '0.7~0.8',
|
amplitude: '0.7~0.8',
|
||||||
d001_002s: eventCount[5][2],
|
d001_002s: eventCount[5][2],
|
||||||
d002_005s: eventCount[6][2],
|
d002_005s: eventCount[6][2],
|
||||||
d005_007s: eventCount[7][2],
|
d005_007s: eventCount[7][2],
|
||||||
d007_010s: eventCount[8][2],
|
d007_010s: eventCount[8][2],
|
||||||
d010_100s: eventCount[9][2]
|
d010_100s: eventCount[9][2]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
amplitude: '0.6~0.7',
|
amplitude: '0.6~0.7',
|
||||||
d001_002s: eventCount[10][2],
|
d001_002s: eventCount[10][2],
|
||||||
d002_005s: eventCount[11][2],
|
d002_005s: eventCount[11][2],
|
||||||
d005_007s: eventCount[12][2],
|
d005_007s: eventCount[12][2],
|
||||||
d007_010s: eventCount[13][2],
|
d007_010s: eventCount[13][2],
|
||||||
d010_100s: eventCount[14][2]
|
d010_100s: eventCount[14][2]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
amplitude: '0.5~0.6',
|
amplitude: '0.5~0.6',
|
||||||
d001_002s: eventCount[15][2],
|
d001_002s: eventCount[15][2],
|
||||||
d002_005s: eventCount[16][2],
|
d002_005s: eventCount[16][2],
|
||||||
d005_007s: eventCount[17][2],
|
d005_007s: eventCount[17][2],
|
||||||
d007_010s: eventCount[18][2],
|
d007_010s: eventCount[18][2],
|
||||||
d010_100s: eventCount[19][2]
|
d010_100s: eventCount[19][2]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
amplitude: '0.4~0.5',
|
amplitude: '0.4~0.5',
|
||||||
d001_002s: eventCount[20][2],
|
d001_002s: eventCount[20][2],
|
||||||
d002_005s: eventCount[21][2],
|
d002_005s: eventCount[21][2],
|
||||||
d005_007s: eventCount[22][2],
|
d005_007s: eventCount[22][2],
|
||||||
d007_010s: eventCount[23][2],
|
d007_010s: eventCount[23][2],
|
||||||
d010_100s: eventCount[24][2]
|
d010_100s: eventCount[24][2]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
amplitude: '0.1~0.4',
|
amplitude: '0.1~0.4',
|
||||||
d001_002s: eventCount[25][2],
|
d001_002s: eventCount[25][2],
|
||||||
d002_005s: eventCount[26][2],
|
d002_005s: eventCount[26][2],
|
||||||
d005_007s: eventCount[27][2],
|
d005_007s: eventCount[27][2],
|
||||||
d007_010s: eventCount[28][2],
|
d007_010s: eventCount[28][2],
|
||||||
d010_100s: eventCount[29][2]
|
d010_100s: eventCount[29][2]
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
code: 200,
|
code: 200,
|
||||||
msg: '查询成功'
|
msg: '查询成功'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
apiData.value = tableStore3D.table.data
|
apiData.value = tableStore3D.table.data
|
||||||
tableStore3D.table.column![0].children![1].children = []
|
tableStore3D.table.column![0].children![1].children = []
|
||||||
tableStore3D.table.column![0].children![1].children!.push(
|
tableStore3D.table.column![0].children![1].children!.push(
|
||||||
...(apiData.value.durations.map((item: string) => {
|
...(apiData.value.durations.map((item: string) => {
|
||||||
return {
|
return {
|
||||||
title: item,
|
title: item,
|
||||||
field: `d${item.replaceAll('.', '').replaceAll('~', '_')}s`
|
field: `d${item.replaceAll('.', '').replaceAll('~', '_')}s`
|
||||||
}
|
}
|
||||||
}) as any[])
|
}) as any[])
|
||||||
)
|
)
|
||||||
tableStore3D.table.data = apiData.value.table.rows
|
tableStore3D.table.data = apiData.value.table.rows
|
||||||
initEchart()
|
initEchart()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
// 注入到子组件
|
// 注入到子组件
|
||||||
provide('tableStore3D', tableStore3D)
|
provide('tableStore3D', tableStore3D)
|
||||||
|
|
||||||
const initEchart = () => {
|
const initEchart = () => {
|
||||||
options.value = {
|
options.value = {
|
||||||
options: {
|
options: {
|
||||||
xAxis: null,
|
xAxis: null,
|
||||||
yAxis: null,
|
yAxis: null,
|
||||||
dataZoom: null,
|
dataZoom: null,
|
||||||
backgroundColor: '#fff',
|
backgroundColor: '#fff',
|
||||||
tooltip: {
|
tooltip: {
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
type: 'shadow',
|
type: 'shadow',
|
||||||
label: {
|
label: {
|
||||||
color: '#fff',
|
color: '#fff',
|
||||||
fontSize: 16
|
fontSize: 16
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
textStyle: {
|
textStyle: {
|
||||||
color: '#fff',
|
color: '#fff',
|
||||||
fontStyle: 'normal',
|
fontStyle: 'normal',
|
||||||
opacity: 0.35,
|
opacity: 0.35,
|
||||||
fontSize: 14
|
fontSize: 14
|
||||||
},
|
},
|
||||||
backgroundColor: 'rgba(0,0,0,0.55)',
|
backgroundColor: 'rgba(0,0,0,0.55)',
|
||||||
borderWidth: 0,
|
borderWidth: 0,
|
||||||
formatter: function (params: any) {
|
formatter: function (params: any) {
|
||||||
let tips = ''
|
let tips = ''
|
||||||
tips += '<font>暂降幅值(p.u.):' + apiData.value.amplitudes[params.value[0]] + '</font><br/>'
|
tips += '<font>暂降幅值(p.u.):' + apiData.value.amplitudes[params.value[0]] + '</font><br/>'
|
||||||
tips += '<font>持续时间(s):' + apiData.value.durations[params.value[1]] + '</font><br/>'
|
tips += '<font>持续时间(s):' + apiData.value.durations[params.value[1]] + '</font><br/>'
|
||||||
tips += '<font>事件次数::' + params.value[2] + '</font>'
|
tips += '<font>事件次数::' + params.value[2] + '</font>'
|
||||||
return tips
|
return tips
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
title: {
|
title: {
|
||||||
text: '暂降密度图',
|
text: '暂降密度图',
|
||||||
x: 'center'
|
x: 'center'
|
||||||
},
|
},
|
||||||
xAxis3D: {
|
xAxis3D: {
|
||||||
name: '暂降幅值(p.u.)',
|
name: '暂降幅值(p.u.)',
|
||||||
type: 'category',
|
type: 'category',
|
||||||
data: apiData.value.amplitudes
|
data: apiData.value.amplitudes
|
||||||
},
|
},
|
||||||
yAxis3D: {
|
yAxis3D: {
|
||||||
name: '持续时间(s)',
|
name: '持续时间(s)',
|
||||||
type: 'category',
|
type: 'category',
|
||||||
data: apiData.value.durations
|
data: apiData.value.durations
|
||||||
},
|
},
|
||||||
zAxis3D: {
|
zAxis3D: {
|
||||||
name: '次数',
|
name: '次数',
|
||||||
type: 'value'
|
type: 'value'
|
||||||
},
|
},
|
||||||
grid3D: {
|
grid3D: {
|
||||||
boxWidth: 200,
|
boxWidth: 200,
|
||||||
boxDepth: 80,
|
boxDepth: 80,
|
||||||
viewControl: {
|
viewControl: {
|
||||||
projection: 'perspective',
|
projection: 'perspective',
|
||||||
distance: 250
|
distance: 250
|
||||||
},
|
},
|
||||||
light: {
|
light: {
|
||||||
main: {
|
main: {
|
||||||
intensity: 1.2,
|
intensity: 1.2,
|
||||||
shadow: true
|
shadow: true
|
||||||
},
|
},
|
||||||
ambient: {
|
ambient: {
|
||||||
intensity: 0.3
|
intensity: 0.3
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
type: 'bar3D',
|
type: 'bar3D',
|
||||||
data: apiData.value.values.map((item: [string, string, string]) => {
|
data: apiData.value.values.map((item: [string, string, string]) => {
|
||||||
return [
|
return [
|
||||||
apiData.value.amplitudes.indexOf(item[0]),
|
apiData.value.amplitudes.indexOf(item[0]),
|
||||||
apiData.value.durations.indexOf(item[1]),
|
apiData.value.durations.indexOf(item[1]),
|
||||||
item[2]
|
item[2]
|
||||||
]
|
]
|
||||||
}),
|
}),
|
||||||
shading: 'lambert',
|
shading: 'lambert',
|
||||||
label: {
|
label: {
|
||||||
fontSize: 16,
|
fontSize: 16,
|
||||||
borderWidth: 1
|
borderWidth: 1
|
||||||
},
|
},
|
||||||
emphasis: {
|
emphasis: {
|
||||||
label: {
|
label: {
|
||||||
fontSize: 20,
|
fontSize: 20,
|
||||||
color: '#900'
|
color: '#900'
|
||||||
},
|
},
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
color: '#900'
|
color: '#900'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const search = (id: string, beginTime: string, endTime: string) => {
|
const search = (id: string, beginTime: string, endTime: string) => {
|
||||||
// 从父组件tableStore3D获取参数
|
// 从父组件tableStore3D获取参数
|
||||||
tableStore3D.table.params.searchBeginTime = beginTime
|
tableStore3D.table.params.searchBeginTime = beginTime
|
||||||
tableStore3D.table.params.searchEndTime = endTime
|
tableStore3D.table.params.searchEndTime = endTime
|
||||||
tableStore3D.table.params.userId = id
|
tableStore3D.table.params.userId = id
|
||||||
tableStore3D.index()
|
tableStore3D.index()
|
||||||
}
|
}
|
||||||
defineExpose({ search })
|
defineExpose({ search })
|
||||||
</script>
|
</script>
|
||||||
<style lang='scss'>
|
<style lang='scss'>
|
||||||
.switch-tab {
|
.switch-tab {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 16px;
|
right: 345px;
|
||||||
top: 4px;
|
top: -37px;
|
||||||
z-index: 11;
|
z-index: 11;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,343 +1,343 @@
|
|||||||
<template>
|
<template>
|
||||||
<SecondSheet>
|
<SecondSheet>
|
||||||
<div class='tolerance-curve'>
|
<div class='tolerance-curve'>
|
||||||
<el-form label-width='auto' :inline='true'>
|
<el-form label-width='auto' :inline='true'>
|
||||||
<el-form-item label='生产线'>
|
<el-form-item label='生产线'>
|
||||||
<el-select v-model='form.productLineId'>
|
<el-select v-model='form.productLineId'>
|
||||||
<el-option v-for='item in productLineOptions' :key='item.id' :label='item.name'
|
<el-option v-for='item in productLineOptions' :key='item.id' :label='item.name'
|
||||||
:value='item.id' />
|
:value='item.id' />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label='终端'>
|
<el-form-item label='终端'>
|
||||||
<el-select v-model='form.machineId' placeholder='暂无终端'>
|
<el-select v-model='form.machineId' placeholder='暂无终端'>
|
||||||
<el-option v-for='item in machineOptions' :key='item.id' :label='item.name' :value='item.id' />
|
<el-option v-for='item in machineOptions' :key='item.id' :label='item.name' :value='item.id' />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label='敏感元器件'>
|
<el-form-item label='敏感元器件'>
|
||||||
<el-select v-model='form.unitId' placeholder='暂无元器件' @change="changeUnit" clearable>
|
<el-select v-model='form.unitId' placeholder='暂无元器件' @change="changeUnit" clearable>
|
||||||
<el-option v-for='item in unitOptions' :key='item.id' :label='item.name' :value='item.id' />
|
<el-option v-for='item in unitOptions' :key='item.id' :label='item.name' :value='item.id' />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div style='display: flex; flex: 1'>
|
<div style='display: flex; flex: 1'>
|
||||||
<el-form label-width='auto' label-position='top'>
|
<el-form label-width='auto' label-position='top'>
|
||||||
<!-- <el-form-item label='耐受曲线'>-->
|
<!-- <el-form-item label='耐受曲线'>-->
|
||||||
<!-- <el-select v-model='form.name' placeholder='Select'>-->
|
<!-- <el-select v-model='form.name' placeholder='Select'>-->
|
||||||
<!-- <el-option-->
|
<!-- <el-option-->
|
||||||
<!-- v-for='item in selectOptions'-->
|
<!-- v-for='item in selectOptions'-->
|
||||||
<!-- :key='item.value'-->
|
<!-- :key='item.value'-->
|
||||||
<!-- :label='item.label'-->
|
<!-- :label='item.label'-->
|
||||||
<!-- :value='item.value'-->
|
<!-- :value='item.value'-->
|
||||||
<!-- />-->
|
<!-- />-->
|
||||||
<!-- </el-select>-->
|
<!-- </el-select>-->
|
||||||
<!-- </el-form-item>-->
|
<!-- </el-form-item>-->
|
||||||
<!-- <el-form-item label='耐受能力（膝点坐标）'>-->
|
<!-- <el-form-item label='耐受能力（膝点坐标）'>-->
|
||||||
<!-- <el-select v-model='form.name' placeholder='Select'>-->
|
<!-- <el-select v-model='form.name' placeholder='Select'>-->
|
||||||
<!-- <el-option-->
|
<!-- <el-option-->
|
||||||
<!-- v-for='item in selectOptions'-->
|
<!-- v-for='item in selectOptions'-->
|
||||||
<!-- :key='item.value'-->
|
<!-- :key='item.value'-->
|
||||||
<!-- :label='item.label'-->
|
<!-- :label='item.label'-->
|
||||||
<!-- :value='item.value'-->
|
<!-- :value='item.value'-->
|
||||||
<!-- />-->
|
<!-- />-->
|
||||||
<!-- </el-select>-->
|
<!-- </el-select>-->
|
||||||
<!-- </el-form-item>-->
|
<!-- </el-form-item>-->
|
||||||
<el-form-item label='上限曲线膝点'>
|
<el-form-item label='上限曲线膝点'>
|
||||||
<div>
|
<div>
|
||||||
<div>
|
<div>
|
||||||
<el-input-number v-model='unit.vtcAmpUpper' controls-position='right'
|
<el-input-number v-model='unit.vtcAmpUpper' controls-position='right'
|
||||||
@change='reDrawPic' />
|
@change='reDrawPic' />
|
||||||
<span class='ml10' style='color: #333'>p.u.</span>
|
<span class='ml10' style='color: #333'>p.u.</span>
|
||||||
</div>
|
</div>
|
||||||
<div class='mt10'>
|
<div class='mt10'>
|
||||||
<el-input-number v-model='unit.vtcTimeUpper' controls-position='right'
|
<el-input-number v-model='unit.vtcTimeUpper' controls-position='right'
|
||||||
@change='reDrawPic' />
|
@change='reDrawPic' />
|
||||||
<span class='ml10' style='color: #333'>ms</span>
|
<span class='ml10' style='color: #333'>ms</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label='下限曲线膝点'>
|
<el-form-item label='下限曲线膝点'>
|
||||||
<div>
|
<div>
|
||||||
<div>
|
<div>
|
||||||
<el-input-number v-model='unit.vtcAmpLower' controls-position='right'
|
<el-input-number v-model='unit.vtcAmpLower' controls-position='right'
|
||||||
@change='reDrawPic' />
|
@change='reDrawPic' />
|
||||||
<span class='ml10' style='color: #333'>p.u.</span>
|
<span class='ml10' style='color: #333'>p.u.</span>
|
||||||
</div>
|
</div>
|
||||||
<div class='mt10'>
|
<div class='mt10'>
|
||||||
<el-input-number v-model='unit.vtcTimeLower' controls-position='right'
|
<el-input-number v-model='unit.vtcTimeLower' controls-position='right'
|
||||||
@change='reDrawPic' />
|
@change='reDrawPic' />
|
||||||
<span class='ml10' style='color: #333'>ms</span>
|
<span class='ml10' style='color: #333'>ms</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div style='flex: 1' class='ml10'>
|
<div style='flex: 1' class='ml10'>
|
||||||
<MyEchart :options='options' v-if='options'></MyEchart>
|
<MyEchart :options='options' v-if='options'></MyEchart>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</SecondSheet>
|
</SecondSheet>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang='ts' setup>
|
<script lang='ts' setup>
|
||||||
import SecondSheet from '@/components/secondSheet/index.vue'
|
import SecondSheet from '@/components/secondSheet/index.vue'
|
||||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||||
import { reactive, ref } from 'vue'
|
import { reactive, ref } from 'vue'
|
||||||
import { querySgProductLineByUserId } from '@/api/advance-boot/sgGroven/sgProductLine'
|
import { querySgProductLineByUserId } from '@/api/advance-boot/sgGroven/sgProductLine'
|
||||||
import { ElMessage } from 'element-plus'
|
import { ElMessage } from 'element-plus'
|
||||||
import { querySgMachineByProductLineId } from '@/api/advance-boot/sgGroven/sgMachine'
|
import { querySgMachineByProductLineId } from '@/api/advance-boot/sgGroven/sgMachine'
|
||||||
import { queryUnitByMachineId } from '@/api/advance-boot/sgGroven/sgSensitiveUnit'
|
import { queryUnitByMachineId } from '@/api/advance-boot/sgGroven/sgSensitiveUnit'
|
||||||
import { getEventDataByProductLineId } from '@/api/advance-boot/sgGroven/sgEvent'
|
import { getEventDataByProductLineId } from '@/api/advance-boot/sgGroven/sgEvent'
|
||||||
|
|
||||||
|
|
||||||
const searchBeginTime = ref()
|
const searchBeginTime = ref()
|
||||||
const searchEndTime = ref()
|
const searchEndTime = ref()
|
||||||
const userId = ref()
|
const userId = ref()
|
||||||
|
|
||||||
const form = reactive({
|
const form = reactive({
|
||||||
num: 1,
|
num: 1,
|
||||||
productLineId: '',
|
productLineId: '',
|
||||||
machineId: '',
|
machineId: '',
|
||||||
unitId: ''
|
unitId: ''
|
||||||
})
|
})
|
||||||
const productLineOptions = ref()
|
const productLineOptions = ref()
|
||||||
const machineOptions = ref()
|
const machineOptions = ref()
|
||||||
const unitOptions = ref()
|
const unitOptions = ref()
|
||||||
const unit = ref({
|
const unit = ref({
|
||||||
'vtcTimeUpper': 0,
|
'vtcTimeUpper': 0,
|
||||||
'vtcAmpUpper': 0,
|
'vtcAmpUpper': 0,
|
||||||
'vtcTimeLower': 0,
|
'vtcTimeLower': 0,
|
||||||
'vtcAmpLower': 0
|
'vtcAmpLower': 0
|
||||||
})
|
})
|
||||||
const overEvent = ref([])
|
const overEvent = ref([])
|
||||||
const unOverEvent = ref([])
|
const unOverEvent = ref([])
|
||||||
const unKnownEvent = ref([])
|
const unKnownEvent = ref([])
|
||||||
const overEventColor = ref('#A52a2a')
|
const overEventColor = ref('#A52a2a')
|
||||||
const unOverEventColor = ref('#61a0a8')
|
const unOverEventColor = ref('#61a0a8')
|
||||||
const unKnownEventColor = ref('#d48265')
|
const unKnownEventColor = ref('#d48265')
|
||||||
const eventData = ref()
|
const eventData = ref()
|
||||||
const search = async (id: string, beginTime: string, endTime: string) => {
|
const search = async (id: string, beginTime: string, endTime: string) => {
|
||||||
// 从父组件tableStore获取参数
|
// 从父组件tableStore获取参数
|
||||||
searchBeginTime.value = beginTime
|
searchBeginTime.value = beginTime
|
||||||
searchEndTime.value = endTime
|
searchEndTime.value = endTime
|
||||||
userId.value = id
|
userId.value = id
|
||||||
//根据用户id获取到生产线下拉框、再根据生产线下拉框获取生产线下的终端下拉，再根据终端获取下拉的敏感元器件的下拉
|
//根据用户id获取到生产线下拉框、再根据生产线下拉框获取生产线下的终端下拉，再根据终端获取下拉的敏感元器件的下拉
|
||||||
await querySgProductLineByUserId(id).then((res: any) => {
|
await querySgProductLineByUserId(id).then((res: any) => {
|
||||||
productLineOptions.value = res.data
|
productLineOptions.value = res.data
|
||||||
form.productLineId = productLineOptions.value[0].id
|
form.productLineId = productLineOptions.value[0].id
|
||||||
})
|
})
|
||||||
|
|
||||||
//根据生产线获取终端数据
|
//根据生产线获取终端数据
|
||||||
await querySgMachineByProductLineId(form.productLineId).then((res: any) => {
|
await querySgMachineByProductLineId(form.productLineId).then((res: any) => {
|
||||||
machineOptions.value = res.data
|
machineOptions.value = res.data
|
||||||
if (machineOptions.value.length > 0) {
|
if (machineOptions.value.length > 0) {
|
||||||
form.machineId = machineOptions.value[0].id
|
form.machineId = machineOptions.value[0].id
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
//根据终端获取元器件数据
|
//根据终端获取元器件数据
|
||||||
await queryUnitByMachineId(form.machineId).then((res: any) => {
|
await queryUnitByMachineId(form.machineId).then((res: any) => {
|
||||||
unitOptions.value = res.data
|
unitOptions.value = res.data
|
||||||
if (unitOptions.value.length > 0) {
|
if (unitOptions.value.length > 0) {
|
||||||
form.unitId = unitOptions.value[0].id
|
form.unitId = unitOptions.value[0].id
|
||||||
unit.value = JSON.parse(JSON.stringify(unitOptions.value[0]))
|
unit.value = JSON.parse(JSON.stringify(unitOptions.value[0]))
|
||||||
}
|
}
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
const data = {
|
const data = {
|
||||||
searchBeginTime: beginTime,
|
searchBeginTime: beginTime,
|
||||||
searchEndTime: endTime,
|
searchEndTime: endTime,
|
||||||
productId: form.productLineId
|
productId: form.productLineId
|
||||||
}
|
}
|
||||||
|
|
||||||
await getEventDataByProductLineId(data).then((res: any) => {
|
await getEventDataByProductLineId(data).then((res: any) => {
|
||||||
eventData.value = res.data
|
eventData.value = res.data
|
||||||
reDrawPic()
|
reDrawPic()
|
||||||
})
|
})
|
||||||
|
|
||||||
}
|
}
|
||||||
const changeUnit = (id: any) => {
|
const changeUnit = (id: any) => {
|
||||||
if (id == undefined) return
|
if (id == undefined) return
|
||||||
let list = unitOptions.value.filter((item: any) => item.id == id)
|
let list = unitOptions.value.filter((item: any) => item.id == id)
|
||||||
unit.value = JSON.parse(JSON.stringify(list[0]))
|
unit.value = JSON.parse(JSON.stringify(list[0]))
|
||||||
reDrawPic()
|
reDrawPic()
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const options = ref()
|
const options = ref()
|
||||||
const initOptions = () => {
|
const initOptions = () => {
|
||||||
options.value = {
|
options.value = {
|
||||||
legend: {
|
legend: {
|
||||||
data: ['越限事件', '未越限事件', '不确定事件'],
|
data: ['越限事件', '未越限事件', '不确定事件'],
|
||||||
left: '10px'
|
|
||||||
},
|
},
|
||||||
tooltip: {
|
tooltip: {
|
||||||
formatter: function (a: any) {
|
formatter: function (a: any) {
|
||||||
if (a[0].value[3] == undefined) {
|
if (a[0].value[3] == undefined) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
let relVal = ''
|
let relVal = ''
|
||||||
relVal += '<font style=\'color:' + '\'>进线:' + ' ' + ' ' + a[0].value[3] + '</font><br/>'
|
relVal += '<font style=\'color:' + '\'>进线:' + ' ' + ' ' + a[0].value[3] + '</font><br/>'
|
||||||
relVal += '<font style=\'color:' + '\'>发生时刻:' + ' ' + ' ' + a[0].value[2] + '</font><br/>'
|
relVal += '<font style=\'color:' + '\'>发生时刻:' + ' ' + ' ' + a[0].value[2] + '</font><br/>'
|
||||||
relVal += '<font style=\'color:' + '\'>持续时间:' + ' ' + ' ' + a[0].value[0].toFixed(2) + 's</font><br/>'
|
relVal += '<font style=\'color:' + '\'>持续时间:' + ' ' + ' ' + a[0].value[0].toFixed(2) + 's</font><br/>'
|
||||||
relVal += '<font style=\'color:' + '\'>特征幅值:' + ' ' + ' ' + a[0].value[1] + 'p.u.</font>'
|
relVal += '<font style=\'color:' + '\'>特征幅值:' + ' ' + ' ' + a[0].value[1] + 'p.u.</font>'
|
||||||
return relVal
|
return relVal
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
name: '持续时间/s',
|
name: '持续时间/s',
|
||||||
type: 'log',
|
type: 'log',
|
||||||
min: '0.001',
|
min: '0.001',
|
||||||
max: '1000',
|
max: '1000',
|
||||||
splitLine: { show: false }
|
splitLine: { show: false }
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
name: '幅值/p.u.',
|
name: '幅值/p.u.',
|
||||||
max: 1,
|
max: 1,
|
||||||
min: 0,
|
min: 0,
|
||||||
splitLine: { show: false }
|
splitLine: { show: false }
|
||||||
},
|
},
|
||||||
grid: {
|
grid: {
|
||||||
right: '78px',
|
right: '78px',
|
||||||
},
|
},
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
type: 'line',
|
type: 'line',
|
||||||
color: '#ff0000',
|
color: '#ff0000',
|
||||||
data: [
|
data: [
|
||||||
[unit.value.vtcTimeUpper / 1000, 0],
|
[unit.value.vtcTimeUpper / 1000, 0],
|
||||||
[unit.value.vtcTimeUpper / 1000, unit.value.vtcAmpUpper],
|
[unit.value.vtcTimeUpper / 1000, unit.value.vtcAmpUpper],
|
||||||
[1000, unit.value.vtcAmpUpper]
|
[1000, unit.value.vtcAmpUpper]
|
||||||
],
|
],
|
||||||
showSymbol: false,
|
showSymbol: false,
|
||||||
tooltips: {
|
tooltips: {
|
||||||
show: false
|
show: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'line',
|
type: 'line',
|
||||||
color: '#ff0000',
|
color: '#ff0000',
|
||||||
data: [
|
data: [
|
||||||
[unit.value.vtcTimeLower / 1000, 0],
|
[unit.value.vtcTimeLower / 1000, 0],
|
||||||
[unit.value.vtcTimeLower / 1000, unit.value.vtcAmpLower],
|
[unit.value.vtcTimeLower / 1000, unit.value.vtcAmpLower],
|
||||||
[1000, unit.value.vtcAmpLower]
|
[1000, unit.value.vtcAmpLower]
|
||||||
],
|
],
|
||||||
showSymbol: false,
|
showSymbol: false,
|
||||||
tooltips: {
|
tooltips: {
|
||||||
show: false
|
show: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '越限事件',
|
name: '越限事件',
|
||||||
type: 'scatter',
|
type: 'scatter',
|
||||||
symbol: 'circle',
|
symbol: 'circle',
|
||||||
data: overEvent.value
|
data: overEvent.value
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '未越限事件',
|
name: '未越限事件',
|
||||||
type: 'scatter',
|
type: 'scatter',
|
||||||
symbol: 'circle',
|
symbol: 'circle',
|
||||||
data: unOverEvent.value
|
data: unOverEvent.value
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '不确定事件',
|
name: '不确定事件',
|
||||||
type: 'scatter',
|
type: 'scatter',
|
||||||
symbol: 'circle',
|
symbol: 'circle',
|
||||||
data: unKnownEvent.value
|
data: unKnownEvent.value
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
options: {
|
options: {
|
||||||
dataZoom: null
|
dataZoom: null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const reDrawPic = () => {
|
const reDrawPic = () => {
|
||||||
//清洗要显示的数据
|
//清洗要显示的数据
|
||||||
if (eventData.value.length > 0) {
|
if (eventData.value.length > 0) {
|
||||||
unOverEvent.value = []
|
unOverEvent.value = []
|
||||||
overEvent.value = []
|
overEvent.value = []
|
||||||
unKnownEvent.value = []
|
unKnownEvent.value = []
|
||||||
for (let event of eventData.value) {
|
for (let event of eventData.value) {
|
||||||
//判断落在哪个区域内
|
//判断落在哪个区域内
|
||||||
let eventTime = Number(event.duration) / 1000
|
let eventTime = Number(event.duration) / 1000
|
||||||
let eventAmplitude = Number(event.featureAmplitude)
|
let eventAmplitude = Number(event.featureAmplitude)
|
||||||
if (eventTime < Number(unit.value.vtcTimeUpper / 1000) || eventAmplitude > Number(unit.value.vtcAmpUpper)) {
|
if (eventTime < Number(unit.value.vtcTimeUpper / 1000) || eventAmplitude > Number(unit.value.vtcAmpUpper)) {
|
||||||
//未越限
|
//未越限
|
||||||
const dataTemp = {
|
const dataTemp = {
|
||||||
value: [
|
value: [
|
||||||
eventTime,
|
eventTime,
|
||||||
eventAmplitude,
|
eventAmplitude,
|
||||||
event.startTime,
|
event.startTime,
|
||||||
event.incomingLineName
|
event.incomingLineName
|
||||||
],
|
],
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
normal: {
|
normal: {
|
||||||
color: unOverEventColor.value
|
color: unOverEventColor.value
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
unOverEvent.value.push(dataTemp)
|
unOverEvent.value.push(dataTemp)
|
||||||
} else if (eventTime > Number(unit.value.vtcTimeLower / 1000) && eventAmplitude < Number(unit.value.vtcAmpLower)) {
|
} else if (eventTime > Number(unit.value.vtcTimeLower / 1000) && eventAmplitude < Number(unit.value.vtcAmpLower)) {
|
||||||
//故障阶段
|
//故障阶段
|
||||||
const dataTemp = {
|
const dataTemp = {
|
||||||
value: [
|
value: [
|
||||||
eventTime,
|
eventTime,
|
||||||
eventAmplitude,
|
eventAmplitude,
|
||||||
event.startTime,
|
event.startTime,
|
||||||
event.incomingLineName
|
event.incomingLineName
|
||||||
],
|
],
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
normal: {
|
normal: {
|
||||||
color: overEventColor.value
|
color: overEventColor.value
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
overEvent.value.push(dataTemp)
|
overEvent.value.push(dataTemp)
|
||||||
} else {
|
} else {
|
||||||
//不确定事件
|
//不确定事件
|
||||||
const dataTemp = {
|
const dataTemp = {
|
||||||
value: [
|
value: [
|
||||||
eventTime,
|
eventTime,
|
||||||
eventAmplitude,
|
eventAmplitude,
|
||||||
event.startTime,
|
event.startTime,
|
||||||
event.incomingLineName
|
event.incomingLineName
|
||||||
],
|
],
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
normal: {
|
normal: {
|
||||||
color: unKnownEventColor.value
|
color: unKnownEventColor.value
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
unKnownEvent.value.push(dataTemp)
|
unKnownEvent.value.push(dataTemp)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
//初始化图表
|
//初始化图表
|
||||||
initOptions()
|
initOptions()
|
||||||
}
|
}
|
||||||
|
|
||||||
defineExpose({ search })
|
defineExpose({ search })
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang='scss' scoped>
|
<style lang='scss' scoped>
|
||||||
.tolerance-curve {
|
.tolerance-curve {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
border: 1px solid var(--el-border-color);
|
border: 1px solid var(--el-border-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-form-item__label-wrap {
|
.el-form-item__label-wrap {
|
||||||
margin-left: 0 !important;
|
margin-left: 0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-form-item__content {
|
.el-form-item__content {
|
||||||
width: 185px !important;
|
width: 185px !important;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,250 +1,252 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-dialog draggable class="cn-operate-dialog" v-model="dialogVisible" :title="title" style="max-width: 750px">
|
<el-dialog draggable class="cn-operate-dialog" v-model="dialogVisible" :title="title" style="max-width: 750px">
|
||||||
<el-scrollbar>
|
<el-scrollbar>
|
||||||
<el-form :inline="false" :model="form" label-width="120px" :rules="rules" ref="formRef">
|
<el-form :inline="false" :model="form" label-width="120px" :rules="rules" ref="formRef">
|
||||||
<el-tabs tab-position="left" style="height: 100%" :before-leave="checkUserId" v-model="tab">
|
<el-tabs tab-position="left" style="height: 100%" :before-leave="checkUserId" v-model="tab">
|
||||||
<el-tab-pane label="基本信息" name="user">
|
<el-tab-pane label="基本信息" name="user">
|
||||||
<el-form-item label="用户名" prop="userName" >
|
<el-form-item label="用户名" prop="userName" >
|
||||||
<el-input v-model="form.userName" placeholder="请输入用户名" clearable />
|
<el-input v-model="form.userName" placeholder="请输入用户名" clearable />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item label="重点用户">
|
<el-form-item label="重点用户">
|
||||||
<el-select v-model="form.keyUser">
|
<el-select v-model="form.keyUser">
|
||||||
<el-option label="重要" value="1" />
|
<el-option label="重要" value="1" />
|
||||||
<el-option label="不重要" value="0" />
|
<el-option label="不重要" value="0" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item label="所属行业" prop="industry">
|
<el-form-item label="所属行业" prop="industry">
|
||||||
<el-input v-model="form.industry" placeholder="请输入所属行业" clearable />
|
<el-input v-model="form.industry" placeholder="请输入所属行业" clearable />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
<el-form-item label="所在地区" prop="addr">
|
<el-form-item label="所在地区" prop="addr">
|
||||||
<area-cascard v-model="form.addr" @change="reValueAddr" ref="areaRef" placeholder="请选择所在地区" clearable/>
|
<area-cascard v-model="form.addr" @change="reValueAddr" ref="areaRef" placeholder="请选择所在地区" clearable/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="详细地址">
|
<el-form-item label="详细地址">
|
||||||
<el-input v-model="form.addrDetail" placeholder="请输入详细地址" clearable/>
|
<el-input v-model="form.addrDetail" placeholder="请输入详细地址" clearable/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="联系方式">
|
<el-form-item label="联系方式">
|
||||||
<el-input v-model="form.concact" placeholder="请输入联系方式" clearable/>
|
<el-input v-model="form.concact" placeholder="请输入联系方式" clearable/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="用户描述">
|
<el-form-item label="用户描述">
|
||||||
<el-input v-model="form.remark" :rows="2" type="textarea" placeholder="请输入描述" clearable/>
|
<el-input v-model="form.remark" :rows="2" type="textarea" placeholder="请输入描述" clearable/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="企业照片">
|
<el-form-item label="企业照片">
|
||||||
<div>
|
<div>
|
||||||
<el-image
|
<el-image
|
||||||
style="width: 200px; height: 200px"
|
style="width: 200px; height: 200px"
|
||||||
:src="userLogo.url"
|
:src="userLogo.url"
|
||||||
:preview-src-list="[userLogo.url]"
|
:preview-src-list="[userLogo.url]"
|
||||||
v-if="userLogo.url"
|
v-if="userLogo.url"
|
||||||
></el-image>
|
></el-image>
|
||||||
<el-upload
|
<el-upload
|
||||||
action=""
|
action=""
|
||||||
:show-file-list="false"
|
:show-file-list="false"
|
||||||
:auto-upload="false"
|
:auto-upload="false"
|
||||||
accept=".png,.jpg"
|
accept=".png,.jpg"
|
||||||
:on-change="chooseImage"
|
:on-change="chooseImage"
|
||||||
>
|
>
|
||||||
<el-button type="primary">上传图片</el-button>
|
<el-button type="primary">上传图片</el-button>
|
||||||
</el-upload>
|
</el-upload>
|
||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
|
|
||||||
<el-tab-pane label="进线" name="incomingLine">
|
<el-tab-pane label="进线" name="incomingLine">
|
||||||
<IncomingTable ref="incomingTable"></IncomingTable>
|
<IncomingTable ref="incomingTable"></IncomingTable>
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
</el-form>
|
</el-form>
|
||||||
</el-scrollbar>
|
</el-scrollbar>
|
||||||
|
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<span class="dialog-footer">
|
<span class="dialog-footer">
|
||||||
<el-button @click="dialogVisible = false">取消</el-button>
|
<el-button @click="dialogVisible = false">取消</el-button>
|
||||||
<el-button type="primary" @click="submit">确认</el-button>
|
<el-button type="primary" @click="submit">确认</el-button>
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref, inject, reactive, nextTick } from 'vue'
|
import { ref, inject, reactive, nextTick } from 'vue'
|
||||||
import { ElMessage } from 'element-plus'
|
import { ElMessage } from 'element-plus'
|
||||||
import type { UploadProps, UploadUserFile } from 'element-plus'
|
import type { UploadProps, UploadUserFile } from 'element-plus'
|
||||||
import { Plus } from '@element-plus/icons-vue'
|
import { Plus } from '@element-plus/icons-vue'
|
||||||
import TableStore from '@/utils/tableStore' // 若不是列表页面弹框可删除
|
import TableStore from '@/utils/tableStore' // 若不是列表页面弹框可删除
|
||||||
import AreaCascard from '@/components/form/areaCascard/index.vue'
|
import AreaCascard from '@/components/form/areaCascard/index.vue'
|
||||||
import { uploadFile, deleteFile } from '@/api/system-boot/file'
|
import { uploadFile, deleteFile } from '@/api/system-boot/file'
|
||||||
import { addSgUser, updateSgUser } from '@/api/advance-boot/sgGroven/sgUser'
|
import { addSgUser, updateSgUser } from '@/api/advance-boot/sgGroven/sgUser'
|
||||||
import IncomingTable from './IncomingTable.vue'
|
import IncomingTable from './IncomingTable.vue'
|
||||||
import { fullUrl } from '@/utils/common'
|
import { getFileUrl } from '@/api/system-boot/file'
|
||||||
|
|
||||||
const dialogVisible = ref(false)
|
const dialogVisible = ref(false)
|
||||||
const title = ref('')
|
const title = ref('')
|
||||||
const tableStore = inject('tableStore') as TableStore
|
const tableStore = inject('tableStore') as TableStore
|
||||||
const areaRef = ref()
|
const areaRef = ref()
|
||||||
const formRef = ref()
|
const formRef = ref()
|
||||||
const tab = ref('user')
|
const tab = ref('user')
|
||||||
|
|
||||||
//进线表格子组件
|
//进线表格子组件
|
||||||
const incomingTable = ref()
|
const incomingTable = ref()
|
||||||
|
|
||||||
const userLogo = reactive({
|
const userLogo = reactive({
|
||||||
url: '',
|
url: '',
|
||||||
name: ''
|
name: ''
|
||||||
})
|
})
|
||||||
|
|
||||||
const dialogVisibleLogo = ref(false)
|
const dialogVisibleLogo = ref(false)
|
||||||
// 注意不要和表单ref的命名冲突
|
// 注意不要和表单ref的命名冲突
|
||||||
const form = reactive<anyObj>({
|
const form = reactive<anyObj>({
|
||||||
id: '',
|
id: '',
|
||||||
userName: '',
|
userName: '',
|
||||||
keyUser: '1',
|
keyUser: '1',
|
||||||
industry: '',
|
industry: '',
|
||||||
addr: [],
|
addr: [],
|
||||||
addrStrOption: '',
|
addrStrOption: '',
|
||||||
addrDetail: '',
|
addrDetail: '',
|
||||||
concact: '',
|
concact: '',
|
||||||
remark: '',
|
remark: '',
|
||||||
userLogo: ''
|
userLogo: ''
|
||||||
})
|
})
|
||||||
|
|
||||||
//form表单校验规则
|
//form表单校验规则
|
||||||
const rules = {
|
const rules = {
|
||||||
userName: [{ required: true, message: '用户名不能为空', trigger: 'blur' }],
|
userName: [{ required: true, message: '用户名不能为空', trigger: 'blur' }],
|
||||||
industry: [{ required: true, message: '所属行业不能为空', trigger: 'blur' }],
|
industry: [{ required: true, message: '所属行业不能为空', trigger: 'blur' }],
|
||||||
addr: [{ required: true, message: '所在地区不能为空', trigger: 'change' }]
|
addr: [{ required: true, message: '所在地区不能为空', trigger: 'change' }]
|
||||||
}
|
}
|
||||||
const resetForm = () => {
|
const resetForm = () => {
|
||||||
if (formRef.value) {
|
if (formRef.value) {
|
||||||
formRef.value.resetFields()
|
formRef.value.resetFields()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const open = (text: string, data?: anyObj) => {
|
const open = (text: string, data?: anyObj) => {
|
||||||
tab.value = 'user'
|
tab.value = 'user'
|
||||||
title.value = text
|
title.value = text
|
||||||
//默认选中第一个tab
|
//默认选中第一个tab
|
||||||
dialogVisible.value = true
|
dialogVisible.value = true
|
||||||
if (data) {
|
if (data) {
|
||||||
// 表单赋值
|
// 表单赋值
|
||||||
for (let key in form) {
|
for (let key in form) {
|
||||||
form[key] = data[key]
|
form[key] = data[key]
|
||||||
}
|
}
|
||||||
form.addr = data.addr.split('/')
|
form.addr = data.addr.split('/')
|
||||||
form.keyUser = String(data.keyUser)
|
form.keyUser = String(data.keyUser)
|
||||||
if (form.userLogo) {
|
if (form.userLogo) {
|
||||||
userLogo.url = fullUrl(form.userLogo)
|
getFileUrl({filePath:form.userLogo}).then(res=>{
|
||||||
// 图片的name我不知道
|
userLogo.url=res.data
|
||||||
}
|
})
|
||||||
//待子组件渲染完毕
|
// 图片的name我不知道
|
||||||
nextTick(() => {
|
}
|
||||||
incomingTable.value.getTableData(form.id)
|
//待子组件渲染完毕
|
||||||
})
|
nextTick(() => {
|
||||||
} else {
|
incomingTable.value.getTableData(form.id)
|
||||||
resetForm()
|
})
|
||||||
// 在此处恢复默认表单
|
} else {
|
||||||
for (let key in form) {
|
resetForm()
|
||||||
form[key] = ''
|
// 在此处恢复默认表单
|
||||||
}
|
for (let key in form) {
|
||||||
userLogo.url = ''
|
form[key] = ''
|
||||||
form.keyUser = '1'
|
}
|
||||||
}
|
userLogo.url = ''
|
||||||
}
|
form.keyUser = '1'
|
||||||
|
}
|
||||||
/**
|
}
|
||||||
* 将联级选择的区域数组转为字符串
|
|
||||||
*/
|
/**
|
||||||
const reValueAddr = () => {
|
* 将联级选择的区域数组转为字符串
|
||||||
form.addrStrOption = form.addr.join('/')
|
*/
|
||||||
}
|
const reValueAddr = () => {
|
||||||
|
form.addrStrOption = form.addr.join('/')
|
||||||
/**
|
}
|
||||||
* 选择图片上传
|
|
||||||
* @param e
|
/**
|
||||||
*/
|
* 选择图片上传
|
||||||
const chooseImage = (e: any) => {
|
* @param e
|
||||||
uploadFile(e.raw, 'sgGovern/').then(res => {
|
*/
|
||||||
userLogo.name = res.data.name
|
const chooseImage = (e: any) => {
|
||||||
userLogo.url = res.data.url
|
uploadFile(e.raw, 'sgGovern/').then(res => {
|
||||||
form.userLogo = res.data.name
|
userLogo.name = res.data.name
|
||||||
ElMessage.success('新增成功')
|
userLogo.url = res.data.url
|
||||||
})
|
form.userLogo = res.data.name
|
||||||
}
|
ElMessage.success('新增成功')
|
||||||
|
})
|
||||||
/**
|
}
|
||||||
* 删除文件操作,此操作应在提交表单的时候操作，删除的图片可能有多张
|
|
||||||
*/
|
/**
|
||||||
const handleRemove = (e: any, userLogo: any) => {
|
* 删除文件操作,此操作应在提交表单的时候操作，删除的图片可能有多张
|
||||||
form.userLogo = ''
|
*/
|
||||||
userLogo.value = []
|
const handleRemove = (e: any, userLogo: any) => {
|
||||||
deleteFile(e.name).then(res => {
|
form.userLogo = ''
|
||||||
ElMessage.success('删除成功')
|
userLogo.value = []
|
||||||
})
|
deleteFile(e.name).then(res => {
|
||||||
}
|
ElMessage.success('删除成功')
|
||||||
|
})
|
||||||
/**
|
}
|
||||||
* 预览图片
|
|
||||||
*/
|
/**
|
||||||
const handlePictureCardPreview = () => {
|
* 预览图片
|
||||||
dialogVisibleLogo.value = true
|
*/
|
||||||
}
|
const handlePictureCardPreview = () => {
|
||||||
|
dialogVisibleLogo.value = true
|
||||||
/**
|
}
|
||||||
* 提交用户表单数据
|
|
||||||
*/
|
/**
|
||||||
const submit = () => {
|
* 提交用户表单数据
|
||||||
formRef.value.validate(async (valid: any) => {
|
*/
|
||||||
if (valid) {
|
const submit = () => {
|
||||||
if (form.id) {
|
formRef.value.validate(async (valid: any) => {
|
||||||
form.addrStrOption = form.addr.join('/')
|
if (valid) {
|
||||||
await updateSgUser(form)
|
if (form.id) {
|
||||||
ElMessage.success('更新成功')
|
form.addrStrOption = form.addr.join('/')
|
||||||
tableStore.index()
|
await updateSgUser(form)
|
||||||
//切到进线处
|
ElMessage.success('更新成功')
|
||||||
dialogVisible.value = false
|
tableStore.index()
|
||||||
} else {
|
//切到进线处
|
||||||
await addSgUser(form).then(res => {
|
dialogVisible.value = false
|
||||||
form.id = res.data
|
} else {
|
||||||
//查询进线数据，避免一直处于loading状态
|
await addSgUser(form).then(res => {
|
||||||
incomingTable.value.getTableData(form.id)
|
form.id = res.data
|
||||||
ElMessage.success('保存成功')
|
//查询进线数据，避免一直处于loading状态
|
||||||
tableStore.index()
|
incomingTable.value.getTableData(form.id)
|
||||||
//切到进线处
|
ElMessage.success('保存成功')
|
||||||
tab.value='incomingLine'
|
tableStore.index()
|
||||||
dialogVisible.value = true
|
//切到进线处
|
||||||
})
|
tab.value='incomingLine'
|
||||||
}
|
dialogVisible.value = true
|
||||||
|
})
|
||||||
}
|
}
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
})
|
||||||
/************针对tab切换*************/
|
}
|
||||||
const checkUserId = (tab: any, event: any) => {
|
|
||||||
if (tab == 'user') {
|
/************针对tab切换*************/
|
||||||
return true
|
const checkUserId = (tab: any, event: any) => {
|
||||||
}
|
if (tab == 'user') {
|
||||||
if (form.id) {
|
return true
|
||||||
return true
|
}
|
||||||
} else {
|
if (form.id) {
|
||||||
ElMessage.error('请先创建用户基础信息！')
|
return true
|
||||||
return false
|
} else {
|
||||||
}
|
ElMessage.error('请先创建用户基础信息！')
|
||||||
}
|
return false
|
||||||
|
}
|
||||||
defineExpose({ open })
|
}
|
||||||
</script>
|
|
||||||
|
defineExpose({ open })
|
||||||
<style scoped>
|
</script>
|
||||||
.el-upload-list__item {
|
|
||||||
transition: none !important;
|
<style scoped>
|
||||||
}
|
.el-upload-list__item {
|
||||||
|
transition: none !important;
|
||||||
.el-select {
|
}
|
||||||
min-width: 180px;
|
|
||||||
}
|
.el-select {
|
||||||
</style>
|
min-width: 180px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@@ -1,115 +1,115 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div class="custom-table-header">
|
<div class="custom-table-header">
|
||||||
<div class="title">接口权限列表</div>
|
<div class="title">接口权限列表</div>
|
||||||
<el-input v-model="tableStore.table.params.searchValue" style="width: 240px" placeholder="请输入菜单名称"
|
<el-input v-model="tableStore.table.params.searchValue" style="width: 240px" placeholder="请输入关键字"
|
||||||
class="ml10" clearable @input="search" />
|
class="ml10" clearable @input="search" />
|
||||||
<el-button :icon="Plus" type="primary" @click="addMenu" class="ml10" :disabled="!props.id">新增</el-button>
|
<el-button :icon="Plus" type="primary" @click="addMenu" class="ml10" :disabled="!props.id">新增</el-button>
|
||||||
</div>
|
</div>
|
||||||
<Table ref="tableRef" />
|
<Table ref="tableRef" />
|
||||||
<popupApi ref="popupRef" @init="tableStore.index()"></popupApi>
|
<popupApi ref="popupRef" @init="tableStore.index()"></popupApi>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { Plus } from '@element-plus/icons-vue'
|
import { Plus } from '@element-plus/icons-vue'
|
||||||
import { ref, Ref, inject, provide, watch } from 'vue'
|
import { ref, Ref, inject, provide, watch } from 'vue'
|
||||||
import TableStore from '@/utils/tableStore'
|
import TableStore from '@/utils/tableStore'
|
||||||
import Table from '@/components/table/index.vue'
|
import Table from '@/components/table/index.vue'
|
||||||
import popupApi from './popupApi.vue'
|
import popupApi from './popupApi.vue'
|
||||||
import { deleteMenu } from '@/api/user-boot/function'
|
import { deleteMenu } from '@/api/user-boot/function'
|
||||||
|
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: 'auth/menu/api'
|
name: 'auth/menu/api'
|
||||||
})
|
})
|
||||||
const emits = defineEmits<{
|
const emits = defineEmits<{
|
||||||
(e: 'init'): void
|
(e: 'init'): void
|
||||||
}>()
|
}>()
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
id: {
|
id: {
|
||||||
type: String,
|
type: String,
|
||||||
default: ''
|
default: ''
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
const tableRef = ref()
|
const tableRef = ref()
|
||||||
const popupRef = ref()
|
const popupRef = ref()
|
||||||
const apiList = ref([])
|
const apiList = ref([])
|
||||||
const tableStore = new TableStore({
|
const tableStore = new TableStore({
|
||||||
showPage: false,
|
showPage: false,
|
||||||
url: '/user-boot/function/getButtonById',
|
url: '/user-boot/function/getButtonById',
|
||||||
publicHeight: 60,
|
publicHeight: 60,
|
||||||
column: [
|
column: [
|
||||||
{ title: '普通接口/接口名称', field: 'name', },
|
{ title: '普通接口/接口名称', field: 'name', },
|
||||||
{
|
{
|
||||||
title: '接口类型', field: 'type', formatter: row => {
|
title: '接口类型', field: 'type', formatter: row => {
|
||||||
return row.cellValue == 1 ? '普通接口' : '公用接口'
|
return row.cellValue == 1 ? '普通接口' : '公用接口'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{ title: 'URL接口路径', field: 'path' },
|
{ title: 'URL接口路径', field: 'path' },
|
||||||
{
|
{
|
||||||
title: '操作',
|
title: '操作',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: '180',
|
width: '180',
|
||||||
render: 'buttons',
|
render: 'buttons',
|
||||||
buttons: [
|
buttons: [
|
||||||
{
|
{
|
||||||
name: 'edit',
|
name: 'edit',
|
||||||
title: '编辑',
|
title: '编辑',
|
||||||
type: 'primary',
|
type: 'primary',
|
||||||
icon: 'el-icon-EditPen',
|
icon: 'el-icon-EditPen',
|
||||||
render: 'basicButton',
|
render: 'basicButton',
|
||||||
click: row => {
|
click: row => {
|
||||||
popupRef.value.open('编辑接口权限', row)
|
popupRef.value.open('编辑接口权限', row)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'del',
|
name: 'del',
|
||||||
title: '删除',
|
title: '删除',
|
||||||
type: 'danger',
|
type: 'danger',
|
||||||
icon: 'el-icon-Delete',
|
icon: 'el-icon-Delete',
|
||||||
render: 'confirmButton',
|
render: 'confirmButton',
|
||||||
popconfirm: {
|
popconfirm: {
|
||||||
confirmButtonText: '确认',
|
confirmButtonText: '确认',
|
||||||
cancelButtonText: '取消',
|
cancelButtonText: '取消',
|
||||||
confirmButtonType: 'danger',
|
confirmButtonType: 'danger',
|
||||||
title: '确定删除该菜单吗？'
|
title: '确定删除该菜单吗？'
|
||||||
},
|
},
|
||||||
click: row => {
|
click: row => {
|
||||||
deleteMenu(row.id).then(() => {
|
deleteMenu(row.id).then(() => {
|
||||||
tableStore.index()
|
tableStore.index()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
loadCallback: () => {
|
loadCallback: () => {
|
||||||
apiList.value = tableStore.table.data
|
apiList.value = tableStore.table.data
|
||||||
search()
|
search()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
tableStore.table.loading = false
|
tableStore.table.loading = false
|
||||||
watch(
|
watch(
|
||||||
() => props.id,
|
() => props.id,
|
||||||
() => {
|
() => {
|
||||||
tableStore.table.params.id = props.id
|
tableStore.table.params.id = props.id
|
||||||
tableStore.index()
|
tableStore.index()
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
provide('tableStore', tableStore)
|
provide('tableStore', tableStore)
|
||||||
|
|
||||||
const addMenu = () => {
|
const addMenu = () => {
|
||||||
console.log(popupRef)
|
console.log(popupRef)
|
||||||
popupRef.value.open('新增接口权限', {
|
popupRef.value.open('新增接口权限', {
|
||||||
pid: props.id
|
pid: props.id
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
const search = () => {
|
const search = () => {
|
||||||
tableStore.table.data = apiList.value.filter(
|
tableStore.table.data = apiList.value.filter(
|
||||||
(item: any) =>
|
(item: any) =>
|
||||||
!tableStore.table.params.searchValue ||
|
!tableStore.table.params.searchValue ||
|
||||||
item.name.indexOf(tableStore.table.params.searchValue) !== -1 ||
|
item.name.indexOf(tableStore.table.params.searchValue) !== -1 ||
|
||||||
item.path.indexOf(tableStore.table.params.searchValue) !== -1
|
item.path.indexOf(tableStore.table.params.searchValue) !== -1
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@@ -1,84 +1,84 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-dialog draggable class="cn-operate-dialog" v-model="dialogVisible" :title="title">
|
<el-dialog draggable class="cn-operate-dialog" v-model="dialogVisible" :title="title">
|
||||||
<el-scrollbar>
|
<el-scrollbar>
|
||||||
<el-form :inline="false" :model="form" label-width="120px" :rules="rules" ref="formRef">
|
<el-form :inline="false" :model="form" label-width="120px" :rules="rules" ref="formRef">
|
||||||
<el-form-item label="角色名称" prop="name">
|
<el-form-item label="角色名称" prop="name">
|
||||||
<el-input v-model="form.name" placeholder="请输入菜单名称" maxlength="32" show-word-limit @input="handleInput"/>
|
<el-input v-model="form.name" placeholder="请输入菜单名称" maxlength="32" show-word-limit @input="handleInput"/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="角色编码" prop="code">
|
<el-form-item label="角色编码" prop="code">
|
||||||
<el-input v-model="form.code" placeholder="请输入菜单名称" />
|
<el-input v-model="form.code" placeholder="请输入角色编码" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="角色描述">
|
<el-form-item label="角色描述">
|
||||||
<el-input v-model="form.remark" :rows="2" type="textarea" placeholder="请输入描述" />
|
<el-input v-model="form.remark" :rows="2" type="textarea" placeholder="请输入描述" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
</el-scrollbar>
|
</el-scrollbar>
|
||||||
|
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<span class="dialog-footer">
|
<span class="dialog-footer">
|
||||||
<el-button @click="dialogVisible = false">取消</el-button>
|
<el-button @click="dialogVisible = false">取消</el-button>
|
||||||
<el-button type="primary" @click="submit">确认</el-button>
|
<el-button type="primary" @click="submit">确认</el-button>
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref, inject } from 'vue'
|
import { ref, inject } from 'vue'
|
||||||
import { reactive } from 'vue'
|
import { reactive } from 'vue'
|
||||||
import TableStore from '@/utils/tableStore'
|
import TableStore from '@/utils/tableStore'
|
||||||
import { ElMessage } from 'element-plus'
|
import { ElMessage } from 'element-plus'
|
||||||
import { add, update } from '@/api/user-boot/role'
|
import { add, update } from '@/api/user-boot/role'
|
||||||
import { useAdminInfo } from '@/stores/adminInfo'
|
import { useAdminInfo } from '@/stores/adminInfo'
|
||||||
|
|
||||||
const adminInfo = useAdminInfo()
|
const adminInfo = useAdminInfo()
|
||||||
const tableStore = inject('tableStore') as TableStore
|
const tableStore = inject('tableStore') as TableStore
|
||||||
const formRef = ref()
|
const formRef = ref()
|
||||||
// do not use same name with ref
|
// do not use same name with ref
|
||||||
const form = reactive({
|
const form = reactive({
|
||||||
code: '',
|
code: '',
|
||||||
name: '',
|
name: '',
|
||||||
remark: '',
|
remark: '',
|
||||||
id: '',
|
id: '',
|
||||||
type: 0
|
type: 0
|
||||||
})
|
})
|
||||||
const rules = {
|
const rules = {
|
||||||
name: [{ required: true, message: '角色名称不能为空', trigger: 'blur' }],
|
name: [{ required: true, message: '角色名称不能为空', trigger: 'blur' }],
|
||||||
code: [{ required: true, message: '角色编码不能为空', trigger: 'blur' }]
|
code: [{ required: true, message: '角色编码不能为空', trigger: 'blur' }]
|
||||||
}
|
}
|
||||||
const dialogVisible = ref(false)
|
const dialogVisible = ref(false)
|
||||||
const title = ref('新增菜单')
|
const title = ref('新增菜单')
|
||||||
const open = (text: string, data?: anyObj) => {
|
const open = (text: string, data?: anyObj) => {
|
||||||
title.value = text
|
title.value = text
|
||||||
dialogVisible.value = true
|
dialogVisible.value = true
|
||||||
if (data) {
|
if (data) {
|
||||||
for (let key in form) {
|
for (let key in form) {
|
||||||
form[key] = data[key]
|
form[key] = data[key]
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
for (let key in form) {
|
for (let key in form) {
|
||||||
form[key] = ''
|
form[key] = ''
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const submit = async () => {
|
const submit = async () => {
|
||||||
formRef.value.validate(async (valid: boolean) => {
|
formRef.value.validate(async (valid: boolean) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
if (form.id) {
|
if (form.id) {
|
||||||
await update(form)
|
await update(form)
|
||||||
} else {
|
} else {
|
||||||
form.type = adminInfo.$state.userType + 1
|
form.type = adminInfo.$state.userType + 1
|
||||||
await add(form)
|
await add(form)
|
||||||
}
|
}
|
||||||
ElMessage.success('保存成功')
|
ElMessage.success('保存成功')
|
||||||
tableStore.index()
|
tableStore.index()
|
||||||
dialogVisible.value = false
|
dialogVisible.value = false
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleInput = (val: string) => {
|
const handleInput = (val: string) => {
|
||||||
form.name = val.replace(/\s+/g, '')
|
form.name = val.replace(/\s+/g, '')
|
||||||
}
|
}
|
||||||
|
|
||||||
defineExpose({ open })
|
defineExpose({ open })
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
110
vite.config.ts
110
vite.config.ts
@@ -1,54 +1,56 @@
|
|||||||
import { defineConfig } from 'vite'
|
import { defineConfig } from 'vite'
|
||||||
import vue from '@vitejs/plugin-vue'
|
import vue from '@vitejs/plugin-vue'
|
||||||
import vueJsx from '@vitejs/plugin-vue-jsx'
|
import vueJsx from '@vitejs/plugin-vue-jsx'
|
||||||
import AutoImport from 'unplugin-auto-import/vite'
|
import AutoImport from 'unplugin-auto-import/vite'
|
||||||
import { svgBuilder } from '/@/components/icon/svg/index'
|
import { svgBuilder } from '/@/components/icon/svg/index'
|
||||||
|
|
||||||
import path from 'path'
|
import path from 'path'
|
||||||
|
|
||||||
const nodeResolve = (dir: string): any => path.resolve(__dirname, '.', dir)
|
const nodeResolve = (dir: string): any => path.resolve(__dirname, '.', dir)
|
||||||
// https://vitejs.dev/config/
|
// https://vitejs.dev/config/
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
plugins: [
|
plugins: [
|
||||||
vue(),
|
vue(),
|
||||||
svgBuilder('./src/assets/icons/'),
|
svgBuilder('./src/assets/icons/'),
|
||||||
vueJsx(),
|
vueJsx(),
|
||||||
AutoImport({
|
AutoImport({
|
||||||
//自动引入
|
//自动引入
|
||||||
imports: ['vue', 'vue-router', 'pinia']
|
imports: ['vue', 'vue-router', 'pinia']
|
||||||
})
|
})
|
||||||
],
|
],
|
||||||
server: {
|
server: {
|
||||||
host: '0.0.0.0',
|
host: '0.0.0.0',
|
||||||
open: true,
|
open: true,
|
||||||
proxy: {
|
proxy: {
|
||||||
'/api': {
|
'/api': {
|
||||||
// target: 'http://10.95.53.49:10215', //海南服务器ip
|
// target: 'http://10.95.53.49:10215', //海南服务器ip
|
||||||
// target: 'http://10.118.135.128:10215', ///hsw
|
// target: 'http://10.118.135.128:10215', ///hsw
|
||||||
target: 'http://192.168.1.29:10215', ///hsw
|
target: 'http://192.168.1.67:10215', ///hsw
|
||||||
// target: 'http://10.119.65.152:10215', //数据中心
|
// target: 'http://192.168.1.68:10215', ///hsw
|
||||||
changeOrigin: true,
|
// target: 'http://10.119.65.152:10215', //数据中心
|
||||||
rewrite: path => path.replace(/^\/api/, '') //路径重写，把'/api'替换为''
|
changeOrigin: true,
|
||||||
},
|
rewrite: path => path.replace(/^\/api/, '') //路径重写，把'/api'替换为''
|
||||||
'/api-docx': {
|
},
|
||||||
// 文件服务器地址
|
'/api-docx': {
|
||||||
target: 'http://192.168.1.22:9009',
|
// 文件服务器地址
|
||||||
changeOrigin: true,
|
target: 'http://192.168.1.68:9009',
|
||||||
rewrite: path => path.replace(/^\/api-docx/, '')
|
changeOrigin: true,
|
||||||
},
|
rewrite: path => path.replace(/^\/api-docx/, '')
|
||||||
'/map': {
|
},
|
||||||
// target: 'http://10.95.53.49:8088', //海南服务器ip
|
'/map': {
|
||||||
target: 'http://192.168.1.125:9009', //hsw
|
// target: 'http://10.95.53.49:8088', //海南服务器ip
|
||||||
// target: 'http://192.168.1.125:8088', //数据中心
|
target: 'http://192.168.1.125:9009', //hsw
|
||||||
changeOrigin: true
|
// target: 'http://192.168.1.125:8088', //数据中心
|
||||||
}
|
changeOrigin: true
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
resolve: {
|
},
|
||||||
alias: {
|
resolve: {
|
||||||
'/@': nodeResolve('.src'),
|
alias: {
|
||||||
'@': nodeResolve('src'),
|
'/@': nodeResolve('.src'),
|
||||||
'~': nodeResolve('public')
|
'@': nodeResolve('src'),
|
||||||
}
|
'~': nodeResolve('public')
|
||||||
}
|
}
|
||||||
})
|
}
|
||||||
|
})
|
||||||
|
|
||||||
Reference in New Issue
Block a user