no message
This commit is contained in:
parent
1191b09328
commit
e143b1eb23
@ -15,16 +15,6 @@
|
||||
</ElCard>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.-mb-15px {
|
||||
margin-bottom: -15px;
|
||||
}
|
||||
|
||||
.contentwrap .el-card__body {
|
||||
padding: 2px 5px
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
|
||||
180
src/components/xStat/index.vue
Normal file
180
src/components/xStat/index.vue
Normal file
@ -0,0 +1,180 @@
|
||||
<!--
|
||||
* @Descripttion: 统计弹窗
|
||||
-->
|
||||
<template>
|
||||
<div class="x-stat">
|
||||
<component :is="componentType" :title="config.name || '查看统计'" v-model="visible" :size="size" :style="style" @closed="$emit('closed')">
|
||||
<el-main>
|
||||
<el-skeleton v-if="loading" :rows="4" />
|
||||
</el-main>
|
||||
<template #footer>
|
||||
|
||||
</template>
|
||||
</component>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped>
|
||||
.x-stat:deep(.el-drawer) .el-drawer__footer {
|
||||
text-align: left;
|
||||
border-top: 1px solid var(--el-border-color-light);
|
||||
padding: 10px 18px;
|
||||
}
|
||||
|
||||
.x-stat:deep(.el-main) {
|
||||
padding: 0 20px 0px 20px;
|
||||
}
|
||||
|
||||
.x-stat:deep(.el-input) .el-input__wrapper {
|
||||
min-width: 50px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
emits: ['success', 'closed'],
|
||||
props: {
|
||||
column: { type: Array, default: () => [] },
|
||||
name: { type: String, default: "id" },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
mode: "plus",
|
||||
token: '',
|
||||
key: this.name,
|
||||
titleMap: {
|
||||
plus: '新增',
|
||||
edit: '编辑'
|
||||
},
|
||||
data: {},
|
||||
style: {},
|
||||
config: {
|
||||
column: this.column,
|
||||
labelPosition: "right",
|
||||
labelWidth: "120px",
|
||||
size: "medium",
|
||||
submitinfokey: "info",
|
||||
url: '',
|
||||
merge: false, // 远程数据时, 是否合并data
|
||||
submitname: '保存'
|
||||
},
|
||||
size: 900,
|
||||
visible: false,
|
||||
isSaveing: false,
|
||||
type: 'dialog',
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
column() {
|
||||
this.config.column = this.column;
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
componentType() {
|
||||
return this.type == 'drawer' ? 'el-drawer' : 'x-dialog';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
getComponentType(type) {
|
||||
this.type = type;
|
||||
return this;
|
||||
},
|
||||
// 显示
|
||||
open(mode = 'plus') {
|
||||
this.mode = mode;
|
||||
this.visible = true;
|
||||
return this;
|
||||
},
|
||||
// 表单提交方法
|
||||
submit() {
|
||||
|
||||
|
||||
this.$refs.formref.validate(async (valid) => {
|
||||
if (valid) {
|
||||
if (!this.config.url) {
|
||||
console.log(this.data)
|
||||
this.$alert('没有' + (this.config.name || '统计') + '数据相关配置', "提示", { type: 'error' });
|
||||
return;
|
||||
}
|
||||
|
||||
const data = {
|
||||
[this.config.submitinfokey || 'info']: this.data,
|
||||
};
|
||||
|
||||
if (this.key && typeof this.data[this.key] !== 'undefined') {
|
||||
Object.assign(data, { [this.key]: this.data[this.key] });
|
||||
}
|
||||
|
||||
if (this.token) {
|
||||
Object.assign(data, { token: this.token });
|
||||
}
|
||||
|
||||
this.isSaveing = true;
|
||||
this.$http.post(this.config.url, data).then((res) => {
|
||||
this.isSaveing = false;
|
||||
if (res.code == 200) {
|
||||
this.visible = false;
|
||||
this.$emit('success', res.data, this.mode, res.message || "操作成功");
|
||||
return;
|
||||
}
|
||||
this.$alert(res.message, "提示", { type: 'error' });
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 配置
|
||||
setConfig(o) {
|
||||
Object.assign(this.config, o);
|
||||
|
||||
if (typeof this.config.key !== 'undefined' && this.config.key) {
|
||||
this.key = this.config.key;
|
||||
}
|
||||
// 远程读取数据
|
||||
if (this.config.remoteurl) {
|
||||
this.loading = true;
|
||||
setTimeout(async () => {
|
||||
var res = await this.$http.post(this.config.remoteurl, { [this.key]: this.data[this.key] })
|
||||
if (res.code == 200) {
|
||||
this.loading = false;
|
||||
if (res.data.config) {
|
||||
Object.assign(this.config, res.data.config);
|
||||
}
|
||||
|
||||
if (res.data.data) {
|
||||
this.config.merge ? Object.assign(this.data, res.data.data) : this.setData(res.data.data)
|
||||
}
|
||||
|
||||
if (res.data.token) {
|
||||
this.token = res.data.token
|
||||
}
|
||||
|
||||
if (res.data.size) {
|
||||
this.size = res.data.size
|
||||
}
|
||||
|
||||
if (res.data.type && res.data.type !== this.type) {
|
||||
this.getComponentType(res.data.type)
|
||||
}
|
||||
|
||||
if (res.data.style) {
|
||||
this.style = res.data.style;
|
||||
}
|
||||
return;
|
||||
}
|
||||
this.visible = false;
|
||||
this.$alert(res.message, "提示", { type: 'error' });
|
||||
}, 100)
|
||||
return false;
|
||||
}
|
||||
},
|
||||
// 表单注入数据
|
||||
setData(data) {
|
||||
this.data = data;
|
||||
return this;
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -2,7 +2,7 @@
|
||||
<div style="display: flex;">
|
||||
<el-badge v-if="item.status && item.status.key && row[item.status.key]" is-dot class="item" :type="item.status.type || 'primary'" style="width: 10px;cursor: pointer;margin-top: 10px;"></el-badge>
|
||||
<x-avatar v-if="item.columntype == 'avatar' || item.component == 'avatar'" :name="item.name" :options="item.options" :data="row"></x-avatar>
|
||||
<el-badge v-else-if="item.columntype == 'badge' || item.columntype == 'imagegroup'" :value="getType(row[item.name])" @click="handleClick(row, item)" v-bind="item.options"></el-badge>
|
||||
<el-badge v-else-if="item.columntype == 'badge' || item.columntype == 'imagegroup'" :value="getType(row[item.name])" @click="handleClick(row, item)" v-bind="item.options" style="cursor: pointer; "></el-badge>
|
||||
<el-image v-else-if="item.columntype == 'image'" :preview-src-list="[getImg(row[item.name])]" :preview-teleported="true" hide-on-click-modal="true" lazy="true" style="max-width: 60px; height: 26px; border-radius: 2px;" fit="cover" :src="getImg(row[item.name])">
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
@ -13,24 +13,21 @@
|
||||
<input v-else-if="item.columntype == 'input'" @click="handleClick(row, item)" style="cursor: pointer; " class="el-input__inner" type="text" readonly :value="row[item.name]">
|
||||
<p v-else-if="item.columntype == 'status'">
|
||||
<template v-for="{ value, type = 'success', label } in item.options.items">
|
||||
<x-status-indicator :key="value" pulse :type="type || 'success'" :label="label" @click="handleClick(row, item)" v-if="value == row[item.name]"></x-status-indicator>
|
||||
<x-status-indicator :key="value" pulse :type="type" :label="label" @click="handleClick(row, item)" v-if="value == row[item.name]"></x-status-indicator>
|
||||
</template>
|
||||
</p>
|
||||
|
||||
<p v-else-if="item.columntype == 'button' && item.options.items && item.options.items.length > 0">
|
||||
<template v-for="op in item.options.items">
|
||||
<el-button @click="handleClick(row, op.options || item)" :key="op.value" :type="op.type || 'warning'" v-bind="op" v-if="op.value == row[item.name]">
|
||||
<el-button @click="handleClick(row, op.options || item)" :key="op.value" :type="op.type || 'warning'" :size="op.size || 'small'" v-bind="op" v-if="op.value == row[item.name]">
|
||||
{{ op.label }}
|
||||
</el-button>
|
||||
</template>
|
||||
</p>
|
||||
|
||||
<p v-else-if="item.columntype == 'button'">
|
||||
<el-button @click="handleClick(row, item)" :type="item.options.type || 'warning'" v-bind="item.options"> {{ row[item.name] }} </el-button>
|
||||
</p>
|
||||
|
||||
<p v-else-if="item.columntype == 'tag' || item.columntype == 'time'" @click="handleClick(row, item)" v-time.tip="row[item.name]"></p>
|
||||
|
||||
<slot v-else :name="item.name">
|
||||
{{ item.columntype == 'select' && item.options && item.options.items ? getNameByValue(row[item.name], item.options.items) : row[item.name] }}
|
||||
</slot>
|
||||
|
||||
@ -229,13 +229,22 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
<style scoped>
|
||||
.xtable:deep(.el-card__body) {
|
||||
padding: 2px 5px
|
||||
}
|
||||
|
||||
.-mb-15px {
|
||||
margin-bottom: -15px;
|
||||
}
|
||||
|
||||
.tableexpandhtml img {
|
||||
max-width: calc(100% - 30%);
|
||||
max-height: 120px;
|
||||
}
|
||||
|
||||
.expandtextarea .el-textarea__inner {
|
||||
|
||||
.expandtextarea:deep(.el-textarea__inner) {
|
||||
box-shadow: none
|
||||
}
|
||||
|
||||
@ -248,28 +257,16 @@ export default {
|
||||
padding: 0px 2px 0;
|
||||
}
|
||||
|
||||
.xtable .xtabletabs .el-tabs__nav {
|
||||
.xtable .xtabletabs:deep(.el-tabs__nav) {
|
||||
padding: 10px
|
||||
}
|
||||
|
||||
.xtable .mt-10px {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.xtable .mb-10px {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.xtable .float-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.xtable .xtabletabs .el-tabs__header {
|
||||
.xtable .xtabletabs:deep(.el-tabs__header) {
|
||||
margin: 0 0 2px;
|
||||
}
|
||||
|
||||
.xtable .xtabletabs .el-tabs__nav-next,
|
||||
.xtable .xtabletabs .el-tabs__nav-prev {
|
||||
.xtable .xtabletabs:deep(.el-tabs__nav-next),
|
||||
.xtable .xtabletabs:deep(.el-tabs__nav-prev) {
|
||||
padding: 10px 0;
|
||||
}
|
||||
</style>
|
||||
@ -1,7 +1,20 @@
|
||||
<template>
|
||||
<x-user v-model="user"></x-user>
|
||||
<el-container style="padding: 10px 10px 5px 10px;">
|
||||
<el-container class="container">
|
||||
<x-user v-model="user"></x-user>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.container {
|
||||
border: 1px solid var(--el-border-color-light);
|
||||
border-radius: 4px;
|
||||
background-color: var(--el-fill-color-blank);
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'userCenter',
|
||||
|
||||
Loading…
Reference in New Issue
Block a user