1、Radio字典组件修改兼容
This commit is contained in:
cuiyouliang
parent
27da33c2c7
commit
ebddfec229
21
src/components/DictData/index.js
Normal file
21
src/components/DictData/index.js
Normal file
@ -0,0 +1,21 @@
|
||||
import Vue from 'vue';
|
||||
import DataDict from '@/utils/dictionary';
|
||||
import { getDicts as getDicts } from '@/api/system/dict/data';
|
||||
|
||||
function install() {
|
||||
Vue.use(DataDict, {
|
||||
metas: {
|
||||
'*': {
|
||||
labelField: 'dictLabel',
|
||||
valueField: 'dictValue',
|
||||
request(dictMeta) {
|
||||
return getDicts(dictMeta.type).then((res) => res.data);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
export default {
|
||||
install
|
||||
};
|
||||
55
src/components/DictRadio/index.vue
Normal file
55
src/components/DictRadio/index.vue
Normal file
@ -0,0 +1,55 @@
|
||||
<template>
|
||||
<el-radio-group v-model="radioValue" @change="change" v-bind="$props">
|
||||
<el-radio-button v-for="dict in dictList" :key="dict.value" :label="dict.value">{{ dict.label }}</el-radio-button>
|
||||
</el-radio-group>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDicts } from '@/api/system/dict/data';
|
||||
export default {
|
||||
props: ['radioData', 'size', 'value', 'showAll', 'filter'],
|
||||
data() {
|
||||
return {
|
||||
dictList: []
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
radioValue: {
|
||||
get() {
|
||||
return this.value;
|
||||
},
|
||||
set(v) {
|
||||
this.$emit('input', v);
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.radioData) {
|
||||
this.getEmuList();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
change(val) {
|
||||
this.$emit('change', val);
|
||||
},
|
||||
|
||||
getEmuList() {
|
||||
getDicts(this.radioData)
|
||||
.then((res) => {
|
||||
const { code, data = [] } = res || {};
|
||||
if (code == 200) {
|
||||
const dicArr = data.map((p) => {
|
||||
return { label: p.dictLabel, value: p.dictValue, elTagType: p.listClass, elTagClass: p.cssClass };
|
||||
});
|
||||
this.dictList = dicArr || [];
|
||||
} else {
|
||||
this.dictList = [];
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
this.dictList = [];
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
39
src/components/DictSelect/index.vue
Normal file
39
src/components/DictSelect/index.vue
Normal file
@ -0,0 +1,39 @@
|
||||
<template>
|
||||
<el-select v-model="value1" clearable>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item[valueProp1]"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters} from "vuex";
|
||||
|
||||
export default {
|
||||
props: ["size", "value", "propName", 'valueProp'],
|
||||
computed: {
|
||||
...mapGetters(['dictMap']),
|
||||
valueProp1() {
|
||||
return this.valueProp || 'value';
|
||||
},
|
||||
value1: {
|
||||
get() {
|
||||
return this.value;
|
||||
},
|
||||
set(v) {
|
||||
this.$emit("input", v);
|
||||
},
|
||||
},
|
||||
options() {
|
||||
if (!this.propName) {
|
||||
return [];
|
||||
}
|
||||
return this.dictMap[this.propName] || []
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
190
src/components/HeaderSearch/index.vue
Normal file
190
src/components/HeaderSearch/index.vue
Normal file
@ -0,0 +1,190 @@
|
||||
<template>
|
||||
<div :class="{'show':show}" class="header-search">
|
||||
<svg-icon class-name="search-icon" icon-class="search" @click.stop="click" />
|
||||
<el-select
|
||||
ref="headerSearchSelect"
|
||||
v-model="search"
|
||||
:remote-method="querySearch"
|
||||
filterable
|
||||
default-first-option
|
||||
remote
|
||||
placeholder="Search"
|
||||
class="header-search-select"
|
||||
@change="change"
|
||||
>
|
||||
<el-option v-for="option in options" :key="option.item.path" :value="option.item" :label="option.item.title.join(' > ')" />
|
||||
</el-select>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// fuse is a lightweight fuzzy-search module
|
||||
// make search results more in line with expectations
|
||||
import Fuse from 'fuse.js/dist/fuse.min.js'
|
||||
import path from 'path'
|
||||
|
||||
export default {
|
||||
name: 'HeaderSearch',
|
||||
data() {
|
||||
return {
|
||||
search: '',
|
||||
options: [],
|
||||
searchPool: [],
|
||||
show: false,
|
||||
fuse: undefined
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
routes() {
|
||||
return this.$store.getters.permission_routes
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
routes() {
|
||||
this.searchPool = this.generateRoutes(this.routes)
|
||||
},
|
||||
searchPool(list) {
|
||||
this.initFuse(list)
|
||||
},
|
||||
show(value) {
|
||||
if (value) {
|
||||
document.body.addEventListener('click', this.close)
|
||||
} else {
|
||||
document.body.removeEventListener('click', this.close)
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.searchPool = this.generateRoutes(this.routes)
|
||||
},
|
||||
methods: {
|
||||
click() {
|
||||
this.show = !this.show
|
||||
if (this.show) {
|
||||
this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.focus()
|
||||
}
|
||||
},
|
||||
close() {
|
||||
this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.blur()
|
||||
this.options = []
|
||||
this.show = false
|
||||
},
|
||||
change(val) {
|
||||
const path = val.path;
|
||||
if(this.ishttp(val.path)) {
|
||||
// http(s):// 路径新窗口打开
|
||||
const pindex = path.indexOf("http");
|
||||
window.open(path.substr(pindex, path.length), "_blank");
|
||||
} else {
|
||||
this.$router.push(val.path)
|
||||
}
|
||||
this.search = ''
|
||||
this.options = []
|
||||
this.$nextTick(() => {
|
||||
this.show = false
|
||||
})
|
||||
},
|
||||
initFuse(list) {
|
||||
this.fuse = new Fuse(list, {
|
||||
shouldSort: true,
|
||||
threshold: 0.4,
|
||||
location: 0,
|
||||
distance: 100,
|
||||
maxPatternLength: 32,
|
||||
minMatchCharLength: 1,
|
||||
keys: [{
|
||||
name: 'title',
|
||||
weight: 0.7
|
||||
}, {
|
||||
name: 'path',
|
||||
weight: 0.3
|
||||
}]
|
||||
})
|
||||
},
|
||||
// Filter out the routes that can be displayed in the sidebar
|
||||
// And generate the internationalized title
|
||||
generateRoutes(routes, basePath = '/', prefixTitle = []) {
|
||||
let res = []
|
||||
|
||||
for (const router of routes) {
|
||||
// skip hidden router
|
||||
if (router.hidden) { continue }
|
||||
|
||||
const data = {
|
||||
path: !this.ishttp(router.path) ? path.resolve(basePath, router.path) : router.path,
|
||||
title: [...prefixTitle]
|
||||
}
|
||||
|
||||
if (router.meta && router.meta.title) {
|
||||
data.title = [...data.title, router.meta.title]
|
||||
|
||||
if (router.redirect !== 'noRedirect') {
|
||||
// only push the routes with title
|
||||
// special case: need to exclude parent router without redirect
|
||||
res.push(data)
|
||||
}
|
||||
}
|
||||
|
||||
// recursive child routes
|
||||
if (router.children) {
|
||||
const tempRoutes = this.generateRoutes(router.children, data.path, data.title)
|
||||
if (tempRoutes.length >= 1) {
|
||||
res = [...res, ...tempRoutes]
|
||||
}
|
||||
}
|
||||
}
|
||||
return res
|
||||
},
|
||||
querySearch(query) {
|
||||
if (query !== '') {
|
||||
this.options = this.fuse.search(query)
|
||||
} else {
|
||||
this.options = []
|
||||
}
|
||||
},
|
||||
ishttp(url) {
|
||||
return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.header-search {
|
||||
font-size: 0 !important;
|
||||
|
||||
.search-icon {
|
||||
cursor: pointer;
|
||||
font-size: 18px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.header-search-select {
|
||||
font-size: 18px;
|
||||
transition: width 0.2s;
|
||||
width: 0;
|
||||
overflow: hidden;
|
||||
background: transparent;
|
||||
border-radius: 0;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
border-radius: 0;
|
||||
border: 0;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
box-shadow: none !important;
|
||||
border-bottom: 1px solid #d9d9d9;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
&.show {
|
||||
.header-search-select {
|
||||
width: 210px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
18
src/components/InBody/InBody.vue
Normal file
18
src/components/InBody/InBody.vue
Normal file
@ -0,0 +1,18 @@
|
||||
<template>
|
||||
<div class="pagination-common">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'InBody',
|
||||
mounted() {
|
||||
const node = this.$mount().$el
|
||||
document.body.appendChild(node)
|
||||
},
|
||||
destroyed() {
|
||||
const node = this.$mount().$el
|
||||
node.remove()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
55
src/components/InOutTypeSelect.vue
Normal file
55
src/components/InOutTypeSelect.vue
Normal file
@ -0,0 +1,55 @@
|
||||
<template lang="pug">
|
||||
.item-select-wrapper
|
||||
el-select(
|
||||
v-model="value1"
|
||||
clearable
|
||||
:size="size"
|
||||
)
|
||||
el-option(
|
||||
v-for="item in opTypes"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
)
|
||||
div {{item.label}}
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
let optionsCache = null
|
||||
export default {
|
||||
name: 'InOutTypeSelect',
|
||||
props: {
|
||||
value: {
|
||||
type: [String, Number],
|
||||
default: null
|
||||
},
|
||||
size: {
|
||||
type: String,
|
||||
default: 'small'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['opTypes']),
|
||||
value1: {
|
||||
get() {
|
||||
return this.value
|
||||
},
|
||||
set(v) {
|
||||
this.$emit('input', v)
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus">
|
||||
|
||||
</style>
|
||||
67
src/components/NumberRange.vue
Normal file
67
src/components/NumberRange.vue
Normal file
@ -0,0 +1,67 @@
|
||||
<template lang="pug">
|
||||
.number-range-wrapper
|
||||
el-input.start(:value="value1[0]" @input="changeVal(0, $event)" placeholder="起始值")
|
||||
.c-line
|
||||
span -
|
||||
el-input.end(:value="value1[1]" @input="changeVal(1, $event)" placeholder="结束值")
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'NumberRange',
|
||||
props: {
|
||||
value: {
|
||||
type: Array,
|
||||
default: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
value1: {
|
||||
get() {
|
||||
return this.value || []
|
||||
},
|
||||
set(v) {
|
||||
this.$emit('input', v);
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeVal(idx, v) {
|
||||
const val = [...this.value1];
|
||||
val[idx] = v ? Number(v) : null;
|
||||
this.value1 = val;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus">
|
||||
.number-range-wrapper
|
||||
max-width 240px
|
||||
display inline-flex
|
||||
align-items stretch
|
||||
line-height 1
|
||||
.c-line
|
||||
border-top 1px solid #DCDFE6
|
||||
border-bottom 1px solid #DCDFE6
|
||||
padding 0 8px
|
||||
margin 0 -1px
|
||||
color #DCDFE6
|
||||
z-index 1
|
||||
background-color white
|
||||
display inline-flex
|
||||
align-items center
|
||||
user-select none
|
||||
.start
|
||||
.el-input__inner
|
||||
border-top-right-radius 0!important
|
||||
border-bottom-right-radius 0!important
|
||||
&:hover
|
||||
z-index 2
|
||||
.end
|
||||
.el-input__inner
|
||||
border-top-left-radius 0!important
|
||||
border-bottom-left-radius 0!important
|
||||
&:hover
|
||||
z-index 2
|
||||
</style>
|
||||
208
src/components/OssImageUpload/index.vue
Normal file
208
src/components/OssImageUpload/index.vue
Normal file
@ -0,0 +1,208 @@
|
||||
<template>
|
||||
<div class="component-upload-image">
|
||||
<el-upload
|
||||
multiple
|
||||
:action="uploadImgUrl"
|
||||
list-type="picture-card"
|
||||
:on-success="handleUploadSuccess"
|
||||
:before-upload="handleBeforeUpload"
|
||||
:limit="limit"
|
||||
:on-error="handleUploadError"
|
||||
:on-exceed="handleExceed"
|
||||
name="file"
|
||||
:on-remove="handleRemove"
|
||||
:show-file-list="true"
|
||||
:headers="headers"
|
||||
:file-list="fileList"
|
||||
:on-preview="handlePictureCardPreview"
|
||||
:class="{hide: this.fileList.length >= this.limit}"
|
||||
>
|
||||
<i class="el-icon-plus"></i>
|
||||
</el-upload>
|
||||
|
||||
<!-- 上传提示 -->
|
||||
<div class="el-upload__tip" slot="tip" v-if="showTip">
|
||||
请上传
|
||||
<template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> </template>
|
||||
<template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b> </template>
|
||||
的文件
|
||||
</div>
|
||||
|
||||
<el-dialog
|
||||
:visible.sync="dialogVisible"
|
||||
title="预览"
|
||||
width="800"
|
||||
append-to-body
|
||||
>
|
||||
<img
|
||||
:src="dialogImageUrl"
|
||||
style="display: block; max-width: 100%; margin: 0 auto"
|
||||
/>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getToken } from "@/utils/auth";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
value: [String, Object, Array],
|
||||
// 图片数量限制
|
||||
limit: {
|
||||
type: Number,
|
||||
default: 5,
|
||||
},
|
||||
// 大小限制(MB)
|
||||
fileSize: {
|
||||
type: Number,
|
||||
default: 5,
|
||||
},
|
||||
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
||||
fileType: {
|
||||
type: Array,
|
||||
default: () => ["png", "jpg", "jpeg"],
|
||||
},
|
||||
// 是否显示提示
|
||||
isShowTip: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
number: 0,
|
||||
uploadList: [],
|
||||
dialogImageUrl: "",
|
||||
dialogVisible: false,
|
||||
hideUpload: false,
|
||||
baseUrl: process.env.VUE_APP_BASE_API,
|
||||
uploadImgUrl: process.env.VUE_APP_BASE_API + "/oss/upload", // 上传的图片服务器地址
|
||||
headers: {
|
||||
Authorization: "Bearer " + getToken(),
|
||||
},
|
||||
fileList: []
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
value: {
|
||||
handler(val) {
|
||||
if (val) {
|
||||
// 首先将值转为数组
|
||||
const list = Array.isArray(val) ? val : this.value.split(',');
|
||||
// 然后将数组转为对象数组
|
||||
this.fileList = list.map(item => {
|
||||
if (typeof item === "string") {
|
||||
item = { name: item, url: item };
|
||||
}
|
||||
return item;
|
||||
});
|
||||
} else {
|
||||
this.fileList = [];
|
||||
return [];
|
||||
}
|
||||
},
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 是否显示提示
|
||||
showTip() {
|
||||
return this.isShowTip && (this.fileType || this.fileSize);
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 删除图片
|
||||
handleRemove(file, fileList) {
|
||||
const findex = this.fileList.map(f => f.name).indexOf(file.name);
|
||||
if(findex > -1) {
|
||||
this.fileList.splice(findex, 1);
|
||||
this.$emit("input", this.listToString(this.fileList));
|
||||
}
|
||||
},
|
||||
// 上传成功回调
|
||||
handleUploadSuccess(res) {
|
||||
this.uploadList.push({ name: res.fileName, url: res.url });
|
||||
if (this.uploadList.length === this.number) {
|
||||
this.fileList = this.fileList.concat(this.uploadList);
|
||||
this.uploadList = [];
|
||||
this.number = 0;
|
||||
this.$emit("input", this.listToString(this.fileList));
|
||||
this.$modal.closeLoading();
|
||||
}
|
||||
},
|
||||
// 上传前loading加载
|
||||
handleBeforeUpload(file) {
|
||||
let isImg = false;
|
||||
if (this.fileType.length) {
|
||||
let fileExtension = "";
|
||||
if (file.name.lastIndexOf(".") > -1) {
|
||||
fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
|
||||
}
|
||||
isImg = this.fileType.some(type => {
|
||||
if (file.type.indexOf(type) > -1) return true;
|
||||
if (fileExtension && fileExtension.indexOf(type) > -1) return true;
|
||||
return false;
|
||||
});
|
||||
} else {
|
||||
isImg = file.type.indexOf("image") > -1;
|
||||
}
|
||||
|
||||
if (!isImg) {
|
||||
this.$modal.msgError(`文件格式不正确, 请上传${this.fileType.join("/")}图片格式文件!`);
|
||||
return false;
|
||||
}
|
||||
if (this.fileSize) {
|
||||
const isLt = file.size / 1024 / 1024 < this.fileSize;
|
||||
if (!isLt) {
|
||||
this.$modal.msgError(`上传头像图片大小不能超过 ${this.fileSize} MB!`);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
this.$modal.loading("正在上传图片，请稍候...");
|
||||
this.number++;
|
||||
},
|
||||
// 文件个数超出
|
||||
handleExceed() {
|
||||
this.$modal.msgError(`上传文件数量不能超过 ${this.limit} 个!`);
|
||||
},
|
||||
// 上传失败
|
||||
handleUploadError() {
|
||||
this.$modal.msgError("上传图片失败，请重试");
|
||||
this.$modal.closeLoading();
|
||||
},
|
||||
// 预览
|
||||
handlePictureCardPreview(file) {
|
||||
this.dialogImageUrl = file.url;
|
||||
this.dialogVisible = true;
|
||||
},
|
||||
// 对象转成指定字符串分隔
|
||||
listToString(list, separator) {
|
||||
let strs = "";
|
||||
separator = separator || ",";
|
||||
for (let i in list) {
|
||||
strs += list[i].url.replace(this.baseUrl, "") + separator;
|
||||
}
|
||||
return strs != '' ? strs.substr(0, strs.length - 1) : '';
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
// .el-upload--picture-card 控制加号部分
|
||||
::v-deep.hide .el-upload--picture-card {
|
||||
display: none;
|
||||
}
|
||||
// 去掉动画效果
|
||||
::v-deep .el-list-enter-active,
|
||||
::v-deep .el-list-leave-active {
|
||||
transition: all 0s;
|
||||
}
|
||||
|
||||
::v-deep .el-list-enter, .el-list-leave-active {
|
||||
opacity: 0;
|
||||
transform: translateY(0);
|
||||
}
|
||||
</style>
|
||||
|
||||
142
src/components/PanThumb/index.vue
Normal file
142
src/components/PanThumb/index.vue
Normal file
@ -0,0 +1,142 @@
|
||||
<template>
|
||||
<div :style="{zIndex:zIndex,height:height,width:width}" class="pan-item">
|
||||
<div class="pan-info">
|
||||
<div class="pan-info-roles-container">
|
||||
<slot />
|
||||
</div>
|
||||
</div>
|
||||
<!-- eslint-disable-next-line -->
|
||||
<div :style="{backgroundImage: `url(${image})`}" class="pan-thumb"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'PanThumb',
|
||||
props: {
|
||||
image: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
zIndex: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
width: {
|
||||
type: String,
|
||||
default: '150px'
|
||||
},
|
||||
height: {
|
||||
type: String,
|
||||
default: '150px'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.pan-item {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
cursor: default;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.pan-info-roles-container {
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pan-thumb {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
transform-origin: 95% 40%;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
/* .pan-thumb:after {
|
||||
content: '';
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
top: 40%;
|
||||
left: 95%;
|
||||
margin: -4px 0 0 -4px;
|
||||
background: radial-gradient(ellipse at center, rgba(14, 14, 14, 1) 0%, rgba(125, 126, 125, 1) 100%);
|
||||
box-shadow: 0 0 1px rgba(255, 255, 255, 0.9);
|
||||
} */
|
||||
|
||||
.pan-info {
|
||||
position: absolute;
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
box-shadow: inset 0 0 0 5px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.pan-info h3 {
|
||||
color: #fff;
|
||||
text-transform: uppercase;
|
||||
position: relative;
|
||||
letter-spacing: 2px;
|
||||
font-size: 18px;
|
||||
margin: 0 60px;
|
||||
padding: 22px 0 0 0;
|
||||
height: 85px;
|
||||
font-family: 'Open Sans', Arial, sans-serif;
|
||||
text-shadow: 0 0 1px #fff, 0 1px 2px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.pan-info p {
|
||||
color: #fff;
|
||||
padding: 10px 5px;
|
||||
font-style: italic;
|
||||
margin: 0 30px;
|
||||
font-size: 12px;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.pan-info p a {
|
||||
display: block;
|
||||
color: #333;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
font-size: 9px;
|
||||
letter-spacing: 1px;
|
||||
padding-top: 24px;
|
||||
margin: 7px auto 0;
|
||||
font-family: 'Open Sans', Arial, sans-serif;
|
||||
opacity: 0;
|
||||
transition: transform 0.3s ease-in-out 0.2s, opacity 0.3s ease-in-out 0.2s, background 0.2s linear 0s;
|
||||
transform: translateX(60px) rotate(90deg);
|
||||
}
|
||||
|
||||
.pan-info p a:hover {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.pan-item:hover .pan-thumb {
|
||||
transform: rotate(-110deg);
|
||||
}
|
||||
|
||||
.pan-item:hover .pan-info p a {
|
||||
opacity: 1;
|
||||
transform: translateX(0px) rotate(0deg);
|
||||
}
|
||||
</style>
|
||||
149
src/components/RightPanel/index.vue
Normal file
149
src/components/RightPanel/index.vue
Normal file
@ -0,0 +1,149 @@
|
||||
<template>
|
||||
<div ref="rightPanel" :class="{show:show}" class="rightPanel-container">
|
||||
<div class="rightPanel-background" />
|
||||
<div class="rightPanel">
|
||||
<div class="rightPanel-items">
|
||||
<slot />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { addClass, removeClass } from '@/utils'
|
||||
|
||||
export default {
|
||||
name: 'RightPanel',
|
||||
props: {
|
||||
clickNotClose: {
|
||||
default: false,
|
||||
type: Boolean
|
||||
},
|
||||
buttonTop: {
|
||||
default: 250,
|
||||
type: Number
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
show: {
|
||||
get() {
|
||||
return this.$store.state.settings.showSettings
|
||||
},
|
||||
set(val) {
|
||||
this.$store.dispatch('settings/changeSetting', {
|
||||
key: 'showSettings',
|
||||
value: val
|
||||
})
|
||||
}
|
||||
},
|
||||
theme() {
|
||||
return this.$store.state.settings.theme
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
show(value) {
|
||||
if (value && !this.clickNotClose) {
|
||||
this.addEventClick()
|
||||
}
|
||||
if (value) {
|
||||
addClass(document.body, 'showRightPanel')
|
||||
} else {
|
||||
removeClass(document.body, 'showRightPanel')
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.insertToBody()
|
||||
this.addEventClick()
|
||||
},
|
||||
beforeDestroy() {
|
||||
const elx = this.$refs.rightPanel
|
||||
elx.remove()
|
||||
},
|
||||
methods: {
|
||||
addEventClick() {
|
||||
window.addEventListener('click', this.closeSidebar)
|
||||
},
|
||||
closeSidebar(evt) {
|
||||
const parent = evt.target.closest('.rightPanel')
|
||||
if (!parent) {
|
||||
this.show = false
|
||||
window.removeEventListener('click', this.closeSidebar)
|
||||
}
|
||||
},
|
||||
insertToBody() {
|
||||
const elx = this.$refs.rightPanel
|
||||
const body = document.querySelector('body')
|
||||
body.insertBefore(elx, body.firstChild)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.showRightPanel {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
width: calc(100% - 15px);
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.rightPanel-background {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
transition: opacity .3s cubic-bezier(.7, .3, .1, 1);
|
||||
background: rgba(0, 0, 0, .2);
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.rightPanel {
|
||||
width: 100%;
|
||||
max-width: 260px;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .05);
|
||||
transition: all .25s cubic-bezier(.7, .3, .1, 1);
|
||||
transform: translate(100%);
|
||||
background: #fff;
|
||||
z-index: 40000;
|
||||
}
|
||||
|
||||
.show {
|
||||
transition: all .3s cubic-bezier(.7, .3, .1, 1);
|
||||
|
||||
.rightPanel-background {
|
||||
z-index: 20000;
|
||||
opacity: 1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.rightPanel {
|
||||
transform: translate(0);
|
||||
}
|
||||
}
|
||||
|
||||
.handle-button {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
position: absolute;
|
||||
left: -48px;
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
border-radius: 6px 0 0 6px !important;
|
||||
z-index: 0;
|
||||
pointer-events: auto;
|
||||
cursor: pointer;
|
||||
color: #fff;
|
||||
line-height: 48px;
|
||||
i {
|
||||
font-size: 24px;
|
||||
line-height: 48px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
21
src/components/RuoYi/Doc/index.vue
Normal file
21
src/components/RuoYi/Doc/index.vue
Normal file
@ -0,0 +1,21 @@
|
||||
<template>
|
||||
<div>
|
||||
<svg-icon icon-class="question" @click="goto" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'RuoYiDoc',
|
||||
data() {
|
||||
return {
|
||||
url: 'http://doc.ruoyi.vip/ruoyi-vue'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goto() {
|
||||
window.open(this.url)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
21
src/components/RuoYi/Git/index.vue
Normal file
21
src/components/RuoYi/Git/index.vue
Normal file
@ -0,0 +1,21 @@
|
||||
<template>
|
||||
<div>
|
||||
<svg-icon icon-class="github" @click="goto" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'RuoYiGit',
|
||||
data() {
|
||||
return {
|
||||
url: 'https://gitee.com/y_project/RuoYi-Vue'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goto() {
|
||||
window.open(this.url)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
173
src/components/ThemePicker/index.vue
Normal file
173
src/components/ThemePicker/index.vue
Normal file
@ -0,0 +1,173 @@
|
||||
<template>
|
||||
<el-color-picker
|
||||
v-model="theme"
|
||||
:predefine="['#409EFF', '#1890ff', '#304156','#212121','#11a983', '#13c2c2', '#6959CD', '#f5222d', ]"
|
||||
class="theme-picker"
|
||||
popper-class="theme-picker-dropdown"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const version = require('element-ui/package.json').version // element-ui version from node_modules
|
||||
const ORIGINAL_THEME = '#409EFF' // default color
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
chalk: '', // content of theme-chalk css
|
||||
theme: ''
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
defaultTheme() {
|
||||
return this.$store.state.settings.theme
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
defaultTheme: {
|
||||
handler: function(val, oldVal) {
|
||||
this.theme = val
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
async theme(val) {
|
||||
await this.setTheme(val)
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if(this.defaultTheme !== ORIGINAL_THEME) {
|
||||
this.setTheme(this.defaultTheme)
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
async setTheme(val) {
|
||||
const oldVal = this.chalk ? this.theme : ORIGINAL_THEME
|
||||
if (typeof val !== 'string') return
|
||||
const themeCluster = this.getThemeCluster(val.replace('#', ''))
|
||||
const originalCluster = this.getThemeCluster(oldVal.replace('#', ''))
|
||||
|
||||
const getHandler = (variable, id) => {
|
||||
return () => {
|
||||
const originalCluster = this.getThemeCluster(ORIGINAL_THEME.replace('#', ''))
|
||||
const newStyle = this.updateStyle(this[variable], originalCluster, themeCluster)
|
||||
|
||||
let styleTag = document.getElementById(id)
|
||||
if (!styleTag) {
|
||||
styleTag = document.createElement('style')
|
||||
styleTag.setAttribute('id', id)
|
||||
document.head.appendChild(styleTag)
|
||||
}
|
||||
styleTag.innerText = newStyle
|
||||
}
|
||||
}
|
||||
|
||||
if (!this.chalk) {
|
||||
const url = `https://unpkg.com/element-ui@${version}/lib/theme-chalk/index.css`
|
||||
await this.getCSSString(url, 'chalk')
|
||||
}
|
||||
|
||||
const chalkHandler = getHandler('chalk', 'chalk-style')
|
||||
|
||||
chalkHandler()
|
||||
|
||||
const styles = [].slice.call(document.querySelectorAll('style'))
|
||||
.filter(style => {
|
||||
const text = style.innerText
|
||||
return new RegExp(oldVal, 'i').test(text) && !/Chalk Variables/.test(text)
|
||||
})
|
||||
styles.forEach(style => {
|
||||
const { innerText } = style
|
||||
if (typeof innerText !== 'string') return
|
||||
style.innerText = this.updateStyle(innerText, originalCluster, themeCluster)
|
||||
})
|
||||
|
||||
this.$emit('change', val)
|
||||
},
|
||||
|
||||
updateStyle(style, oldCluster, newCluster) {
|
||||
let newStyle = style
|
||||
oldCluster.forEach((color, index) => {
|
||||
newStyle = newStyle.replace(new RegExp(color, 'ig'), newCluster[index])
|
||||
})
|
||||
return newStyle
|
||||
},
|
||||
|
||||
getCSSString(url, variable) {
|
||||
return new Promise(resolve => {
|
||||
const xhr = new XMLHttpRequest()
|
||||
xhr.onreadystatechange = () => {
|
||||
if (xhr.readyState === 4 && xhr.status === 200) {
|
||||
this[variable] = xhr.responseText.replace(/@font-face{[^}]+}/, '')
|
||||
resolve()
|
||||
}
|
||||
}
|
||||
xhr.open('GET', url)
|
||||
xhr.send()
|
||||
})
|
||||
},
|
||||
|
||||
getThemeCluster(theme) {
|
||||
const tintColor = (color, tint) => {
|
||||
let red = parseInt(color.slice(0, 2), 16)
|
||||
let green = parseInt(color.slice(2, 4), 16)
|
||||
let blue = parseInt(color.slice(4, 6), 16)
|
||||
|
||||
if (tint === 0) { // when primary color is in its rgb space
|
||||
return [red, green, blue].join(',')
|
||||
} else {
|
||||
red += Math.round(tint * (255 - red))
|
||||
green += Math.round(tint * (255 - green))
|
||||
blue += Math.round(tint * (255 - blue))
|
||||
|
||||
red = red.toString(16)
|
||||
green = green.toString(16)
|
||||
blue = blue.toString(16)
|
||||
|
||||
return `#${red}${green}${blue}`
|
||||
}
|
||||
}
|
||||
|
||||
const shadeColor = (color, shade) => {
|
||||
let red = parseInt(color.slice(0, 2), 16)
|
||||
let green = parseInt(color.slice(2, 4), 16)
|
||||
let blue = parseInt(color.slice(4, 6), 16)
|
||||
|
||||
red = Math.round((1 - shade) * red)
|
||||
green = Math.round((1 - shade) * green)
|
||||
blue = Math.round((1 - shade) * blue)
|
||||
|
||||
red = red.toString(16)
|
||||
green = green.toString(16)
|
||||
blue = blue.toString(16)
|
||||
|
||||
return `#${red}${green}${blue}`
|
||||
}
|
||||
|
||||
const clusters = [theme]
|
||||
for (let i = 0; i <= 9; i++) {
|
||||
clusters.push(tintColor(theme, Number((i / 10).toFixed(2))))
|
||||
}
|
||||
clusters.push(shadeColor(theme, 0.1))
|
||||
return clusters
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.theme-message,
|
||||
.theme-picker-dropdown {
|
||||
z-index: 99999 !important;
|
||||
}
|
||||
|
||||
.theme-picker .el-color-picker__trigger {
|
||||
height: 26px !important;
|
||||
width: 26px !important;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.theme-picker-dropdown .el-color-dropdown__link-btn {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
@ -8,7 +8,7 @@
|
||||
<template v-if="appStore.device !== 'mobile'">
|
||||
<el-select
|
||||
v-if="userId === 1 && tenantEnabled"
|
||||
v-model="companyName"
|
||||
v-model="companyId"
|
||||
class="min-w-244px"
|
||||
clearable
|
||||
filterable
|
||||
@ -107,9 +107,9 @@ const noticeStore = storeToRefs(useNoticeStore());
|
||||
const newNotice = ref(<number>0);
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const currentLoginTenantId = localStorage.getItem('tenantId');
|
||||
const userId = ref(userStore.userId);
|
||||
const companyName = ref(undefined);
|
||||
const companyId = ref(currentLoginTenantId ? currentLoginTenantId : undefined);
|
||||
const tenantList = ref<TenantVO[]>([]);
|
||||
// 是否切换了租户
|
||||
const dynamic = ref(false);
|
||||
@ -124,8 +124,10 @@ const openSearchMenu = () => {
|
||||
|
||||
// 动态切换
|
||||
const dynamicTenantEvent = async (tenantId: string) => {
|
||||
if (companyName.value != null && companyName.value !== '') {
|
||||
if (companyId.value != null && companyId.value !== '') {
|
||||
await dynamicTenant(tenantId);
|
||||
// 切换商户号后，本地更新新的商户号
|
||||
localStorage.setItem('tenantId', String(tenantId));
|
||||
dynamic.value = true;
|
||||
await proxy?.$router.push('/');
|
||||
await proxy?.$tab.closeAllPage();
|
||||
|
||||
@ -2,20 +2,13 @@
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="100px" size="medium" class="ry_form">
|
||||
<el-form-item label="活动名称" prop="title">
|
||||
<el-input
|
||||
v-model="queryParams.title"
|
||||
placeholder="请输入活动名称"
|
||||
clearable
|
||||
size="small"
|
||||
/>
|
||||
<el-input v-model="queryParams.title" placeholder="请输入活动名称" clearable size="small" />
|
||||
</el-form-item>
|
||||
<el-form-item label="使用范围" prop="useScope">
|
||||
<DictRadio v-model="queryParams.useScope" @change="handleQuery" size="small"
|
||||
:radioData="dict?.type.coupon_use_scope" :showAll="'all'"/>
|
||||
<DictRadio v-model="queryParams.useScope" @change="handleQuery" size="small" radioData="coupon_use_scope" :showAll="'all'" />
|
||||
</el-form-item>
|
||||
<el-form-item label="兑换类型" prop="couponType">
|
||||
<DictRadio v-model="queryParams.couponType" @change="handleQuery" size="small"
|
||||
:radioData="dict?.type.coupon_exchange_type" :showAll="'all'"/>
|
||||
<DictRadio v-model="queryParams.couponType" @change="handleQuery" size="small" radioData="coupon_exchange_type" :showAll="'all'" />
|
||||
</el-form-item>
|
||||
<el-form-item class="flex_one tr">
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
@ -24,63 +17,44 @@
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
v-hasPermi="['act:couponActivity:opt']"
|
||||
>新增
|
||||
</el-button>
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['act:couponActivity:opt']">新增 </el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="CouponActivityList" border>
|
||||
<el-table-column label="活动名称" prop="title"/>
|
||||
<el-table-column label="活动名称" prop="title" />
|
||||
<el-table-column label="使用范围" prop="useScope">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :value="scope.row.useScope" prop-name="coupon_use_scope"/>
|
||||
<template v-slot="scope">
|
||||
<dict-tag :value="scope.row.useScope" prop-name="coupon_use_scope" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="优惠内容">
|
||||
<template slot-scope="scope">
|
||||
<template v-slot="scope">
|
||||
<span v-if="scope.row.minAmount">满{{ scope.row.minAmount }}元，优惠{{ scope.row.couponAmount }}元</span>
|
||||
<span v-else>无门槛，优惠{{ scope.row.couponAmount }}元</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="发行总数" prop="totalCount"/>
|
||||
<el-table-column label="剩余总数" prop="leftCount"/>
|
||||
<el-table-column label="已使用" prop="useCount"/>
|
||||
<el-table-column label="每人限领" prop="userLimit"/>
|
||||
<el-table-column label="发行总数" prop="totalCount" />
|
||||
<el-table-column label="剩余总数" prop="leftCount" />
|
||||
<el-table-column label="已使用" prop="useCount" />
|
||||
<el-table-column label="每人限领" prop="userLimit" />
|
||||
<el-table-column label="兑换类型" prop="couponType">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :value="scope.row.couponType" prop-name="coupon_exchange_type"/>
|
||||
<template v-slot="scope">
|
||||
<dict-tag :value="scope.row.couponType" prop-name="coupon_exchange_type" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="要兑换的积分" prop="useIntegral"/>
|
||||
<el-table-column label="要兑换的积分" prop="useIntegral" />
|
||||
<el-table-column label="活动时间" prop="beginTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<template v-slot="scope">
|
||||
<p>{{ scope.row.beginTime }}</p>
|
||||
<p> ~ </p>
|
||||
<p>~</p>
|
||||
<p>{{ scope.row.endTime }}</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
@click="seeCouponList(scope.row)"
|
||||
>领取记录
|
||||
</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
@click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['act:couponActivity:opt']"
|
||||
>修改
|
||||
</el-button>
|
||||
<template v-slot="scope">
|
||||
<el-button size="mini" type="text" @click="seeCouponList(scope.row)">领取记录 </el-button>
|
||||
<el-button size="mini" type="text" @click="handleUpdate(scope.row)" v-hasPermi="['act:couponActivity:opt']">修改 </el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
@ -93,37 +67,31 @@
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<InBody v-show="total>0">
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
<InBody v-show="total > 0">
|
||||
<pagination :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
</InBody>
|
||||
<!-- 添加或修改优惠券活动表对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="50%" append-to-body>
|
||||
<el-dialog :title="title" v-model:visible="open" width="50%" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="108px">
|
||||
<el-form-item label="活动名称" prop="title">
|
||||
<el-input v-model="form.title" placeholder="请输入活动名称"/>
|
||||
<el-input v-model="form.title" placeholder="请输入活动名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="发放数量" prop="totalCount">
|
||||
<el-input-number v-model="form.totalCount" placeholder="请输入发放数量" style="width:220px" :min="1"
|
||||
:disabled="form.id"/>
|
||||
<el-input-number v-model="form.totalCount" placeholder="请输入发放数量" style="width: 220px" :min="1" :disabled="form.id" />
|
||||
</el-form-item>
|
||||
<el-form-item label="每人限领" prop="userLimit">
|
||||
<el-input v-model="form.userLimit" style="width:220px">
|
||||
<template slot="append">张</template>
|
||||
<el-input v-model="form.userLimit" style="width: 220px">
|
||||
<template v-slot:append>张</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="最低消费金额" prop="minAmount">
|
||||
<el-input v-model="form.minAmount" style="width:220px">
|
||||
<template slot="append">元</template>
|
||||
<el-input v-model="form.minAmount" style="width: 220px">
|
||||
<template v-slot:append>元</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="优惠券金额" prop="couponAmount">
|
||||
<el-input v-model="form.couponAmount" style="width:220px">
|
||||
<template slot="append">元</template>
|
||||
<el-input v-model="form.couponAmount" style="width: 220px">
|
||||
<template v-slot:append>元</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="兑换类型" prop="couponType">
|
||||
@ -133,24 +101,29 @@
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="要兑换的积分" prop="useIntegral" v-if="form.couponType === 2">
|
||||
<el-input-number v-model="form.useIntegral" placeholder="请输入要兑换的积分" style="width:220px"
|
||||
:disabled="form.id"/>
|
||||
<el-input-number v-model="form.useIntegral" placeholder="请输入要兑换的积分" style="width: 220px" :disabled="form.id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="活动开始时间" prop="beginTime">
|
||||
<el-date-picker clearable size="small"
|
||||
<el-date-picker
|
||||
clearable
|
||||
size="small"
|
||||
v-model="form.beginTime"
|
||||
type="datetime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
placeholder="选择活动开始时间">
|
||||
placeholder="选择活动开始时间"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="活动结束时间" prop="endTime">
|
||||
<el-date-picker clearable size="small"
|
||||
<el-date-picker
|
||||
clearable
|
||||
size="small"
|
||||
v-model="form.endTime"
|
||||
type="datetime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
placeholder="选择活动结束时间">
|
||||
placeholder="选择活动结束时间"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="使用范围" prop="useScope">
|
||||
@ -160,49 +133,45 @@
|
||||
<el-radio :label="3">指定商品不可用</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品列表" prop="productIds" v-if="[2,3].includes(form.useScope)">
|
||||
<el-form-item label="商品列表" prop="productIds" v-if="[2, 3].includes(form.useScope)">
|
||||
<el-button @click="chooseSku" size="small">选择商品</el-button>
|
||||
<el-table :data="productList" class="mt10" max-height="300px" border>
|
||||
<el-table-column label="菜品信息">
|
||||
<template v-slot="{row}">
|
||||
<template v-slot="{ row }">
|
||||
<div class="flex-center">
|
||||
<el-image v-if="row.pic" :src="row.pic" :preview-src-list="[row.pic]" class="small-img circle-img"/>
|
||||
<el-image v-if="row.pic" :src="row.pic" :preview-src-list="[row.pic]" class="small-img circle-img" />
|
||||
<span class="ml5">{{ row.name }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template v-slot="{row}">
|
||||
<template v-slot="{ row }">
|
||||
<span class="red ml5 pointer" @click="delProduct(row)">删除</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<template v-slot:footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<product-select ref="productSelect" @onComplete="completeProductIds"/>
|
||||
<receive-list ref="receiveListRef"/>
|
||||
<product-select ref="productSelect" @onComplete="completeProductIds" />
|
||||
<receive-list ref="receiveListRef" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
addCouponActivity,
|
||||
delCouponActivity,
|
||||
exportCouponActivity,
|
||||
listCouponActivity,
|
||||
updateCouponActivity
|
||||
} from "@/api/act/couponActivity";
|
||||
import ProductSelect from "@/views/pms/product/productSelect.vue";
|
||||
import receiveList from "@/views/act/couponActivity/receiveList.vue";
|
||||
import { addCouponActivity, delCouponActivity, exportCouponActivity, listCouponActivity, updateCouponActivity } from '@/api/act/couponActivity';
|
||||
import ProductSelect from '@/views/pms/product/productSelect.vue';
|
||||
import receiveList from '@/views/act/couponActivity/receiveList.vue';
|
||||
|
||||
export default {
|
||||
name: "CouponActivity",
|
||||
components: {ProductSelect, receiveList},
|
||||
name: 'CouponActivity',
|
||||
components: { ProductSelect, receiveList },
|
||||
dicts: ['coupon_use_scope', 'coupon_exchange_type'],
|
||||
data() {
|
||||
return {
|
||||
@ -218,7 +187,7 @@ export default {
|
||||
// 优惠券活动表表格数据
|
||||
CouponActivityList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
title: '',
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
@ -227,36 +196,20 @@ export default {
|
||||
pageSize: 10,
|
||||
title: null,
|
||||
useScope: null,
|
||||
couponType: null,
|
||||
couponType: null
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
title: [
|
||||
{required: true, message: "活动名称不能为空", trigger: "blur"}
|
||||
],
|
||||
useScope: [
|
||||
{required: true, message: "使用范围不能为空", trigger: "change"}
|
||||
],
|
||||
totalCount: [
|
||||
{required: true, message: "发行总数不能为空", trigger: "blur"}
|
||||
],
|
||||
userLimit: [
|
||||
{required: true, message: "每人限领不能为空", trigger: "blur"}
|
||||
],
|
||||
couponAmount: [
|
||||
{required: true, message: "优惠券金额不能为空", trigger: "blur"}
|
||||
],
|
||||
couponType: [
|
||||
{required: true, message: "兑换类型不能为空", trigger: "change"}
|
||||
],
|
||||
beginTime: [
|
||||
{required: true, message: "活动开始时间不能为空", trigger: "change"}
|
||||
],
|
||||
endTime: [
|
||||
{required: true, message: "活动结束时间不能为空", trigger: "change"}
|
||||
],
|
||||
title: [{ required: true, message: '活动名称不能为空', trigger: 'blur' }],
|
||||
useScope: [{ required: true, message: '使用范围不能为空', trigger: 'change' }],
|
||||
totalCount: [{ required: true, message: '发行总数不能为空', trigger: 'blur' }],
|
||||
userLimit: [{ required: true, message: '每人限领不能为空', trigger: 'blur' }],
|
||||
couponAmount: [{ required: true, message: '优惠券金额不能为空', trigger: 'blur' }],
|
||||
couponType: [{ required: true, message: '兑换类型不能为空', trigger: 'change' }],
|
||||
beginTime: [{ required: true, message: '活动开始时间不能为空', trigger: 'change' }],
|
||||
endTime: [{ required: true, message: '活动结束时间不能为空', trigger: 'change' }]
|
||||
},
|
||||
showMoreCondition: false
|
||||
};
|
||||
@ -266,28 +219,28 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
delProduct(item) {
|
||||
this.productList = this.productList.filter(it => it.id !== item.id)
|
||||
this.completeProductIds([])
|
||||
this.productList = this.productList.filter((it) => it.id !== item.id);
|
||||
this.completeProductIds([]);
|
||||
},
|
||||
completeProductIds(products) {
|
||||
this.productList = this.productList.concat(products)
|
||||
this.productList = this.productList.concat(products);
|
||||
if (!this.productList.length) {
|
||||
this.form.productIds = null
|
||||
return
|
||||
this.form.productIds = null;
|
||||
return;
|
||||
}
|
||||
this.form.productIds = this.productList.map(it => it.id).join()
|
||||
this.form.productIds = this.productList.map((it) => it.id).join();
|
||||
},
|
||||
chooseSku() {
|
||||
this.$refs.productSelect.init(this.productList.map(it => it.id))
|
||||
this.$refs.productSelect.init(this.productList.map((it) => it.id));
|
||||
},
|
||||
/** 查询优惠券活动表列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
const {pageNum, pageSize} = this.queryParams;
|
||||
const query = {...this.queryParams, pageNum: undefined, pageSize: undefined};
|
||||
const pageReq = {page: pageNum - 1, size: pageSize};
|
||||
listCouponActivity(query, pageReq).then(response => {
|
||||
const {content, totalElements} = response
|
||||
const { pageNum, pageSize } = this.queryParams;
|
||||
const query = { ...this.queryParams, pageNum: undefined, pageSize: undefined };
|
||||
const pageReq = { page: pageNum - 1, size: pageSize };
|
||||
listCouponActivity(query, pageReq).then((response) => {
|
||||
const { content, totalElements } = response;
|
||||
this.CouponActivityList = content;
|
||||
this.total = totalElements;
|
||||
this.loading = false;
|
||||
@ -312,9 +265,9 @@ export default {
|
||||
useIntegral: null,
|
||||
couponType: 1,
|
||||
beginTime: null,
|
||||
endTime: null,
|
||||
endTime: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
this.resetForm('form');
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
@ -323,35 +276,35 @@ export default {
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.productList = []
|
||||
this.productList = [];
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加优惠券活动";
|
||||
this.title = '添加优惠券活动';
|
||||
},
|
||||
seeCouponList(row) {
|
||||
this.$refs.receiveListRef.init(row.id)
|
||||
this.$refs.receiveListRef.init(row.id);
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.productList = row.productList
|
||||
this.productList = row.productList;
|
||||
this.form = row;
|
||||
this.open = true;
|
||||
this.title = "修改优惠券活动";
|
||||
this.title = '修改优惠券活动';
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.form.id != null) {
|
||||
delete this.form.createTime
|
||||
updateCouponActivity(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
delete this.form.createTime;
|
||||
updateCouponActivity(this.form).then((response) => {
|
||||
this.$modal.msgSuccess('修改成功');
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addCouponActivity(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
addCouponActivity(this.form).then((response) => {
|
||||
this.$modal.msgSuccess('新增成功');
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
@ -362,25 +315,31 @@ export default {
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id || this.ids;
|
||||
this.$modal.confirm('是否确认删除优惠券活动【' + row.title + '】？').then(function () {
|
||||
this.$modal
|
||||
.confirm('是否确认删除优惠券活动【' + row.title + '】？')
|
||||
.then(function () {
|
||||
return delCouponActivity(ids);
|
||||
}).then(() => {
|
||||
})
|
||||
.then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
});
|
||||
this.$modal.msgSuccess('删除成功');
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
const queryParams = this.queryParams;
|
||||
this.$modal.confirm('是否确认导出所有优惠券活动表数据项？').then(() => {
|
||||
this.$modal
|
||||
.confirm('是否确认导出所有优惠券活动表数据项？')
|
||||
.then(() => {
|
||||
this.exportLoading = true;
|
||||
return exportCouponActivity(queryParams);
|
||||
}).then(response => {
|
||||
})
|
||||
.then((response) => {
|
||||
this.$download.download(response);
|
||||
this.exportLoading = false;
|
||||
}).catch(() => {
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -1,78 +1,70 @@
|
||||
<template>
|
||||
<el-dialog title="领取记录" :visible.sync="open" width="80%" append-to-body>
|
||||
<el-dialog title="领取记录" v-model:visible="open" width="80%" append-to-body>
|
||||
<el-form :model="queryParams" :inline="true" label-width="100px" size="medium" class="ry_form">
|
||||
<el-form-item label="使用状态" prop="useStatus">
|
||||
<DictRadio v-model="queryParams.useStatus" @change="handleQuery" size="small"
|
||||
:radioData="dict?.type.activity_coupon_status" :showAll="'all'"/>
|
||||
<DictRadio v-model="queryParams.useStatus" @change="handleQuery" size="small" radioData="activity_coupon_status" :showAll="'all'" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table v-loading="loading" :data="tableList" border>
|
||||
<el-table-column label="券ID" prop="id" />
|
||||
<el-table-column label="用户信息 " >
|
||||
<template slot-scope="scope">
|
||||
<el-table-column label="用户信息 ">
|
||||
<template v-slot="scope">
|
||||
<div class="flex-center">
|
||||
<el-avatar :src="scope.row.avatar"></el-avatar>
|
||||
<div class="tl ml5">
|
||||
<p>{{scope.row.nickname}}</p>
|
||||
<p>{{scope.row.phone}}</p>
|
||||
<p>{{ scope.row.nickname }}</p>
|
||||
<p>{{ scope.row.phone }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="领取时间" prop="createTime" width="180" />
|
||||
<el-table-column label="使用状态" >
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :value="scope.row.useStatus" prop-name="activity_coupon_status"/>
|
||||
<el-table-column label="使用状态">
|
||||
<template v-slot="scope">
|
||||
<dict-tag :value="scope.row.useStatus" prop-name="activity_coupon_status" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="有效期" width="180" >
|
||||
<template slot-scope="scope">
|
||||
<p>{{ scope.row.beginTime}}</p>
|
||||
<p> ~ </p>
|
||||
<p>{{ scope.row.endTime}}</p>
|
||||
<el-table-column label="有效期" width="180">
|
||||
<template v-slot="scope">
|
||||
<p>{{ scope.row.beginTime }}</p>
|
||||
<p>~</p>
|
||||
<p>{{ scope.row.endTime }}</p>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="订单号" prop="orderId" />
|
||||
<el-table-column label="使用时间" prop="useTime" width="180" />
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
import {listMemberCoupon} from "@/api/act/memberCoupon";
|
||||
import { listMemberCoupon } from '@/api/act/memberCoupon';
|
||||
|
||||
export default {
|
||||
dicts: ['activity_coupon_status'],
|
||||
data(){
|
||||
return{
|
||||
open:false,
|
||||
data() {
|
||||
return {
|
||||
open: false,
|
||||
loading: false,
|
||||
tableList: [],
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
useStatus: null,
|
||||
couponActivityId: null,
|
||||
couponActivityId: null
|
||||
},
|
||||
total: 0,
|
||||
}
|
||||
total: 0
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
async init(activityId){
|
||||
methods: {
|
||||
async init(activityId) {
|
||||
if (!activityId) {
|
||||
return
|
||||
return;
|
||||
}
|
||||
this.queryParams.couponActivityId = activityId
|
||||
await this.handleQuery()
|
||||
this.open = true
|
||||
this.queryParams.couponActivityId = activityId;
|
||||
await this.handleQuery();
|
||||
this.open = true;
|
||||
},
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
@ -80,16 +72,16 @@ export default {
|
||||
},
|
||||
getList() {
|
||||
this.loading = true;
|
||||
const {pageNum, pageSize} = this.queryParams;
|
||||
const query = {...this.queryParams, pageNum: undefined, pageSize: undefined};
|
||||
const pageReq = {page: pageNum - 1, size: pageSize};
|
||||
return listMemberCoupon(query, pageReq).then(response => {
|
||||
const { content, totalElements } = response
|
||||
const { pageNum, pageSize } = this.queryParams;
|
||||
const query = { ...this.queryParams, pageNum: undefined, pageSize: undefined };
|
||||
const pageReq = { page: pageNum - 1, size: pageSize };
|
||||
return listMemberCoupon(query, pageReq).then((response) => {
|
||||
const { content, totalElements } = response;
|
||||
this.tableList = content;
|
||||
this.total = totalElements;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -152,6 +152,7 @@ const handleLogin = () => {
|
||||
// 调用action的登录方法
|
||||
const [err] = await to(userStore.login(loginForm.value));
|
||||
if (!err) {
|
||||
localStorage.setItem('tenantId', String(loginForm.value.tenantId));
|
||||
const redirectUrl = redirect.value || '/';
|
||||
await router.push(redirectUrl);
|
||||
loading.value = false;
|
||||
|
||||
@ -3,22 +3,10 @@
|
||||
<div v-show="show">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px" size="medium" class="ry_form">
|
||||
<el-form-item label="申请状态" prop="status">
|
||||
<DictRadio
|
||||
v-model="queryParams.status"
|
||||
:radioData="dict?.type.oms_aftersale_status"
|
||||
size="small"
|
||||
:show-all="'all'"
|
||||
@change="handleQuery"
|
||||
></DictRadio>
|
||||
<DictRadio v-model="queryParams.status" radioData="oms_aftersale_status" size="small" :show-all="'all'" @change="handleQuery"></DictRadio>
|
||||
</el-form-item>
|
||||
<el-form-item label="售后类型" prop="type">
|
||||
<DictRadio
|
||||
v-model="queryParams.type"
|
||||
:radioData="dict?.type.oms_aftersale_type"
|
||||
size="small"
|
||||
:show-all="'all'"
|
||||
@change="handleQuery"
|
||||
></DictRadio>
|
||||
<DictRadio v-model="queryParams.type" radioData="oms_aftersale_type" size="small" :show-all="'all'" @change="handleQuery"></DictRadio>
|
||||
</el-form-item>
|
||||
<el-form-item label="订单号" prop="orderSn">
|
||||
<el-input v-model.trim="queryParams.orderSn" placeholder="请输入订单号" clearable size="small" @keyup.enter.native="handleQuery" />
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<el-form-item label="订单状态" prop="status">
|
||||
<DictRadio
|
||||
v-model="queryParams.status"
|
||||
:radioData="dict?.type.oms_order_status"
|
||||
radioData="oms_order_status"
|
||||
size="small"
|
||||
:show-all="'all'"
|
||||
:filter="['11', '12', '13', '14']"
|
||||
@ -157,10 +157,10 @@
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<InBody v-show="total > 0">
|
||||
<!-- <InBody v-show="total > 0">
|
||||
<pagination :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
</InBody>-->
|
||||
<pagination :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
</InBody>
|
||||
|
||||
<!-- 发货对话框 -->
|
||||
<el-dialog :title="deliveryObj.title" v-model:visible="deliveryObj.open" width="500px" append-to-body>
|
||||
<el-form ref="deliveryForm" :model="deliveryObj.form" :rules="deliveryObj.rules" label-width="100px">
|
||||
|
||||
@ -2,16 +2,10 @@
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px" size="medium" class="ry_form">
|
||||
<el-form-item label="订单号" prop="orderId">
|
||||
<el-input
|
||||
v-model="queryParams.orderSn"
|
||||
placeholder="请输入订单号"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
<el-input v-model="queryParams.orderSn" placeholder="请输入订单号" clearable size="small" @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="订单状态" prop="status">
|
||||
<DictRadio v-model="queryParams.status" :radioData="dict?.type.oms_order_status" size="small" :show-all="'all'"></DictRadio>
|
||||
<DictRadio v-model="queryParams.status" radioData="oms_order_status" size="small" :show-all="'all'"></DictRadio>
|
||||
</el-form-item>
|
||||
<el-form-item class="flex_one tr">
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
@ -20,7 +14,7 @@
|
||||
</el-form>
|
||||
|
||||
<el-table v-loading="loading" :data="omsOrderOperateHistoryList" @selection-change="handleSelectionChange">
|
||||
<!-- <el-table-column type="selection" width="55" align="center" />-->
|
||||
<!-- <el-table-column type="selection" width="55" align="center" />-->
|
||||
<el-table-column label="订单号" align="center" prop="orderSn" />
|
||||
<el-table-column label="订单状态" align="center" prop="orderStatus">
|
||||
<template v-slot="scope">
|
||||
@ -32,39 +26,29 @@
|
||||
<el-table-column label="备注" align="center" prop="note" />
|
||||
<el-table-column label="操作时间" align="center" prop="createTime">
|
||||
<template v-slot="scope">
|
||||
<div>{{ parseTime(scope.row.createTime, '')}}</div>
|
||||
<div>{{ parseTime(scope.row.createTime, '') }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<!-- <el-button-->
|
||||
<!-- size="mini"-->
|
||||
<!-- type="text"-->
|
||||
<!-- icon="el-icon-edit"-->
|
||||
<!-- @click="handleUpdate(scope.row)"-->
|
||||
<!-- v-hasPermi="['oms:orderOperateHistory:edit']"-->
|
||||
<!-- >修改</el-button>-->
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['oms:orderOperateHistory:remove']"
|
||||
>删除</el-button>
|
||||
<template v-slot="scope">
|
||||
<!-- <el-button-->
|
||||
<!-- size="mini"-->
|
||||
<!-- type="text"-->
|
||||
<!-- icon="el-icon-edit"-->
|
||||
<!-- @click="handleUpdate(scope.row)"-->
|
||||
<!-- v-hasPermi="['oms:orderOperateHistory:edit']"-->
|
||||
<!-- >修改</el-button>-->
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['oms:orderOperateHistory:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
|
||||
<!-- 添加或修改订单操作历史记录对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="50%" append-to-body>
|
||||
<el-dialog :title="title" v-model:visible="open" width="50%" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="108px" inline class="dialog-form-two">
|
||||
<el-form-item label="订单id" prop="orderId">
|
||||
<el-input v-model="form.orderId" placeholder="请输入订单id" />
|
||||
@ -81,20 +65,29 @@
|
||||
<el-input v-model="form.note" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<template v-slot:footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listOmsOrderOperateHistory, getOmsOrderOperateHistory, delOmsOrderOperateHistory, addOmsOrderOperateHistory, updateOmsOrderOperateHistory, exportOmsOrderOperateHistory } from "@/api/oms/orderOperateHistory";
|
||||
import {
|
||||
listOmsOrderOperateHistory,
|
||||
getOmsOrderOperateHistory,
|
||||
delOmsOrderOperateHistory,
|
||||
addOmsOrderOperateHistory,
|
||||
updateOmsOrderOperateHistory,
|
||||
exportOmsOrderOperateHistory
|
||||
} from '@/api/oms/orderOperateHistory';
|
||||
|
||||
export default {
|
||||
name: "OmsOrderOperateHistory",
|
||||
dicts: ["oms_order_status"],
|
||||
name: 'OmsOrderOperateHistory',
|
||||
dicts: ['oms_order_status'],
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
@ -114,7 +107,7 @@ export default {
|
||||
// 订单操作历史记录表格数据
|
||||
omsOrderOperateHistoryList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
title: '',
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
@ -124,13 +117,12 @@ export default {
|
||||
orderSn: null,
|
||||
operateMan: null,
|
||||
orderStatus: null,
|
||||
note: null,
|
||||
note: null
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
},
|
||||
rules: {}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
@ -140,11 +132,11 @@ export default {
|
||||
/** 查询订单操作历史记录列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
const {pageNum, pageSize} = this.queryParams;
|
||||
const query = {...this.queryParams, pageNum: undefined, pageSize: undefined};
|
||||
const pageReq = {page: pageNum - 1, size: pageSize};
|
||||
listOmsOrderOperateHistory(query, pageReq).then(response => {
|
||||
const { content, totalElements } = response
|
||||
const { pageNum, pageSize } = this.queryParams;
|
||||
const query = { ...this.queryParams, pageNum: undefined, pageSize: undefined };
|
||||
const pageReq = { page: pageNum - 1, size: pageSize };
|
||||
listOmsOrderOperateHistory(query, pageReq).then((response) => {
|
||||
const { content, totalElements } = response;
|
||||
this.omsOrderOperateHistoryList = content;
|
||||
this.total = totalElements;
|
||||
this.loading = false;
|
||||
@ -168,7 +160,7 @@ export default {
|
||||
updateBy: null,
|
||||
updateTime: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
this.resetForm('form');
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
@ -177,44 +169,44 @@ export default {
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.resetForm('queryForm');
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.id)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
this.ids = selection.map((item) => item.id);
|
||||
this.single = selection.length !== 1;
|
||||
this.multiple = !selection.length;
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加订单操作历史记录";
|
||||
this.title = '添加订单操作历史记录';
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id || this.ids
|
||||
getOmsOrderOperateHistory(id).then(response => {
|
||||
const id = row.id || this.ids;
|
||||
getOmsOrderOperateHistory(id).then((response) => {
|
||||
this.form = response;
|
||||
this.open = true;
|
||||
this.title = "修改订单操作历史记录";
|
||||
this.title = '修改订单操作历史记录';
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.form.id != null) {
|
||||
updateOmsOrderOperateHistory(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
updateOmsOrderOperateHistory(this.form).then((response) => {
|
||||
this.$modal.msgSuccess('修改成功');
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addOmsOrderOperateHistory(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
addOmsOrderOperateHistory(this.form).then((response) => {
|
||||
this.$modal.msgSuccess('新增成功');
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
@ -225,26 +217,34 @@ export default {
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id || this.ids;
|
||||
this.$modal.confirm('是否确认删除订单操作历史记录编号为"' + ids + '"的数据项？').then(function() {
|
||||
this.$modal
|
||||
.confirm('是否确认删除订单操作历史记录编号为"' + ids + '"的数据项？')
|
||||
.then(function () {
|
||||
return delOmsOrderOperateHistory(ids);
|
||||
}).then(() => {
|
||||
})
|
||||
.then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {});
|
||||
this.$modal.msgSuccess('删除成功');
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
const queryParams = this.queryParams;
|
||||
this.$modal.confirm('是否确认导出所有订单操作历史记录数据项？').then(() => {
|
||||
this.$modal
|
||||
.confirm('是否确认导出所有订单操作历史记录数据项？')
|
||||
.then(() => {
|
||||
this.exportLoading = true;
|
||||
return exportOmsOrderOperateHistory(queryParams);
|
||||
}).then(response => {
|
||||
})
|
||||
.then((response) => {
|
||||
this.$download.download(response);
|
||||
this.exportLoading = false;
|
||||
}).catch(() => {});
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
getOrderTypeTag(status){
|
||||
switch (status){
|
||||
getOrderTypeTag(status) {
|
||||
switch (status) {
|
||||
case 0:
|
||||
case 1:
|
||||
return 'info';
|
||||
@ -258,8 +258,8 @@ export default {
|
||||
return 'danger';
|
||||
}
|
||||
},
|
||||
getOrderTypeText(status){
|
||||
switch (status){
|
||||
getOrderTypeText(status) {
|
||||
switch (status) {
|
||||
case 0:
|
||||
return '待付款';
|
||||
case 1:
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px" size="medium" class="ry_form">
|
||||
<el-form-item label="状态" prop="showStatus">
|
||||
<DictRadio v-model="queryParams.showStatus" @change="handleQuery" size="small" :radioData="dict?.type.sys_normal_disable" :showAll="'all'" />
|
||||
<DictRadio v-model="queryParams.showStatus" @change="handleQuery" size="small" radioData="sys_normal_disable" :showAll="'all'" />
|
||||
</el-form-item>
|
||||
<el-form-item label="名称" prop="name">
|
||||
<el-input v-model="queryParams.nameLike" placeholder="名称" clearable size="small" @keyup.enter.native="handleQuery" />
|
||||
@ -49,7 +49,7 @@
|
||||
<el-dialog :title="title" v-model:visible="open" width="50%" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="108px" inline class="dialog-form-one">
|
||||
<el-form-item label="状态">
|
||||
<DictRadio v-model="form.showStatus" size="small" :radioData="dict?.type.sys_normal_disable" />
|
||||
<DictRadio v-model="form.showStatus" size="small" radioData="sys_normal_disable" />
|
||||
</el-form-item>
|
||||
<el-form-item label="名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="名称" />
|
||||
|
||||
@ -56,7 +56,7 @@
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="上架状态">
|
||||
<DictRadio v-model="form.publishStatus" size="small" :radioData="dict?.type.pms_publish_status" />
|
||||
<DictRadio v-model="form.publishStatus" size="small" radioData="pms_publish_status" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
v-model="queryParams.publishStatus"
|
||||
@change="handleQuery"
|
||||
size="small"
|
||||
:radioData="dict?.type.pms_publish_status"
|
||||
radioData="pms_publish_status"
|
||||
:showAll="'all'"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px" size="medium" class="ry_form">
|
||||
<el-form-item label="状态" prop="showStatus">
|
||||
<DictRadio v-model="queryParams.showStatus" @change="handleQuery" size="small" :radioData="dict?.type.sys_show_status" :showAll="'all'" />
|
||||
<DictRadio v-model="queryParams.showStatus" @change="handleQuery" size="small" radioData="sys_show_status" :showAll="'all'" />
|
||||
</el-form-item>
|
||||
<el-form-item label="名称" prop="name">
|
||||
<el-input v-model="queryParams.nameLike" placeholder="名称" clearable size="small" @keyup.enter.native="handleQuery" />
|
||||
@ -58,7 +58,7 @@
|
||||
<oss-image-upload v-model="form.icon" :limit="1" />
|
||||
</el-form-item>
|
||||
<el-form-item label="状态">
|
||||
<DictRadio v-model="form.showStatus" size="small" :radioData="dict?.type.sys_show_status" />
|
||||
<DictRadio v-model="form.showStatus" size="small" radioData="sys_show_status" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="sort">
|
||||
<el-input v-model="form.sort" placeholder="排序" />
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user