mirror of
https://github.com/dataease/dataease.git
synced 2025-02-25 20:42:55 +08:00
Merge pull request #2971 from dataease/pr@dev_station_msg
Pr@dev station msg
This commit is contained in:
dataeaseShu
GitHub
commit
cce3ed4946
56
frontend/src/components/deCustomCm/deDatePick.vue
Normal file
56
frontend/src/components/deCustomCm/deDatePick.vue
Normal file
@ -0,0 +1,56 @@
|
||||
<template>
|
||||
<div class="de-date-pick">
|
||||
<el-date-picker
|
||||
:value="value"
|
||||
size="small"
|
||||
:disabled="disabled"
|
||||
type="daterange"
|
||||
@input="handleChange"
|
||||
range-separator="-"
|
||||
:start-placeholder="$t('commons.date.start_date')"
|
||||
:end-placeholder="$t('commons.date.end_date')"
|
||||
>
|
||||
</el-date-picker>
|
||||
<svg-icon icon-class="icon_calendar_outlined" class="calendar-outlined" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "DeDatePick",
|
||||
props: {
|
||||
disabled: Boolean,
|
||||
value: Array,
|
||||
},
|
||||
methods: {
|
||||
handleChange(val) {
|
||||
this.$emit("input", val);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.de-date-pick {
|
||||
width: 256px;
|
||||
position: relative;
|
||||
.el-input__icon {
|
||||
display: none;
|
||||
}
|
||||
.el-range-input {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.el-date-editor {
|
||||
padding-left: 12px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.calendar-outlined {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
right: 13px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
76
frontend/src/components/deCustomCm/dePwd.vue
Normal file
76
frontend/src/components/deCustomCm/dePwd.vue
Normal file
@ -0,0 +1,76 @@
|
||||
<template>
|
||||
<el-input
|
||||
:value="value"
|
||||
:placeholder="placeholder"
|
||||
:type="type"
|
||||
:disabled="disabled"
|
||||
class="de-pwd-input"
|
||||
@input="handleInput"
|
||||
@change="handleChange"
|
||||
>
|
||||
<svg-icon
|
||||
@click="handleClick"
|
||||
v-if="!showPwd || buttonDisabled"
|
||||
slot="suffix"
|
||||
icon-class="de_pwd_invisible"
|
||||
/>
|
||||
<svg-icon
|
||||
@click="handleClick"
|
||||
v-else
|
||||
slot="suffix"
|
||||
icon-class="de_pwd_visible"
|
||||
/>
|
||||
</el-input>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { log } from "@antv/g2plot/lib/utils";
|
||||
export default {
|
||||
name: "DePwd",
|
||||
inject: {
|
||||
elForm: {
|
||||
default: "",
|
||||
},
|
||||
},
|
||||
props: {
|
||||
disabled: Boolean,
|
||||
placeholder: String,
|
||||
value: String,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showPwd: false,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
buttonDisabled() {
|
||||
return this.$options.propsData.hasOwnProperty("disabled")
|
||||
? this.disabled
|
||||
: (this.elForm || {}).disabled;
|
||||
},
|
||||
type() {
|
||||
return !this.showPwd || this.buttonDisabled ? "password" : "text";
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
handleClick() {
|
||||
if (this.buttonDisabled) return;
|
||||
this.showPwd = !this.showPwd;
|
||||
},
|
||||
handleInput(val) {
|
||||
this.$emit("input", val);
|
||||
},
|
||||
handleChange(val) {
|
||||
this.$emit("change", val);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.de-pwd-input {
|
||||
.el-input__suffix {
|
||||
right: 12px;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -296,6 +296,16 @@ export default {
|
||||
border:1px solid var(--BrDateColor, #dfe4ed) !important;
|
||||
background: var(--BgDateColor, #FFFFFF) !important;
|
||||
|
||||
.el-picker-panel__sidebar {
|
||||
background: var(--BgDateColor, #FFFFFF) !important;
|
||||
border-right: 1px solid var(--BrDateColor, #dfe4ed) !important;
|
||||
|
||||
.el-picker-panel__shortcut {
|
||||
color: var(--DateColor, #606266);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.popper__arrow,
|
||||
.popper__arrow::after {
|
||||
display: none !important;
|
||||
@ -310,6 +320,10 @@ export default {
|
||||
border-bottom:1px solid var(--BrDateColor, #e6ebf5) !important;
|
||||
}
|
||||
|
||||
.el-date-table td.in-range:not(.end-date):not(.start-date) div span {
|
||||
color: #3370ff;
|
||||
}
|
||||
|
||||
.el-date-range-picker__header,
|
||||
.el-date-table th,
|
||||
.el-date-table__row,
|
||||
|
||||
3
frontend/src/icons/svg/de-search.svg
Normal file
3
frontend/src/icons/svg/de-search.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10.9823 11.9244C9.89439 12.8051 8.50885 13.3327 7.00008 13.3327C3.50228 13.3327 0.666748 10.4972 0.666748 6.99935C0.666748 3.50155 3.50228 0.666016 7.00008 0.666016C10.4979 0.666016 13.3334 3.50155 13.3334 6.99935C13.3334 8.50811 12.8058 9.89365 11.9251 10.9816L14.6737 13.7301C14.8039 13.8603 14.8039 14.0714 14.6737 14.2015L14.2023 14.673C14.0721 14.8031 13.8611 14.8031 13.7309 14.673L10.9823 11.9244ZM12.0001 6.99935C12.0001 4.23793 9.7615 1.99935 7.00008 1.99935C4.23866 1.99935 2.00008 4.23793 2.00008 6.99935C2.00008 9.76077 4.23866 11.9993 7.00008 11.9993C9.7615 11.9993 12.0001 9.76077 12.0001 6.99935Z" fill="#646A73"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 743 B |
3
frontend/src/icons/svg/de_pwd_invisible.svg
Normal file
3
frontend/src/icons/svg/de_pwd_invisible.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8.00022 9.99975C7.56203 9.99975 7.13323 9.96523 6.71734 9.89921L6.38535 11.1382C6.33771 11.316 6.15493 11.4216 5.9771 11.3739L5.33315 11.2014C5.15533 11.1537 5.0498 10.9709 5.09745 10.7931L5.42255 9.57985C4.88013 9.39561 4.37096 9.15494 3.90491 8.86629L2.8454 9.9258C2.71522 10.056 2.50417 10.056 2.37399 9.9258L1.90259 9.4544C1.77242 9.32422 1.77242 9.11317 1.90259 8.98299L2.83565 8.04994C2.35424 7.59918 1.95209 7.0852 1.64812 6.52421C1.64492 6.51832 1.64162 6.51215 1.63823 6.50575C1.5136 6.27038 1.56023 5.97574 1.75709 5.79635C1.92051 5.64743 2.03596 5.5461 2.13639 5.44567C2.14538 5.43669 2.15521 5.42666 2.16569 5.41583C2.31108 5.2656 2.55902 5.32152 2.64417 5.51246C3.47427 7.37398 5.46211 8.66641 8.00022 8.66641C10.4321 8.66641 12.4664 7.40872 13.2829 5.68239C13.3042 5.63747 13.328 5.5809 13.3519 5.52084C13.4276 5.33064 13.6741 5.27325 13.8188 5.41801C13.9259 5.52508 14.0687 5.66784 14.2471 5.8463C14.4235 6.0227 14.4713 6.29211 14.356 6.51334C14.3279 6.56715 14.3006 6.61785 14.2774 6.65816C13.9638 7.20109 13.5572 7.69751 13.0754 8.1321L13.9263 8.98299C14.0565 9.11317 14.0565 9.32422 13.9263 9.4544L13.4549 9.9258C13.3247 10.056 13.1136 10.056 12.9835 9.9258L11.9888 8.93112C11.5521 9.19111 11.0792 9.40958 10.5779 9.57985L10.903 10.7931C10.9506 10.9709 10.8451 11.1537 10.6673 11.2014L10.0233 11.3739C9.84552 11.4216 9.66274 11.316 9.61509 11.1382L9.2831 9.89921C8.86721 9.96523 8.43842 9.99975 8.00022 9.99975Z" fill="#BBBFC4"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
3
frontend/src/icons/svg/de_pwd_visible.svg
Normal file
3
frontend/src/icons/svg/de_pwd_visible.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M7.98994 12.333C10.1486 12.333 12.1472 10.9599 14.0001 7.99101C12.1949 5.03272 10.2008 3.66634 7.98994 3.66634C5.77984 3.66634 3.7929 5.0321 2.00009 7.99099C3.84053 10.9605 5.83206 12.333 7.98994 12.333ZM1.00172 8.59304C0.787049 8.22763 0.785596 7.77336 0.995302 7.40508C1.00277 7.39196 1.00993 7.37945 1.01672 7.36768C2.9521 4.01123 5.27627 2.33301 7.98923 2.33301C10.7133 2.33301 13.0518 4.02495 15.0049 7.40884C15.0107 7.41898 15.0168 7.42969 15.0232 7.44089C15.2208 7.7869 15.2193 8.21401 15.0172 8.55738C13.0127 11.9634 10.67 13.6663 7.98923 13.6663C5.31784 13.6663 2.98867 11.9752 1.00172 8.59304ZM8.00009 10.6663C6.52733 10.6663 5.33342 9.47243 5.33342 7.99967C5.33342 6.52692 6.52733 5.33301 8.00009 5.33301C9.47285 5.33301 10.6668 6.52692 10.6668 7.99967C10.6668 9.47243 9.47285 10.6663 8.00009 10.6663ZM8.00009 9.33301C8.73647 9.33301 9.33342 8.73605 9.33342 7.99967C9.33342 7.26329 8.73647 6.66634 8.00009 6.66634C7.26371 6.66634 6.66675 7.26329 6.66675 7.99967C6.66675 8.73605 7.26371 9.33301 8.00009 9.33301Z" fill="#BBBFC4"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
3
frontend/src/icons/svg/pwd_invisible.svg
Normal file
3
frontend/src/icons/svg/pwd_invisible.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8.00022 9.99975C7.56203 9.99975 7.13323 9.96523 6.71734 9.89921L6.38535 11.1382C6.33771 11.316 6.15493 11.4216 5.9771 11.3739L5.33315 11.2014C5.15533 11.1537 5.0498 10.9709 5.09745 10.7931L5.42255 9.57985C4.88013 9.39561 4.37096 9.15494 3.90491 8.86629L2.8454 9.9258C2.71522 10.056 2.50417 10.056 2.37399 9.9258L1.90259 9.4544C1.77242 9.32422 1.77242 9.11317 1.90259 8.98299L2.83565 8.04994C2.35424 7.59918 1.95209 7.0852 1.64812 6.52421C1.64492 6.51832 1.64162 6.51215 1.63823 6.50575C1.5136 6.27038 1.56023 5.97574 1.75709 5.79635C1.92051 5.64743 2.03596 5.5461 2.13639 5.44567C2.14538 5.43669 2.15521 5.42666 2.16569 5.41583C2.31108 5.2656 2.55902 5.32152 2.64417 5.51246C3.47427 7.37398 5.46211 8.66641 8.00022 8.66641C10.4321 8.66641 12.4664 7.40872 13.2829 5.68239C13.3042 5.63747 13.328 5.5809 13.3519 5.52084C13.4276 5.33064 13.6741 5.27325 13.8188 5.41801C13.9259 5.52508 14.0687 5.66784 14.2471 5.8463C14.4235 6.0227 14.4713 6.29211 14.356 6.51334C14.3279 6.56715 14.3006 6.61785 14.2774 6.65816C13.9638 7.20109 13.5572 7.69751 13.0754 8.1321L13.9263 8.98299C14.0565 9.11317 14.0565 9.32422 13.9263 9.4544L13.4549 9.9258C13.3247 10.056 13.1136 10.056 12.9835 9.9258L11.9888 8.93112C11.5521 9.19111 11.0792 9.40958 10.5779 9.57985L10.903 10.7931C10.9506 10.9709 10.8451 11.1537 10.6673 11.2014L10.0233 11.3739C9.84552 11.4216 9.66274 11.316 9.61509 11.1382L9.2831 9.89921C8.86721 9.96523 8.43842 9.99975 8.00022 9.99975Z" fill="#BBBFC4"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
3
frontend/src/icons/svg/pwd_visible.svg
Normal file
3
frontend/src/icons/svg/pwd_visible.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M7.98994 12.333C10.1486 12.333 12.1472 10.9599 14.0001 7.99101C12.1949 5.03272 10.2008 3.66634 7.98994 3.66634C5.77984 3.66634 3.7929 5.0321 2.00009 7.99099C3.84053 10.9605 5.83206 12.333 7.98994 12.333ZM1.00172 8.59304C0.787049 8.22763 0.785596 7.77336 0.995302 7.40508C1.00277 7.39196 1.00993 7.37945 1.01672 7.36768C2.9521 4.01123 5.27627 2.33301 7.98923 2.33301C10.7133 2.33301 13.0518 4.02495 15.0049 7.40884C15.0107 7.41898 15.0168 7.42969 15.0232 7.44089C15.2208 7.7869 15.2193 8.21401 15.0172 8.55738C13.0127 11.9634 10.67 13.6663 7.98923 13.6663C5.31784 13.6663 2.98867 11.9752 1.00172 8.59304ZM8.00009 10.6663C6.52733 10.6663 5.33342 9.47243 5.33342 7.99967C5.33342 6.52692 6.52733 5.33301 8.00009 5.33301C9.47285 5.33301 10.6668 6.52692 10.6668 7.99967C10.6668 9.47243 9.47285 10.6663 8.00009 10.6663ZM8.00009 9.33301C8.73647 9.33301 9.33342 8.73605 9.33342 7.99967C9.33342 7.26329 8.73647 6.66634 8.00009 6.66634C7.26371 6.66634 6.66675 7.26329 6.66675 7.99967C6.66675 8.73605 7.26371 9.33301 8.00009 9.33301Z" fill="#BBBFC4"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
@ -97,8 +97,8 @@ export default {
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #646a73;
|
||||
background: #fff;
|
||||
color: var(--SiderTextColor, #646a73);
|
||||
background-color: var(--SiderBG, #ffffff);
|
||||
cursor: pointer;
|
||||
|
||||
i {
|
||||
|
||||
@ -1196,4 +1196,20 @@ div:focus {
|
||||
position: absolute;
|
||||
right: 12px;
|
||||
bottom: 12px;
|
||||
}
|
||||
|
||||
|
||||
.de-input-search {
|
||||
.el-input__inner {
|
||||
padding-left: 36px;
|
||||
}
|
||||
.el-input__prefix {
|
||||
left: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
svg {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -72,7 +72,7 @@ export default {
|
||||
background: #ffffff;
|
||||
border: 1px solid var(--deCardStrokeColor, #dee0e3);
|
||||
border-radius: 4px;
|
||||
margin: 0 12.5px 25px 12.5px;
|
||||
margin: 0 24px 25px 0;
|
||||
.card-img-model {
|
||||
border-bottom: 1px solid var(--deCardStrokeColor, #dee0e3);
|
||||
height: 144px;
|
||||
|
||||
@ -2,11 +2,13 @@
|
||||
<div class="de-template-list">
|
||||
<el-input
|
||||
v-model="templateFilterText"
|
||||
:placeholder="$t('panel.filter_keywords')"
|
||||
:placeholder="$t('system_parameter_setting.search_keywords')"
|
||||
size="small"
|
||||
class="de-input-search"
|
||||
clearable
|
||||
prefix-icon="el-icon-search"
|
||||
/>
|
||||
>
|
||||
<svg-icon slot="prefix" icon-class="de-search"></svg-icon>
|
||||
</el-input>
|
||||
<el-empty
|
||||
:image="noneImg"
|
||||
v-if="!templateListComputed.length && templateFilterText === ''"
|
||||
@ -85,8 +87,8 @@ export default {
|
||||
return {
|
||||
templateFilterText: "",
|
||||
activeTemplate: "",
|
||||
noneImg: require('@/assets/None.png'),
|
||||
nothingImg: require('@/assets/nothing.png'),
|
||||
noneImg: require("@/assets/None.png"),
|
||||
nothingImg: require("@/assets/nothing.png"),
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@ -127,12 +129,12 @@ export default {
|
||||
},
|
||||
templateDelete(template) {
|
||||
const options = {
|
||||
title: 'system_parameter_setting.delete_this_category',
|
||||
content: 'system_parameter_setting.also_be_deleted',
|
||||
type: "primary",
|
||||
cb: () => this.$emit("templateDelete", template.id),
|
||||
};
|
||||
this.handlerConfirm(options);
|
||||
title: "system_parameter_setting.delete_this_category",
|
||||
content: "system_parameter_setting.also_be_deleted",
|
||||
type: "primary",
|
||||
cb: () => this.$emit("templateDelete", template.id),
|
||||
};
|
||||
this.handlerConfirm(options);
|
||||
},
|
||||
templateEdit(template) {
|
||||
this.$emit("templateEdit", template);
|
||||
@ -163,7 +165,7 @@ export default {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 4px;
|
||||
color: var(--deTextPrimary, #1F2329);
|
||||
color: var(--deTextPrimary, #1f2329);
|
||||
font-family: "PingFang SC";
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
|
||||
@ -152,8 +152,8 @@ export default {
|
||||
currentTemplateLabel: "",
|
||||
currentTemplateId: "",
|
||||
templateList: [],
|
||||
templateMiniWidth: 262,
|
||||
templateCurWidth: 262,
|
||||
templateMiniWidth: 286,
|
||||
templateCurWidth: 286,
|
||||
formType: "",
|
||||
originName: "",
|
||||
templateDialog: {
|
||||
@ -188,7 +188,7 @@ export default {
|
||||
templateMainDom.offsetWidth / _this.templateMiniWidth
|
||||
);
|
||||
_this.templateCurWidth =
|
||||
Math.trunc(templateMainDom.offsetWidth / curSeparator) - 50;
|
||||
Math.trunc(templateMainDom.offsetWidth / curSeparator) - 24 - curSeparator;
|
||||
});
|
||||
});
|
||||
},
|
||||
@ -386,7 +386,7 @@ export default {
|
||||
.de-tabs-right {
|
||||
flex: 1;
|
||||
background: #fff;
|
||||
padding: 24px 12px 24px 12px;
|
||||
padding: 24px 0 24px 24px;
|
||||
overflow: hidden;
|
||||
|
||||
.template-box {
|
||||
@ -402,6 +402,7 @@ export default {
|
||||
|
||||
.active-template {
|
||||
margin: 4px 0 20px 0;
|
||||
padding-right: 24px;
|
||||
font-family: "PingFang SC";
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
|
||||
@ -15,9 +15,10 @@
|
||||
<!--基础配置表单-->
|
||||
<el-form ref="formInline" v-loading="loading" :model="formInline" :rules="rules"
|
||||
class="demo-form-inline de-form-item" :disabled="show" label-width="80px" label-position="right" size="small">
|
||||
<el-form-item prop="frontTimeOut">
|
||||
<el-form-item prop="frontTimeOut" class="de-i118">
|
||||
<template slot="label">
|
||||
{{ $t('system_parameter_setting.request_timeout')}}
|
||||
<i class="is-require"></i>
|
||||
<el-tooltip class="item" effect="dark" :content="$t('system_parameter_setting.front_time_out')"
|
||||
placement="top">
|
||||
<i class="el-icon-warning-outline tips"></i>
|
||||
@ -253,9 +254,8 @@ export default {
|
||||
<style lang="scss" scoped>
|
||||
.demo-form-inline {
|
||||
.tips {
|
||||
position: absolute;
|
||||
left: 100px;
|
||||
top: 5px;
|
||||
margin-left: 2px;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
@ -265,3 +265,15 @@ export default {
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.de-i118 {
|
||||
.el-form-item__label::after {
|
||||
display: none;
|
||||
}
|
||||
.is-require::after {
|
||||
content: "*";
|
||||
color: #f54a45;
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -41,7 +41,7 @@
|
||||
<el-input v-model="form.configuration.username" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('datasource.password')">
|
||||
<el-input v-model="form.configuration.password" show-password />
|
||||
<dePwd v-model="form.configuration.password"/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('datasource.query_port')"
|
||||
@ -162,11 +162,13 @@ import { engineInfo, validate, save } from "@/api/system/engine";
|
||||
import i18n from "@/lang";
|
||||
import operater from "./operater";
|
||||
import msgCfm from '@/components/msgCfm'
|
||||
import dePwd from '@/components/deCustomCm/dePwd.vue'
|
||||
export default {
|
||||
name: "ClusterMode",
|
||||
mixins: [msgCfm],
|
||||
components: {
|
||||
operater,
|
||||
dePwd
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
@ -68,14 +68,9 @@
|
||||
:label="$t('system_parameter_setting.SMTP_password')"
|
||||
prop="password"
|
||||
>
|
||||
<el-input
|
||||
ref="input"
|
||||
<dePwd
|
||||
v-model="formInline.password"
|
||||
:placeholder="$t('system_parameter_setting.SMTP_password')"
|
||||
autocomplete="new-password"
|
||||
show-password
|
||||
type="text"
|
||||
@focus="changeType"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('system_parameter_setting.test_recipients')">
|
||||
@ -90,13 +85,9 @@
|
||||
<i class="el-icon-warning-outline tips-not-absolute"></i>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<el-input
|
||||
ref="input"
|
||||
<dePwd
|
||||
v-model="formInline.recipient"
|
||||
:placeholder="$t('system_parameter_setting.test_recipients')"
|
||||
autocomplete="new-password"
|
||||
show-password
|
||||
type="text"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱服务器配置">
|
||||
@ -134,12 +125,13 @@
|
||||
import { emailInfo, updateInfo, validate } from "@/api/system/email";
|
||||
import operater from "./operater";
|
||||
import msgCfm from '@/components/msgCfm'
|
||||
|
||||
import dePwd from '@/components/deCustomCm/dePwd.vue'
|
||||
export default {
|
||||
name: "EmailSetting",
|
||||
mixins: [msgCfm],
|
||||
components: {
|
||||
operater,
|
||||
dePwd
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@ -183,9 +175,6 @@ export default {
|
||||
this.query();
|
||||
},
|
||||
methods: {
|
||||
changeType() {
|
||||
this.$refs.input = "password";
|
||||
},
|
||||
query() {
|
||||
emailInfo().then((response) => {
|
||||
this.formInline = response.data;
|
||||
|
||||
@ -93,7 +93,7 @@
|
||||
:label="$t('kettle.passwd')"
|
||||
prop="configuration.passwd"
|
||||
>
|
||||
<el-input :placeholder="$t('components.input_a_password')" v-model="form.configuration.passwd" show-password />
|
||||
<dePwd :placeholder="$t('components.input_a_password')" v-model="form.configuration.passwd"/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-col>
|
||||
@ -122,11 +122,12 @@ import {
|
||||
} from "@/api/system/kettle";
|
||||
import i18n from "@/lang";
|
||||
import GridTable from "@/components/gridTable/index.vue";
|
||||
import dePwd from '@/components/deCustomCm/dePwd.vue'
|
||||
import msgCfm from '@/components/msgCfm'
|
||||
|
||||
export default {
|
||||
name: "KettleSetting",
|
||||
components: { GridTable },
|
||||
components: { GridTable, dePwd },
|
||||
mixins: [msgCfm],
|
||||
data() {
|
||||
return {
|
||||
@ -339,7 +340,7 @@ export default {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 2px;
|
||||
width: 40px;
|
||||
padding: 1px 6px;
|
||||
height: 24px;
|
||||
}
|
||||
</style>
|
||||
403
frontend/src/views/system/log/filterUser.vue
Normal file
403
frontend/src/views/system/log/filterUser.vue
Normal file
@ -0,0 +1,403 @@
|
||||
<template>
|
||||
<el-drawer
|
||||
:title="$t('user.filter_method')"
|
||||
:visible.sync="userDrawer"
|
||||
custom-class="user-drawer-task"
|
||||
size="680px"
|
||||
v-closePress
|
||||
direction="rtl"
|
||||
>
|
||||
<div class="filter">
|
||||
<span>{{ $t("log.optype") }}</span>
|
||||
<div class="filter-item">
|
||||
<span
|
||||
class="item"
|
||||
@click="statusChange(item.value)"
|
||||
:class="[activeType.includes(item.value) ? 'active' : '']"
|
||||
:key="item.label"
|
||||
v-for="item in types"
|
||||
>{{ $t(item.label) }}</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="el-drawer__body-cont">
|
||||
<div class="filter">
|
||||
<span>{{ $t("log.user") }}</span>
|
||||
<div class="filter-item">
|
||||
<span
|
||||
@click="activeUserChange(ele.id)"
|
||||
class="item"
|
||||
:class="[activeUser.includes(ele.id) ? 'active' : '']"
|
||||
:key="ele.id"
|
||||
v-for="ele in usersValueCopy"
|
||||
>{{ ele.username }}</span
|
||||
>
|
||||
<el-popover
|
||||
placement="bottom"
|
||||
popper-class="user-popper"
|
||||
width="200"
|
||||
trigger="click"
|
||||
>
|
||||
<el-select
|
||||
ref="userSelect"
|
||||
v-model="usersValue"
|
||||
multiple
|
||||
filterable
|
||||
:placeholder="$t('commons.please_select')"
|
||||
@change="changeUser"
|
||||
@remove-tag="changeUser"
|
||||
value-key="id"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in usersComputed"
|
||||
:key="item.username"
|
||||
:label="item.username"
|
||||
:value="item"
|
||||
/>
|
||||
</el-select>
|
||||
<span class="more" slot="reference">+ {{ $t("panel.more") }}</span>
|
||||
</el-popover>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter">
|
||||
<span>{{ $t("dedaterange.label") }}</span>
|
||||
<div class="filter-item">
|
||||
<DeDatePick v-model="dataRange"></DeDatePick>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="foot">
|
||||
<el-button class="btn normal" @click="reset">{{
|
||||
$t("commons.reset")
|
||||
}}</el-button>
|
||||
<el-button type="primary" class="btn" @click="search">{{
|
||||
$t("commons.adv_search.search")
|
||||
}}</el-button>
|
||||
</div>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { dateFormat } from "@/views/system/task/options.js";
|
||||
import { opTypes } from "@/api/system/log";
|
||||
import { post } from "@/api/dataset/dataset";
|
||||
import DeDatePick from '@/components/deCustomCm/deDatePick.vue'
|
||||
export default {
|
||||
components: {
|
||||
DeDatePick
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
types: [],
|
||||
treeLoading: false,
|
||||
filterTextMap: [],
|
||||
dataRange: [],
|
||||
usersValue: [],
|
||||
activeUser: [],
|
||||
users: [],
|
||||
userCahe: [],
|
||||
activeType: [],
|
||||
userDrawer: false,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
usersComputed() {
|
||||
return this.users.filter((ele) => !this.activeUser.includes(ele.id));
|
||||
},
|
||||
usersValueCopy() {
|
||||
return this.userCahe.filter((ele) => this.activeUser.includes(ele.id));
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.loadUsers();
|
||||
this.loadType();
|
||||
},
|
||||
methods: {
|
||||
loadType() {
|
||||
opTypes().then((res) => {
|
||||
this.types = res.data.map((item) => {
|
||||
return { label: item.name, value: item.id };
|
||||
});
|
||||
});
|
||||
},
|
||||
loadUsers() {
|
||||
post("/api/user/userLists", {}, false).then((res) => {
|
||||
this.users = res.data;
|
||||
});
|
||||
},
|
||||
changeUser() {
|
||||
if (
|
||||
this.userCahe.length >
|
||||
this.usersValue.length + this.activeUser.length
|
||||
) {
|
||||
this.userCahe = this.userCahe.filter((ele) =>
|
||||
this.usersValue
|
||||
.map((ele) => ele.id)
|
||||
.concat(this.activeUser)
|
||||
.includes(ele.id)
|
||||
);
|
||||
return;
|
||||
}
|
||||
const userIdx = this.usersValue.findIndex(
|
||||
(ele) =>
|
||||
!this.userCahe
|
||||
.map((ele) => ele.id)
|
||||
.concat(this.activeUser)
|
||||
.includes(ele.id)
|
||||
);
|
||||
if (userIdx === -1) return;
|
||||
this.activeUser.push(this.usersValue[userIdx].id);
|
||||
this.userCahe.push(this.usersValue[userIdx]);
|
||||
this.usersValue.splice(userIdx, 1);
|
||||
},
|
||||
activeUserChange(id) {
|
||||
const userIndex = this.activeUser.findIndex((ele) => ele === id);
|
||||
if (userIndex === -1) {
|
||||
this.activeUser.push(id);
|
||||
this.usersValue = this.usersValue.filter((ele) => ele.id !== id);
|
||||
} else {
|
||||
this.activeUser.splice(userIndex, 1);
|
||||
const user = this.userCahe.find((ele) => ele.id === id);
|
||||
this.usersValue.push(user);
|
||||
}
|
||||
},
|
||||
clearFilter() {
|
||||
this.dataRange = [];
|
||||
this.usersValue = [];
|
||||
this.activeUser = [];
|
||||
this.activeType = [];
|
||||
this.userCahe = [];
|
||||
this.$emit("search", [], []);
|
||||
},
|
||||
clearOneFilter(index) {
|
||||
(this.filterTextMap[index] || []).forEach((ele) => {
|
||||
this[ele] = [];
|
||||
});
|
||||
},
|
||||
statusChange(value, type) {
|
||||
const statusIndex = this.activeType.findIndex((ele) => ele === value);
|
||||
if (statusIndex === -1) {
|
||||
this.activeType.push(value);
|
||||
} else {
|
||||
this.activeType.splice(statusIndex, 1);
|
||||
}
|
||||
},
|
||||
search() {
|
||||
this.userDrawer = false;
|
||||
this.$emit("search", this.formatCondition(), this.formatText());
|
||||
},
|
||||
formatText() {
|
||||
this.filterTextMap = [];
|
||||
const params = [];
|
||||
if (this.activeType.length) {
|
||||
params.push(
|
||||
`${this.$t('log.optype')}:${this.activeType
|
||||
.map((item) =>
|
||||
this.types.find((itx) => itx.value === item).label
|
||||
)
|
||||
.join("、")}`
|
||||
);
|
||||
this.filterTextMap.push([`activeType`]);
|
||||
}
|
||||
if (this.activeUser.length) {
|
||||
let str = `${this.$t("log.user")}:${this.activeUser.reduce(
|
||||
(pre, next) =>
|
||||
(this.users.find((ele) => ele.id === next) || {}).username +
|
||||
"、" +
|
||||
pre,
|
||||
""
|
||||
)}`;
|
||||
params.push(str.slice(0, str.length - 1));
|
||||
this.filterTextMap.push([
|
||||
"usersValue",
|
||||
"activeUser",
|
||||
"users",
|
||||
"userCahe",
|
||||
]);
|
||||
}
|
||||
|
||||
if (this.dataRange.length) {
|
||||
params.push(
|
||||
`${this.$t("dedaterange.label")}:${this.dataRange
|
||||
.map((ele) => {
|
||||
return dateFormat("YYYY-mm-dd", ele);
|
||||
})
|
||||
.join("-")}`
|
||||
);
|
||||
this.filterTextMap.push(["dataRange"]);
|
||||
}
|
||||
return params;
|
||||
},
|
||||
formatCondition() {
|
||||
const fildMap = {
|
||||
optype: this.activeType,
|
||||
"user_id": this.activeUser,
|
||||
};
|
||||
const conditions = [];
|
||||
Object.keys(fildMap).forEach((ele) => {
|
||||
if (fildMap[ele].length) {
|
||||
conditions.push({
|
||||
field: ele,
|
||||
operator: "in",
|
||||
value: fildMap[ele],
|
||||
});
|
||||
}
|
||||
});
|
||||
const [min, max] = this.dataRange;
|
||||
if (min && max) {
|
||||
conditions.push({
|
||||
field: "time",
|
||||
operator: "between",
|
||||
value: [+min, +max],
|
||||
});
|
||||
}
|
||||
return conditions;
|
||||
},
|
||||
init() {
|
||||
this.userDrawer = true;
|
||||
},
|
||||
reset() {
|
||||
this.clearFilter();
|
||||
this.userDrawer = false;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.user-drawer-task {
|
||||
.el-drawer__body-cont {
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
.el-drawer__header {
|
||||
padding: 16px 24px;
|
||||
margin: 0;
|
||||
font-family: PingFang SC;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
line-height: 24px;
|
||||
color: #1f2329;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
height: 57px;
|
||||
mix-blend-mode: normal;
|
||||
border-bottom: 1px solid rgba(187, 191, 196, 0.5);
|
||||
|
||||
.el-drawer__close-btn {
|
||||
position: absolute;
|
||||
right: 24px;
|
||||
top: 16px;
|
||||
padding: 4px;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.el-drawer__close-btn:hover {
|
||||
background: #e9e9ea;
|
||||
}
|
||||
}
|
||||
|
||||
.el-drawer__body {
|
||||
padding: 12px 24px 24px 24px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.filter {
|
||||
display: flex;
|
||||
min-height: 46px;
|
||||
> :nth-child(1) {
|
||||
color: #1f2329;
|
||||
font-family: "PingFang SC";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
white-space: nowrap;
|
||||
width: 116px;
|
||||
}
|
||||
.filter-item {
|
||||
flex: 1;
|
||||
.item,
|
||||
.more {
|
||||
font-family: PingFang SC;
|
||||
white-space: nowrap;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 24px;
|
||||
margin-right: 12px;
|
||||
text-align: center;
|
||||
padding: 1px 6px;
|
||||
background: #f5f6f7;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.active,
|
||||
.more:hover {
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
color: #0c296e;
|
||||
}
|
||||
.more {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
border-radius: 4px;
|
||||
padding: 5px 26px 5px 26px;
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
letter-spacing: 0px;
|
||||
text-align: center;
|
||||
border: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.normal {
|
||||
color: #1f2329;
|
||||
border: 1px solid #bbbfc4;
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.foot {
|
||||
position: absolute;
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
padding: 24px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
text-align: right;
|
||||
background: #ffffff;
|
||||
box-shadow: 0px -1px 4px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
}
|
||||
.user-popper {
|
||||
padding: 0;
|
||||
background: #fff;
|
||||
.popper__arrow {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.tree-select {
|
||||
.el-select-dropdown__empty,
|
||||
.el-scrollbar__wrap,
|
||||
.popper__arrow {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.user-popper.dept {
|
||||
height: 400px;
|
||||
overflow: auto;
|
||||
}
|
||||
</style>
|
||||
@ -1,162 +1,393 @@
|
||||
<template>
|
||||
<layout-content :header="$t('log.title')">
|
||||
<complex-table
|
||||
v-loading="$store.getters.loadingMap[$store.getters.currentPath]"
|
||||
:data="data"
|
||||
:columns="columns"
|
||||
:search-config="searchConfig"
|
||||
:pagination-config="paginationConfig"
|
||||
@select="select"
|
||||
@search="search"
|
||||
@sort-change="sortChange"
|
||||
<de-layout-content :header="$t('log.title')">
|
||||
<el-row class="top-operate">
|
||||
<el-col :span="12">
|
||||
<deBtn v-permission="['log:export']" secondary @click="exportConfirm">{{
|
||||
$t("zip.export")
|
||||
}}</deBtn>
|
||||
|
||||
</el-col>
|
||||
<el-col :span="12" class="right-user">
|
||||
<el-input
|
||||
:placeholder="$t('通过事件详情搜索')"
|
||||
prefix-icon="el-icon-search"
|
||||
class="name-email-search"
|
||||
size="small"
|
||||
clearable
|
||||
ref="search"
|
||||
v-model="nikeName"
|
||||
@blur="initSearch"
|
||||
@clear="initSearch"
|
||||
>
|
||||
</el-input>
|
||||
<deBtn
|
||||
:secondary="!cacheCondition.length"
|
||||
:plain="!!cacheCondition.length"
|
||||
icon="iconfont icon-icon-filter"
|
||||
@click="filterShow"
|
||||
>{{ $t("user.filter")
|
||||
}}<template v-if="filterTexts.length">
|
||||
({{ cacheCondition.length }})
|
||||
</template>
|
||||
</deBtn>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="filter-texts" v-if="filterTexts.length">
|
||||
<span class="sum">{{ paginationConfig.total }}</span>
|
||||
<span class="title">{{ $t("user.result_one") }}</span>
|
||||
<el-divider direction="vertical"></el-divider>
|
||||
<i
|
||||
@click="scrollPre"
|
||||
v-if="showScroll"
|
||||
class="el-icon-arrow-left arrow-filter"
|
||||
></i>
|
||||
<div class="filter-texts-container">
|
||||
<p class="text" v-for="(ele, index) in filterTexts" :key="ele">
|
||||
{{ ele }} <i @click="clearOneFilter(index)" class="el-icon-close"></i>
|
||||
</p>
|
||||
</div>
|
||||
<i
|
||||
@click="scrollNext"
|
||||
v-if="showScroll"
|
||||
class="el-icon-arrow-right arrow-filter"
|
||||
></i>
|
||||
<el-button
|
||||
type="text"
|
||||
class="clear-btn"
|
||||
icon="el-icon-delete"
|
||||
@click="clearFilter"
|
||||
>{{ $t("user.clear_filter") }}</el-button
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
class="table-container"
|
||||
id="resize-for-filter"
|
||||
:class="[filterTexts.length ? 'table-container-filter' : '']"
|
||||
>
|
||||
<template #toolbar>
|
||||
<el-button v-permission="['log:export']" icon="el-icon-download" size="mini" @click="exportConfirm">{{ $t('log.export') }}</el-button>
|
||||
</template>
|
||||
|
||||
<el-table-column :show-overflow-tooltip="true" prop="opType" :label="$t('log.optype')" width="140">
|
||||
<template v-slot:default="{row}">
|
||||
<span>{{ row.opType + row.sourceType }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :show-overflow-tooltip="true" prop="detail" :label="$t('log.detail')" />
|
||||
<el-table-column :show-overflow-tooltip="true" prop="user" :label="$t('log.user')" width="100" />
|
||||
<el-table-column :show-overflow-tooltip="true" prop="time" sortable="custom" :label="$t('log.time')" width="180">
|
||||
<template v-slot:default="scope">
|
||||
<span>{{ scope.row.time | timestampFormatDate }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</complex-table>
|
||||
</layout-content>
|
||||
<grid-table
|
||||
v-loading="$store.getters.loadingMap[$store.getters.currentPath]"
|
||||
:tableData="data"
|
||||
:columns="[]"
|
||||
:pagination="paginationConfig"
|
||||
@sort-change="sortChange"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
>
|
||||
<el-table-column
|
||||
show-overflow-tooltip
|
||||
prop="opType"
|
||||
:label="$t('log.optype')"
|
||||
width="140"
|
||||
>
|
||||
<template v-slot:default="{ row }">
|
||||
<span>{{ row.opType + row.sourceType }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
show-overflow-tooltip
|
||||
prop="detail"
|
||||
:label="$t('log.detail')"
|
||||
/>
|
||||
<el-table-column
|
||||
show-overflow-tooltip
|
||||
prop="user"
|
||||
:label="$t('log.user')"
|
||||
width="100"
|
||||
/>
|
||||
<el-table-column
|
||||
show-overflow-tooltip
|
||||
prop="time"
|
||||
sortable="custom"
|
||||
:label="$t('log.time')"
|
||||
width="180"
|
||||
>
|
||||
<template v-slot:default="scope">
|
||||
<span>{{ scope.row.time | timestampFormatDate }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</grid-table>
|
||||
</div>
|
||||
<keep-alive>
|
||||
<filterUser ref="filterUser" @search="filterDraw"></filterUser>
|
||||
</keep-alive>
|
||||
</de-layout-content>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import LayoutContent from '@/components/business/LayoutContent'
|
||||
import ComplexTable from '@/components/business/complex-table'
|
||||
import { formatCondition, formatQuickCondition, addOrder, formatOrders } from '@/utils/index'
|
||||
import { logGrid, opTypes, exportExcel } from '@/api/system/log'
|
||||
import DeLayoutContent from "@/components/business/DeLayoutContent";
|
||||
import GridTable from "@/components/gridTable/index.vue";
|
||||
import filterUser from './filterUser'
|
||||
import {
|
||||
formatCondition,
|
||||
formatQuickCondition,
|
||||
addOrder,
|
||||
formatOrders,
|
||||
} from "@/utils/index";
|
||||
import { logGrid, exportExcel } from "@/api/system/log";
|
||||
export default {
|
||||
|
||||
components: { ComplexTable, LayoutContent },
|
||||
components: { GridTable, DeLayoutContent, filterUser },
|
||||
data() {
|
||||
return {
|
||||
columns: [],
|
||||
|
||||
searchConfig: {
|
||||
useQuickSearch: false,
|
||||
useComplexSearch: true,
|
||||
quickPlaceholder: this.$t('log.search_by_key'),
|
||||
components: [
|
||||
{
|
||||
field: 'optype',
|
||||
label: this.$t('log.optype'),
|
||||
component: 'FuComplexMixSelect',
|
||||
options: [],
|
||||
multiple: true,
|
||||
class: 'de-log-filter',
|
||||
defaultOperator: 'in',
|
||||
filterable: true,
|
||||
'reserve-keyword': true
|
||||
},
|
||||
{ field: 'nick_name', label: this.$t('log.user'), component: 'DeComplexInput', class: 'de-log-filter' },
|
||||
|
||||
{ field: 'time', label: this.$t('log.time'), component: 'FuComplexDateTime', defaultOperator: 'between', class: 'de-log-filter' }
|
||||
|
||||
]
|
||||
},
|
||||
|
||||
paginationConfig: {
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
total: 0
|
||||
total: 0,
|
||||
},
|
||||
data: [],
|
||||
types: [],
|
||||
|
||||
orderConditions: [],
|
||||
last_condition: null
|
||||
|
||||
}
|
||||
nikeName: "",
|
||||
showScroll: false,
|
||||
filterTexts: [],
|
||||
cacheCondition: [],
|
||||
};
|
||||
},
|
||||
|
||||
created() {
|
||||
this.types = []
|
||||
opTypes().then(res => {
|
||||
const datas = res.data
|
||||
datas.forEach(item => {
|
||||
this.types.push({ 'label': item.name, 'value': item.id })
|
||||
})
|
||||
this.searchConfig.components[0].options = this.types
|
||||
})
|
||||
watch: {
|
||||
filterTexts: {
|
||||
handler() {
|
||||
this.getScrollStatus();
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.search()
|
||||
this.search();
|
||||
this.resizeObserver();
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
exportConfirm() {
|
||||
this.$confirm(this.$t('log.confirm'), '', {
|
||||
confirmButtonText: this.$t('commons.confirm'),
|
||||
cancelButtonText: this.$t('commons.cancel'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.exportData()
|
||||
}).catch(() => {
|
||||
// this.$info(this.$t('commons.delete_cancel'))
|
||||
this.$confirm(this.$t("log.confirm"), "", {
|
||||
confirmButtonText: this.$t("commons.confirm"),
|
||||
cancelButtonText: this.$t("commons.cancel"),
|
||||
type: "warning",
|
||||
})
|
||||
.then(() => {
|
||||
this.exportData();
|
||||
})
|
||||
.catch(() => {
|
||||
// this.$info(this.$t('commons.delete_cancel'))
|
||||
});
|
||||
},
|
||||
exportData() {
|
||||
let condition = this.last_condition
|
||||
condition = formatQuickCondition(condition, 'key')
|
||||
const temp = formatCondition(condition)
|
||||
const param = temp || {}
|
||||
param['orders'] = formatOrders(this.orderConditions)
|
||||
let condition = this.last_condition;
|
||||
condition = formatQuickCondition(condition, "key");
|
||||
const temp = formatCondition(condition);
|
||||
const param = temp || {};
|
||||
param["orders"] = formatOrders(this.orderConditions);
|
||||
|
||||
exportExcel(param).then(res => {
|
||||
const blob = new Blob([res], { type: 'application/vnd.ms-excel' })
|
||||
const link = document.createElement('a')
|
||||
link.style.display = 'none'
|
||||
link.href = URL.createObjectURL(blob)
|
||||
link.download = 'DataEase操作日志.xls' // 下载的文件名
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link)
|
||||
})
|
||||
exportExcel(param).then((res) => {
|
||||
const blob = new Blob([res], { type: "application/vnd.ms-excel" });
|
||||
const link = document.createElement("a");
|
||||
link.style.display = "none";
|
||||
link.href = URL.createObjectURL(blob);
|
||||
link.download = "DataEase操作日志.xls"; // 下载的文件名
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
});
|
||||
},
|
||||
|
||||
sortChange({ column, prop, order }) {
|
||||
this.orderConditions = []
|
||||
this.orderConditions = [];
|
||||
if (!order) {
|
||||
this.search(this.last_condition)
|
||||
return
|
||||
this.initSearch();
|
||||
return;
|
||||
}
|
||||
|
||||
this.orderConditions = []
|
||||
addOrder({ field: prop, value: order }, this.orderConditions)
|
||||
this.search(this.last_condition)
|
||||
this.orderConditions = [];
|
||||
addOrder({ field: prop, value: order }, this.orderConditions);
|
||||
this.initSearch();
|
||||
},
|
||||
select(selection) {
|
||||
|
||||
getScrollStatus() {
|
||||
this.$nextTick(() => {
|
||||
const dom = document.querySelector(".filter-texts-container");
|
||||
this.showScroll = dom && dom.scrollWidth > dom.offsetWidth;
|
||||
});
|
||||
},
|
||||
resizeObserver() {
|
||||
this.resizeForFilter = new ResizeObserver((entries) => {
|
||||
if (!this.filterTexts.length) return;
|
||||
this.layoutResize();
|
||||
});
|
||||
this.resizeForFilter.observe(
|
||||
document.querySelector("#resize-for-filter")
|
||||
);
|
||||
},
|
||||
layoutResize: _.debounce(function () {
|
||||
this.getScrollStatus();
|
||||
}, 200),
|
||||
scrollPre() {
|
||||
const dom = document.querySelector(".filter-texts-container");
|
||||
dom.scrollLeft -= 10;
|
||||
if (dom.scrollLeft <= 0) {
|
||||
dom.scrollLeft = 0;
|
||||
}
|
||||
},
|
||||
scrollNext() {
|
||||
const dom = document.querySelector(".filter-texts-container");
|
||||
dom.scrollLeft += 10;
|
||||
const width = dom.scrollWidth - dom.offsetWidth;
|
||||
if (dom.scrollLeft > width) {
|
||||
dom.scrollLeft = width;
|
||||
}
|
||||
},
|
||||
handleSizeChange(pageSize) {
|
||||
this.paginationConfig.currentPage = 1;
|
||||
this.paginationConfig.pageSize = pageSize;
|
||||
this.search();
|
||||
},
|
||||
handleCurrentChange(currentPage) {
|
||||
this.paginationConfig.currentPage = currentPage;
|
||||
this.search();
|
||||
},
|
||||
initSearch() {
|
||||
this.handleCurrentChange(1);
|
||||
},
|
||||
clearFilter() {
|
||||
this.$refs.filterUser.clearFilter();
|
||||
},
|
||||
clearOneFilter(index) {
|
||||
this.$refs.filterUser.clearOneFilter(index);
|
||||
this.$refs.filterUser.search();
|
||||
},
|
||||
filterDraw(condition, filterTexts = []) {
|
||||
this.cacheCondition = condition;
|
||||
this.filterTexts = filterTexts;
|
||||
this.initSearch();
|
||||
},
|
||||
filterShow() {
|
||||
this.$refs.filterUser.init();
|
||||
},
|
||||
search() {
|
||||
const param = {
|
||||
orders: formatOrders(this.orderConditions),
|
||||
conditions: [...this.cacheCondition],
|
||||
};
|
||||
if (this.nikeName) {
|
||||
param.conditions.push({
|
||||
field: `nick_name`,
|
||||
operator: "like",
|
||||
value: this.nikeName,
|
||||
});
|
||||
}
|
||||
const { currentPage, pageSize } = this.paginationConfig;
|
||||
logGrid(currentPage, pageSize, param).then((response) => {
|
||||
this.data = response.data.listObject;
|
||||
this.paginationConfig.total = response.data.itemCount;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.table-container {
|
||||
height: calc(100% - 50px);
|
||||
}
|
||||
|
||||
search(condition) {
|
||||
this.last_condition = condition
|
||||
condition = formatQuickCondition(condition, 'key')
|
||||
const temp = formatCondition(condition)
|
||||
const param = temp || {}
|
||||
param['orders'] = formatOrders(this.orderConditions)
|
||||
const { currentPage, pageSize } = this.paginationConfig
|
||||
logGrid(currentPage, pageSize, param).then(response => {
|
||||
this.data = response.data.listObject
|
||||
this.paginationConfig.total = response.data.itemCount
|
||||
})
|
||||
.table-container-filter {
|
||||
height: calc(100% - 110px);
|
||||
}
|
||||
.filter-texts {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 17px 0;
|
||||
font-family: "PingFang SC";
|
||||
font-weight: 400;
|
||||
|
||||
.sum {
|
||||
color: #1f2329;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #999999;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.text {
|
||||
max-width: 280px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
padding: 1px 22px 1px 6px;
|
||||
display: inline-block;
|
||||
align-items: center;
|
||||
color: #0c296e;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
border-radius: 2px;
|
||||
margin: 0;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
i {
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.clear-btn {
|
||||
color: #646a73;
|
||||
}
|
||||
|
||||
.clear-btn:hover {
|
||||
color: #3370ff;
|
||||
}
|
||||
|
||||
.filter-texts-container::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.arrow-filter {
|
||||
font-size: 16px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
cursor: pointer;
|
||||
color: #646a73;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.arrow-filter:hover {
|
||||
background: rgba(31, 35, 41, 0.1);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-right.arrow-filter {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-left.arrow-filter {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.filter-texts-container {
|
||||
flex: 1;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
.top-operate {
|
||||
margin-bottom: 16px;
|
||||
.right-user {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
|
||||
<style scoped>
|
||||
.de-button {
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.el-input--medium .el-input__icon {
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.name-email-search {
|
||||
width: 240px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -13,8 +13,8 @@
|
||||
clearable
|
||||
ref="search"
|
||||
v-model="nikeName"
|
||||
@blur="clearSearch"
|
||||
@clear="clearSearch"
|
||||
@blur="initSearch"
|
||||
@clear="initSearch"
|
||||
>
|
||||
</el-input>
|
||||
<deBtn
|
||||
@ -200,11 +200,6 @@ export default {
|
||||
this.destroyTimer();
|
||||
},
|
||||
methods: {
|
||||
clearSearch() {
|
||||
this.cachId = "";
|
||||
this.$emit("reset");
|
||||
this.initSearch();
|
||||
},
|
||||
exportConfirm() {
|
||||
this.$confirm(this.$t("log.confirm"), "", {
|
||||
confirmButtonText: this.$t("commons.confirm"),
|
||||
|
||||
@ -115,15 +115,7 @@
|
||||
<div class="filter">
|
||||
<span>{{ $t("dedaterange.label") }}</span>
|
||||
<div class="filter-item">
|
||||
<el-date-picker
|
||||
v-model="dataRange"
|
||||
size="small"
|
||||
type="daterange"
|
||||
range-separator=""
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
>
|
||||
</el-date-picker>
|
||||
<DeDatePick v-model="dataRange"></DeDatePick>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -143,8 +135,12 @@ import { filterDataset, dateFormat } from "./options";
|
||||
import { allRoles } from "@/api/system/user";
|
||||
import { getDatasetTree, treeByDatasetId } from "@/api/system/dept";
|
||||
import { queryAuthModel } from "@/api/authModel/authModel";
|
||||
import DeDatePick from '@/components/deCustomCm/deDatePick.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
DeDatePick
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
treeLoading: false,
|
||||
|
||||
@ -7,127 +7,120 @@
|
||||
v-closePress
|
||||
direction="rtl"
|
||||
>
|
||||
<div class="el-drawer__body-cont">
|
||||
|
||||
<div class="filter">
|
||||
<span>{{ $t("dataset.datalist") }}</span>
|
||||
<div class="filter-item">
|
||||
<span
|
||||
class="item"
|
||||
@click="activeDatasetChange(ele.id)"
|
||||
:class="[activeDataset.includes(ele.id) ? 'active' : '']"
|
||||
:key="ele.id"
|
||||
v-for="ele in selectDatasetsCahe"
|
||||
>{{ ele.name }}</span
|
||||
>
|
||||
<el-popover
|
||||
placement="bottom"
|
||||
popper-class="user-popper"
|
||||
width="200"
|
||||
trigger="click"
|
||||
>
|
||||
<div class="el-drawer__body-cont">
|
||||
<div class="filter">
|
||||
<span>{{ $t("dataset.datalist") }}</span>
|
||||
<div class="filter-item">
|
||||
<span
|
||||
class="item"
|
||||
@click="activeDatasetChange(ele.id)"
|
||||
:class="[activeDataset.includes(ele.id) ? 'active' : '']"
|
||||
:key="ele.id"
|
||||
v-for="ele in selectDatasetsCahe"
|
||||
>{{ ele.name }}</span
|
||||
>
|
||||
<el-popover
|
||||
placement="bottom"
|
||||
popper-class="user-popper dept"
|
||||
popper-class="user-popper"
|
||||
width="200"
|
||||
trigger="click"
|
||||
v-loading="treeLoading"
|
||||
>
|
||||
<el-tree
|
||||
ref="datasetTreeRef"
|
||||
current-node-key="id"
|
||||
:data="treeData"
|
||||
node-key="id"
|
||||
highlight-current
|
||||
:filter-node-method="filterNode"
|
||||
:expand-on-click-node="true"
|
||||
@node-click="nodeClick"
|
||||
<el-popover
|
||||
placement="bottom"
|
||||
popper-class="user-popper dept"
|
||||
width="200"
|
||||
trigger="click"
|
||||
v-loading="treeLoading"
|
||||
>
|
||||
<span slot-scope="{ data }" class="custom-tree-node">
|
||||
<span v-if="data.modelInnerType === 'group'">
|
||||
<svg-icon icon-class="scene" class="ds-icon-scene" />
|
||||
<span
|
||||
style="
|
||||
margin-left: 6px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
"
|
||||
:title="data.name"
|
||||
>{{ data.name }}</span
|
||||
>
|
||||
</span>
|
||||
<span v-else>
|
||||
<span>
|
||||
<svg-icon
|
||||
:icon-class="`ds-${data.modelInnerType}`"
|
||||
:class="`ds-icon-${data.modelInnerType}`"
|
||||
/>
|
||||
<el-tree
|
||||
ref="datasetTreeRef"
|
||||
current-node-key="id"
|
||||
:data="treeData"
|
||||
node-key="id"
|
||||
highlight-current
|
||||
:filter-node-method="filterNode"
|
||||
:expand-on-click-node="true"
|
||||
@node-click="nodeClick"
|
||||
>
|
||||
<span slot-scope="{ data }" class="custom-tree-node">
|
||||
<span v-if="data.modelInnerType === 'group'">
|
||||
<svg-icon icon-class="scene" class="ds-icon-scene" />
|
||||
<span
|
||||
style="
|
||||
margin-left: 6px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
"
|
||||
:title="data.name"
|
||||
>{{ data.name }}</span
|
||||
>
|
||||
</span>
|
||||
<span v-else>
|
||||
<span>
|
||||
<svg-icon
|
||||
:icon-class="`ds-${data.modelInnerType}`"
|
||||
:class="`ds-icon-${data.modelInnerType}`"
|
||||
/>
|
||||
</span>
|
||||
<span
|
||||
style="
|
||||
margin-left: 6px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
"
|
||||
:title="data.name"
|
||||
>{{ data.name }}</span
|
||||
>
|
||||
</span>
|
||||
<span
|
||||
style="
|
||||
margin-left: 6px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
"
|
||||
:title="data.name"
|
||||
>{{ data.name }}</span
|
||||
>
|
||||
</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
</el-tree>
|
||||
|
||||
<el-select
|
||||
ref="datasetSelect"
|
||||
v-model="selectDatasets"
|
||||
slot="reference"
|
||||
popper-class="tree-select"
|
||||
multiple
|
||||
:placeholder="$t('commons.please_select')"
|
||||
value-key="id"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in selectDatasets"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item"
|
||||
/>
|
||||
</el-select>
|
||||
<el-select
|
||||
ref="datasetSelect"
|
||||
v-model="selectDatasets"
|
||||
slot="reference"
|
||||
popper-class="tree-select"
|
||||
multiple
|
||||
:placeholder="$t('commons.please_select')"
|
||||
value-key="id"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in selectDatasets"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item"
|
||||
/>
|
||||
</el-select>
|
||||
</el-popover>
|
||||
<span class="more" slot="reference">+ {{ $t("panel.more") }}</span>
|
||||
</el-popover>
|
||||
<span class="more" slot="reference">+ {{ $t("panel.more") }}</span>
|
||||
</el-popover>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-for="ele in filterDataset" :key="ele.name" class="filter">
|
||||
<span>{{ $t(ele.name) }}</span>
|
||||
<div class="filter-item">
|
||||
<span
|
||||
class="item"
|
||||
@click="statusChange(item.value, ele.activeType)"
|
||||
:class="[active[ele.activeType].includes(item.value) ? 'active' : '']"
|
||||
:key="item.name"
|
||||
v-for="item in ele.list"
|
||||
>{{ $t(item.name) }}</span
|
||||
>
|
||||
<div v-for="ele in filterDataset" :key="ele.name" class="filter">
|
||||
<span>{{ $t(ele.name) }}</span>
|
||||
<div class="filter-item">
|
||||
<span
|
||||
class="item"
|
||||
@click="statusChange(item.value, ele.activeType)"
|
||||
:class="[
|
||||
active[ele.activeType].includes(item.value) ? 'active' : '',
|
||||
]"
|
||||
:key="item.name"
|
||||
v-for="item in ele.list"
|
||||
>{{ $t(item.name) }}</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="filter">
|
||||
<span>{{ $t("dedaterange.label") }}</span>
|
||||
<div class="filter-item">
|
||||
<el-date-picker
|
||||
v-model="dataRange"
|
||||
size="small"
|
||||
type="daterange"
|
||||
range-separator=""
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
>
|
||||
</el-date-picker>
|
||||
<div class="filter">
|
||||
<span>{{ $t("dedaterange.label") }}</span>
|
||||
<div class="filter-item">
|
||||
<DeDatePick v-model="dataRange"></DeDatePick>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="foot">
|
||||
<el-button class="btn normal" @click="reset">{{
|
||||
$t("commons.reset")
|
||||
@ -142,8 +135,12 @@
|
||||
<script>
|
||||
import { filterDatasetRecord, dateFormat } from "./options";
|
||||
import { queryAuthModel } from "@/api/authModel/authModel";
|
||||
import DeDatePick from "@/components/deCustomCm/deDatePick.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
DeDatePick,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
treeLoading: false,
|
||||
@ -197,7 +194,7 @@ export default {
|
||||
clearFilter() {
|
||||
this.active = {
|
||||
execStatus: [],
|
||||
}
|
||||
};
|
||||
this.dataRange = [];
|
||||
this.activeDataset = [];
|
||||
this.selectDatasets = [];
|
||||
@ -206,15 +203,15 @@ export default {
|
||||
this.$emit("search", [], []);
|
||||
},
|
||||
clearOneFilter(index) {
|
||||
(this.filterTextMap[index] || []).forEach(ele => {
|
||||
const eleKey = ele.split('.');
|
||||
(this.filterTextMap[index] || []).forEach((ele) => {
|
||||
const eleKey = ele.split(".");
|
||||
if (eleKey.length === 2) {
|
||||
const [p, c ] = eleKey;
|
||||
this[p][c] = []
|
||||
const [p, c] = eleKey;
|
||||
this[p][c] = [];
|
||||
} else {
|
||||
this[ele] = []
|
||||
this[ele] = [];
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
statusChange(value, type) {
|
||||
const statusIndex = this.active[type].findIndex((ele) => ele === value);
|
||||
@ -271,15 +268,14 @@ export default {
|
||||
"datasetCahe",
|
||||
]);
|
||||
}
|
||||
[
|
||||
"dataset.task.last_exec_status",
|
||||
].forEach((ele, index) => {
|
||||
const { activeType: type, list } =
|
||||
this.filterDataset[index];
|
||||
["dataset.task.last_exec_status"].forEach((ele, index) => {
|
||||
const { activeType: type, list } = this.filterDataset[index];
|
||||
if (this.active[type].length) {
|
||||
params.push(
|
||||
`${this.$t(ele)}:${this.active[type]
|
||||
.map((item) => this.$t(list.find((itx) => itx.value === item).name))
|
||||
.map((item) =>
|
||||
this.$t(list.find((itx) => itx.value === item).name)
|
||||
)
|
||||
.join("、")}`
|
||||
);
|
||||
this.filterTextMap.push([`active.${type}`]);
|
||||
@ -312,13 +308,13 @@ export default {
|
||||
});
|
||||
}
|
||||
});
|
||||
const [ min, max ] = this.dataRange;
|
||||
const [min, max] = this.dataRange;
|
||||
if (min && max) {
|
||||
conditions.push({
|
||||
field: 'dataset_table_task.last_exec_time',
|
||||
operator: "between",
|
||||
value: [ +min, +max ],
|
||||
})
|
||||
field: "dataset_table_task.last_exec_time",
|
||||
operator: "between",
|
||||
value: [+min, +max],
|
||||
});
|
||||
}
|
||||
return conditions;
|
||||
},
|
||||
@ -335,7 +331,6 @@ export default {
|
||||
|
||||
<style lang="scss">
|
||||
.user-drawer-task {
|
||||
|
||||
.el-drawer__body-cont {
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
@ -343,7 +338,7 @@ export default {
|
||||
width: 100%;
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
|
||||
|
||||
.el-drawer__header {
|
||||
padding: 16px 24px;
|
||||
margin: 0;
|
||||
@ -448,7 +443,7 @@ export default {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
text-align: right;
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
box-shadow: 0px -1px 4px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user