vue版本上线
This commit is contained in:
季圣华
15
jshERP-web/src/views/404.vue
Normal file
15
jshERP-web/src/views/404.vue
Normal file
@@ -0,0 +1,15 @@
|
||||
<template>
|
||||
<div>
|
||||
404 page
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "404"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
162
jshERP-web/src/views/Home.vue
Normal file
162
jshERP-web/src/views/Home.vue
Normal file
@@ -0,0 +1,162 @@
|
||||
<template>
|
||||
<div class="home">
|
||||
<div class="banner">
|
||||
<h3 style="margin-top: 1rem">Welcome to Your Vue.js App</h3>
|
||||
</div>
|
||||
|
||||
<br/>
|
||||
|
||||
<h2># Trend 组件 </h2>
|
||||
|
||||
<a-divider> 正常 </a-divider>
|
||||
|
||||
<a-card>
|
||||
|
||||
<trend flag="up" style="margin-right: 16px;">
|
||||
<span slot="term">工资</span>
|
||||
5%
|
||||
</trend>
|
||||
<trend flag="up" style="margin-right: 16px;">
|
||||
<span slot="term">工作量</span>
|
||||
50%
|
||||
</trend>
|
||||
<trend flag="down">
|
||||
<span slot="term">身体状态</span>
|
||||
50%
|
||||
</trend>
|
||||
|
||||
</a-card>
|
||||
|
||||
<a-divider> 颜色反转 </a-divider>
|
||||
|
||||
<a-card style="margin-bottom: 3rem">
|
||||
|
||||
<trend flag="up" :reverse-color="true" style="margin-right: 16px;">
|
||||
<span slot="term">工资</span>
|
||||
5%
|
||||
</trend>
|
||||
<trend flag="down" :reverse-color="true" style="margin-right: 16px;">
|
||||
<span slot="term">工作量</span>
|
||||
50%
|
||||
</trend>
|
||||
|
||||
</a-card>
|
||||
|
||||
<h2># AvatarList 组件 </h2>
|
||||
|
||||
<a-divider> AvatarList </a-divider>
|
||||
<a-card style="margin-bottom: 3rem">
|
||||
<avatar-list :max-length="3">
|
||||
<avatar-list-item tips="Jake" src="https://gw.alipayobjects.com/zos/rmsportal/zOsKZmFRdUtvpqCImOVY.png" />
|
||||
<avatar-list-item tips="Andy" src="https://gw.alipayobjects.com/zos/rmsportal/sfjbOqnsXXJgNCjCzDBL.png" />
|
||||
<avatar-list-item tips="Niko" src="https://gw.alipayobjects.com/zos/rmsportal/kZzEzemZyKLKFsojXItE.png" />
|
||||
<avatar-list-item tips="Niko" src="https://gw.alipayobjects.com/zos/rmsportal/kZzEzemZyKLKFsojXItE.png" />
|
||||
<avatar-list-item tips="Niko" src="https://gw.alipayobjects.com/zos/rmsportal/kZzEzemZyKLKFsojXItE.png" />
|
||||
<avatar-list-item tips="Niko" src="https://gw.alipayobjects.com/zos/rmsportal/kZzEzemZyKLKFsojXItE.png" />
|
||||
<avatar-list-item tips="Niko" src="https://gw.alipayobjects.com/zos/rmsportal/kZzEzemZyKLKFsojXItE.png" />
|
||||
|
||||
</avatar-list>
|
||||
|
||||
<a-divider type="vertical" style="margin: 0 16px" />
|
||||
|
||||
<avatar-list size="mini">
|
||||
<avatar-list-item tips="Jake" src="https://gw.alipayobjects.com/zos/rmsportal/zOsKZmFRdUtvpqCImOVY.png" />
|
||||
<avatar-list-item tips="Andy" src="https://gw.alipayobjects.com/zos/rmsportal/sfjbOqnsXXJgNCjCzDBL.png" />
|
||||
<avatar-list-item tips="Niko" src="https://gw.alipayobjects.com/zos/rmsportal/kZzEzemZyKLKFsojXItE.png" />
|
||||
</avatar-list>
|
||||
</a-card>
|
||||
|
||||
<h2># CountDown 组件 </h2>
|
||||
|
||||
<a-divider> CountDown </a-divider>
|
||||
<a-card style="margin-bottom: 3rem">
|
||||
<count-down
|
||||
style="font-size: 2rem"
|
||||
:target="new Date().getTime() + 3000000"
|
||||
:on-end="onEndHandle">
|
||||
</count-down>
|
||||
|
||||
<a-divider type="vertical" style="margin: 0 16px" />
|
||||
|
||||
<count-down
|
||||
style="font-size: 2rem"
|
||||
:target="new Date().getTime() + 10000"
|
||||
:on-end="onEndHandle2">
|
||||
</count-down>
|
||||
</a-card>
|
||||
|
||||
<h2># Ellipsis 组件 </h2>
|
||||
|
||||
<a-divider> Ellipsis </a-divider>
|
||||
<a-card style="margin-bottom: 3rem">
|
||||
<ellipsis :length="100" tooltip>
|
||||
There were injuries alleged in three cases in 2015, and a
|
||||
fourth incident in September, according to the safety recall report. After meeting with US regulators in October, the firm decided to issue a voluntary recall.
|
||||
</ellipsis>
|
||||
</a-card>
|
||||
|
||||
<h2># NumberInfo 组件 </h2>
|
||||
|
||||
<a-divider> NumberInfo </a-divider>
|
||||
<a-card>
|
||||
<number-info
|
||||
:sub-title="() => { return 'Visits this week' }"
|
||||
:total="12321"
|
||||
status="up"
|
||||
:sub-total="17.1"></number-info>
|
||||
</a-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// @ is an alias to /src
|
||||
|
||||
import Trend from '@/components/Trend'
|
||||
import AvatarList from '@/components/AvatarList'
|
||||
import CountDown from '@/components/CountDown/CountDown'
|
||||
import Ellipsis from '@/components/Ellipsis'
|
||||
import NumberInfo from '@/components/NumberInfo'
|
||||
|
||||
const AvatarListItem = AvatarList.AvatarItem
|
||||
|
||||
export default {
|
||||
name: 'Home',
|
||||
components: {
|
||||
NumberInfo,
|
||||
Ellipsis,
|
||||
CountDown,
|
||||
Trend,
|
||||
AvatarList,
|
||||
AvatarListItem
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
targetTime: new Date().getTime() + 3900000
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onEndHandle () {
|
||||
this.$message.success('CountDown callback!!!')
|
||||
},
|
||||
onEndHandle2 () {
|
||||
this.$notification.open({
|
||||
message: 'Notification Title',
|
||||
description: 'This is the content of the notification. This is the content of the notification. This is the content of the notification.',
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.home {
|
||||
width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 25px 0;
|
||||
}
|
||||
.home > .banner {
|
||||
text-align: center;
|
||||
padding: 25px 0;
|
||||
margin: 25px 0;
|
||||
}
|
||||
</style>
|
||||
286
jshERP-web/src/views/account/center/Index.vue
Normal file
286
jshERP-web/src/views/account/center/Index.vue
Normal file
@@ -0,0 +1,286 @@
|
||||
<template>
|
||||
<div class="page-header-index-wide page-header-wrapper-grid-content-main">
|
||||
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="24" :lg="7">
|
||||
<a-card :bordered="false">
|
||||
<div class="account-center-avatarHolder">
|
||||
<div class="avatar">
|
||||
<img :src="getAvatar()"/>
|
||||
</div>
|
||||
<div class="username">{{ nickname() }}</div>
|
||||
<div class="bio">海纳百川，有容乃大</div>
|
||||
</div>
|
||||
<div class="account-center-detail">
|
||||
<p>
|
||||
<i class="title"></i>交互专家
|
||||
</p>
|
||||
<p>
|
||||
<i class="group"></i>蚂蚁金服－某某某事业群－某某平台部－某某技术部－UED
|
||||
</p>
|
||||
<p>
|
||||
<i class="address"></i><span>浙江省</span><span>杭州市</span>
|
||||
</p>
|
||||
</div>
|
||||
<a-divider />
|
||||
|
||||
<div class="account-center-tags">
|
||||
<div class="tagsTitle">标签</div>
|
||||
<div>
|
||||
<template v-for="(tag, index) in tags">
|
||||
<a-tooltip v-if="tag.length > 20" :key="tag" :title="tag">
|
||||
<a-tag :key="tag" :closable="index !== 0" :afterClose="() => handleTagClose(tag)">
|
||||
{{ `${tag.slice(0, 20)}...` }}
|
||||
</a-tag>
|
||||
</a-tooltip>
|
||||
<a-tag v-else :key="tag" :closable="index !== 0" :afterClose="() => handleTagClose(tag)">{{ tag }}</a-tag>
|
||||
</template>
|
||||
<a-input
|
||||
v-if="tagInputVisible"
|
||||
ref="tagInput"
|
||||
type="text"
|
||||
size="small"
|
||||
:style="{ width: '78px' }"
|
||||
:value="tagInputValue"
|
||||
@change="handleInputChange"
|
||||
@blur="handleTagInputConfirm"
|
||||
@keyup.enter="handleTagInputConfirm"
|
||||
/>
|
||||
<a-tag v-else @click="showTagInput" style="background: #fff; borderStyle: dashed;">
|
||||
<a-icon type="plus" /> New Tag
|
||||
</a-tag>
|
||||
</div>
|
||||
</div>
|
||||
<a-divider :dashed="true" />
|
||||
|
||||
<div class="account-center-team">
|
||||
<div class="teamTitle">团队</div>
|
||||
<a-spin :spinning="teamSpinning">
|
||||
<div class="members">
|
||||
<a-row>
|
||||
<a-col :span="12" v-for="(item, index) in teams" :key="index">
|
||||
<a>
|
||||
<a-avatar size="small" :src="item.avatar" />
|
||||
<span class="member">{{ item.name }}</span>
|
||||
</a>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</a-spin>
|
||||
</div>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :md="24" :lg="17">
|
||||
<a-card
|
||||
style="width:100%"
|
||||
:bordered="false"
|
||||
:tabList="tabListNoTitle"
|
||||
:activeTabKey="noTitleKey"
|
||||
@tabChange="key => handleTabChange(key, 'noTitleKey')"
|
||||
>
|
||||
<article-page v-if="noTitleKey === 'article'"></article-page>
|
||||
<app-page v-else-if="noTitleKey === 'app'"></app-page>
|
||||
<project-page v-else-if="noTitleKey === 'project'"></project-page>
|
||||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PageLayout from '@/components/page/PageLayout'
|
||||
import RouteView from "@/components/layouts/RouteView"
|
||||
import { AppPage, ArticlePage, ProjectPage } from './page'
|
||||
import { mapGetters } from 'vuex'
|
||||
import { getFileAccessHttpUrl } from '@/api/manage';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
RouteView,
|
||||
PageLayout,
|
||||
AppPage,
|
||||
ArticlePage,
|
||||
ProjectPage
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tags: ['很有想法的', '专注设计', '辣~', '大长腿', '川妹子', '海纳百川'],
|
||||
|
||||
tagInputVisible: false,
|
||||
tagInputValue: '',
|
||||
|
||||
teams: [],
|
||||
teamSpinning: true,
|
||||
|
||||
tabListNoTitle: [{
|
||||
key: 'article',
|
||||
tab: '文章(8)',
|
||||
}, {
|
||||
key: 'app',
|
||||
tab: '应用(8)',
|
||||
}, {
|
||||
key: 'project',
|
||||
tab: '项目(8)',
|
||||
}
|
||||
],
|
||||
noTitleKey: 'app',
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.getTeams()
|
||||
},
|
||||
methods: {
|
||||
...mapGetters(["nickname", "avatar"]),
|
||||
getAvatar(){
|
||||
return getFileAccessHttpUrl(this.avatar());
|
||||
},
|
||||
getTeams() {
|
||||
this.$http.get('/api/workplace/teams')
|
||||
.then(res => {
|
||||
this.teams = res.result
|
||||
this.teamSpinning = false
|
||||
})
|
||||
},
|
||||
|
||||
handleTabChange (key, type) {
|
||||
this[type] = key
|
||||
},
|
||||
|
||||
handleTagClose (removeTag) {
|
||||
const tags = this.tags.filter(tag => tag != removeTag)
|
||||
this.tags = tags
|
||||
},
|
||||
|
||||
showTagInput () {
|
||||
this.tagInputVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.tagInput.focus()
|
||||
})
|
||||
},
|
||||
|
||||
handleInputChange (e) {
|
||||
this.tagInputValue = e.target.value
|
||||
},
|
||||
|
||||
handleTagInputConfirm () {
|
||||
const inputValue = this.tagInputValue
|
||||
let tags = this.tags
|
||||
if (inputValue && tags.indexOf(inputValue) === -1) {
|
||||
tags = [...tags, inputValue]
|
||||
}
|
||||
|
||||
Object.assign(this, {
|
||||
tags,
|
||||
tagInputVisible: false,
|
||||
tagInputValue: ''
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.page-header-wrapper-grid-content-main {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 100%;
|
||||
transition: .3s;
|
||||
|
||||
.account-center-avatarHolder {
|
||||
text-align: center;
|
||||
margin-bottom: 24px;
|
||||
|
||||
& > .avatar {
|
||||
margin: 0 auto;
|
||||
width: 104px;
|
||||
height: 104px;
|
||||
margin-bottom: 20px;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
img {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.username {
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
font-weight: 500;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.account-center-detail {
|
||||
|
||||
p {
|
||||
margin-bottom: 8px;
|
||||
padding-left: 26px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
i {
|
||||
position: absolute;
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
left: 0;
|
||||
top: 4px;
|
||||
background: url(https://gw.alipayobjects.com/zos/rmsportal/pBjWzVAHnOOtAUvZmZfy.svg)
|
||||
}
|
||||
|
||||
.title {
|
||||
background-position: 0 0;
|
||||
}
|
||||
.group {
|
||||
background-position: 0 -22px;
|
||||
}
|
||||
.address {
|
||||
background-position: 0 -44px;
|
||||
}
|
||||
}
|
||||
|
||||
.account-center-tags {
|
||||
.ant-tag {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.account-center-team {
|
||||
|
||||
.members {
|
||||
a {
|
||||
display: block;
|
||||
margin: 12px 0;
|
||||
line-height: 24px;
|
||||
height: 24px;
|
||||
.member {
|
||||
font-size: 14px;
|
||||
color: rgba(0, 0, 0, .65);
|
||||
line-height: 24px;
|
||||
max-width: 100px;
|
||||
vertical-align: top;
|
||||
margin-left: 12px;
|
||||
transition: all 0.3s;
|
||||
display: inline-block;
|
||||
}
|
||||
&:hover {
|
||||
span {
|
||||
color: #1890ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tagsTitle, .teamTitle {
|
||||
font-weight: 500;
|
||||
color: rgba(0,0,0,.85);
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
</style>
|
||||
113
jshERP-web/src/views/account/center/page/App.vue
Normal file
113
jshERP-web/src/views/account/center/page/App.vue
Normal file
@@ -0,0 +1,113 @@
|
||||
<template>
|
||||
<div class="app-list">
|
||||
<a-list
|
||||
:grid="{ gutter: 24, lg: 3, md: 2, sm: 1, xs: 1 }"
|
||||
:dataSource="dataSource">
|
||||
<a-list-item slot="renderItem" slot-scope="item, index">
|
||||
<a-card :hoverable="true">
|
||||
<a-card-meta>
|
||||
<div style="margin-bottom: 3px" slot="title">{{ item.title }}</div>
|
||||
<a-avatar class="card-avatar" slot="avatar" :src="item.avatar" size="small"/>
|
||||
<div class="meta-cardInfo" slot="description">
|
||||
<div>
|
||||
<p>活跃用户</p>
|
||||
<p>
|
||||
<span>{{ item.activeUser }}<span>万</span></span>
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p>新增用户</p>
|
||||
<p>{{ item.newUser | NumberFormat }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</a-card-meta>
|
||||
<template class="ant-card-actions" slot="actions">
|
||||
<a>
|
||||
<a-icon type="download"/>
|
||||
</a>
|
||||
<a>
|
||||
<a-icon type="edit"/>
|
||||
</a>
|
||||
<a>
|
||||
<a-icon type="share-alt"/>
|
||||
</a>
|
||||
<a>
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link" href="javascript:;">
|
||||
<a-icon type="ellipsis"/>
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">1st menu item</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">2nd menu item</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">3rd menu item</a>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</a>
|
||||
</template>
|
||||
</a-card>
|
||||
</a-list-item>
|
||||
</a-list>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const dataSource = []
|
||||
for (let i = 0; i < 11; i++) {
|
||||
dataSource.push({
|
||||
title: 'Alipay',
|
||||
avatar: 'https://gw.alipayobjects.com/zos/rmsportal/WdGqmHpayyMjiEhcKoVE.png',
|
||||
activeUser: 17,
|
||||
newUser: 1700
|
||||
})
|
||||
}
|
||||
|
||||
export default {
|
||||
name: "Article",
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
dataSource,
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
.app-list {
|
||||
|
||||
.meta-cardInfo {
|
||||
zoom: 1;
|
||||
margin-top: 16px;
|
||||
|
||||
> div {
|
||||
position: relative;
|
||||
text-align: left;
|
||||
float: left;
|
||||
width: 50%;
|
||||
|
||||
p {
|
||||
line-height: 32px;
|
||||
font-size: 24px;
|
||||
margin: 0;
|
||||
|
||||
&:first-child {
|
||||
color: rgba(0, 0, 0, .45);
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
24
jshERP-web/src/views/account/center/page/Article.vue
Normal file
24
jshERP-web/src/views/account/center/page/Article.vue
Normal file
@@ -0,0 +1,24 @@
|
||||
<template>
|
||||
<a-list>
|
||||
<a-list-item>
|
||||
|
||||
</a-list-item>
|
||||
</a-list>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AList from 'ant-design-vue/es/list'
|
||||
import AListItem from 'ant-design-vue/es/list/Item'
|
||||
|
||||
export default {
|
||||
name: "Article",
|
||||
components: {
|
||||
AList,
|
||||
AListItem
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
17
jshERP-web/src/views/account/center/page/Project.vue
Normal file
17
jshERP-web/src/views/account/center/page/Project.vue
Normal file
@@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<a-list>
|
||||
<a-list-item>
|
||||
|
||||
</a-list-item>
|
||||
</a-list>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "Project"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
5
jshERP-web/src/views/account/center/page/index.js
Normal file
5
jshERP-web/src/views/account/center/page/index.js
Normal file
@@ -0,0 +1,5 @@
|
||||
import AppPage from './App'
|
||||
import ArticlePage from './Article'
|
||||
import ProjectPage from './Project'
|
||||
|
||||
export { AppPage, ArticlePage, ProjectPage }
|
||||
103
jshERP-web/src/views/account/settings/AvatarModal.vue
Normal file
103
jshERP-web/src/views/account/settings/AvatarModal.vue
Normal file
@@ -0,0 +1,103 @@
|
||||
<template>
|
||||
<a-modal :visible="visible" title="修改头像" :maskClosable="false" :confirmLoading="confirmLoading" :width="800">
|
||||
<a-row>
|
||||
<a-col :xs="24" :md="12" :style="{height: '350px'}">
|
||||
<vue-cropper
|
||||
ref="cropper"
|
||||
:img="options.img"
|
||||
:info="true"
|
||||
:autoCrop="options.autoCrop"
|
||||
:autoCropWidth="options.autoCropWidth"
|
||||
:autoCropHeight="options.autoCropHeight"
|
||||
:fixedBox="options.fixedBox"
|
||||
@realTime="realTime"
|
||||
>
|
||||
</vue-cropper>
|
||||
</a-col>
|
||||
<a-col :xs="24" :md="12" :style="{height: '350px'}">
|
||||
<div class="avatar-upload-preview">
|
||||
<img :src="previews.url" :style="previews.img"/>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<template slot="footer">
|
||||
<a-button key="back" @click="cancelHandel">取消</a-button>
|
||||
<a-button key="submit" type="primary" :loading="confirmLoading" @click="okHandel">保存</a-button>
|
||||
</template>
|
||||
</a-modal>
|
||||
</template>
|
||||
<script>
|
||||
import { VueCropper } from 'vue-cropper'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
VueCropper
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
id: null,
|
||||
confirmLoading: false,
|
||||
|
||||
options: {
|
||||
img: '/avatar2.jpg',
|
||||
autoCrop: true,
|
||||
autoCropWidth: 200,
|
||||
autoCropHeight: 200,
|
||||
fixedBox: true
|
||||
},
|
||||
previews: {},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
edit(id) {
|
||||
this.visible = true;
|
||||
this.id = id;
|
||||
/* 获取原始头像 */
|
||||
|
||||
},
|
||||
close() {
|
||||
this.id = null;
|
||||
this.visible = false;
|
||||
},
|
||||
cancelHandel() {
|
||||
this.close();
|
||||
},
|
||||
okHandel() {
|
||||
const vm = this
|
||||
|
||||
vm.confirmLoading = true
|
||||
setTimeout(() => {
|
||||
vm.confirmLoading = false
|
||||
vm.close()
|
||||
vm.$message.success('上传头像成功');
|
||||
}, 2000)
|
||||
|
||||
},
|
||||
|
||||
realTime(data) {
|
||||
this.previews = data
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
.avatar-upload-preview {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translate(50%, -50%);
|
||||
width: 180px;
|
||||
height: 180px;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 4px #ccc;
|
||||
overflow: hidden;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
161
jshERP-web/src/views/account/settings/BaseSetting.vue
Normal file
161
jshERP-web/src/views/account/settings/BaseSetting.vue
Normal file
@@ -0,0 +1,161 @@
|
||||
<template>
|
||||
<div class="account-settings-info-view">
|
||||
<a-row :gutter="16">
|
||||
<a-col :md="24" :lg="16">
|
||||
|
||||
<a-form layout="vertical">
|
||||
<a-form-item
|
||||
label="昵称"
|
||||
>
|
||||
<a-input placeholder="给自己起个名字" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="Bio"
|
||||
>
|
||||
<a-textarea rows="4" placeholder="You are not alone."/>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
label="电子邮件"
|
||||
:required="false"
|
||||
>
|
||||
<a-input placeholder="exp@admin.com"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="加密方式"
|
||||
:required="false"
|
||||
>
|
||||
<a-select defaultValue="aes-256-cfb">
|
||||
<a-select-option value="aes-256-cfb">aes-256-cfb</a-select-option>
|
||||
<a-select-option value="aes-128-cfb">aes-128-cfb</a-select-option>
|
||||
<a-select-option value="chacha20">chacha20</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="连接密码"
|
||||
:required="false"
|
||||
>
|
||||
<a-input placeholder="h3gSbecd"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="登陆密码"
|
||||
:required="false"
|
||||
>
|
||||
<a-input placeholder="密码"/>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item>
|
||||
<a-button type="primary">提交</a-button>
|
||||
<a-button style="margin-left: 8px">保存</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
|
||||
</a-col>
|
||||
<a-col :md="24" :lg="8" :style="{ minHeight: '180px' }">
|
||||
<div class="ant-upload-preview" @click="$refs.modal.edit(1)" >
|
||||
<a-icon type="cloud-upload-o" class="upload-icon"/>
|
||||
<div class="mask">
|
||||
<a-icon type="plus" />
|
||||
</div>
|
||||
<img :src="option.img"/>
|
||||
</div>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
|
||||
<avatar-modal ref="modal">
|
||||
|
||||
</avatar-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AvatarModal from './AvatarModal'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AvatarModal
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// cropper
|
||||
preview: {},
|
||||
option: {
|
||||
img: '/avatar2.jpg',
|
||||
info: true,
|
||||
size: 1,
|
||||
outputType: 'jpeg',
|
||||
canScale: false,
|
||||
autoCrop: true,
|
||||
// 只有自动截图开启 宽度高度才生效
|
||||
autoCropWidth: 180,
|
||||
autoCropHeight: 180,
|
||||
fixedBox: true,
|
||||
// 开启宽度和高度比例
|
||||
fixed: true,
|
||||
fixedNumber: [1, 1]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
.avatar-upload-wrapper {
|
||||
height: 200px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ant-upload-preview {
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
width: 100%;
|
||||
max-width: 180px;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 4px #ccc;
|
||||
|
||||
.upload-icon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 10px;
|
||||
font-size: 1.4rem;
|
||||
padding: 0.5rem;
|
||||
background: rgba(222, 221, 221, 0.7);
|
||||
border-radius: 50%;
|
||||
border: 1px solid rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
.mask {
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
background: rgba(0,0,0,0.4);
|
||||
cursor: pointer;
|
||||
transition: opacity 0.4s;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
i {
|
||||
font-size: 2rem;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-left: -1rem;
|
||||
margin-top: -1rem;
|
||||
color: #d6d6d6;
|
||||
}
|
||||
}
|
||||
|
||||
img, .mask {
|
||||
width: 100%;
|
||||
max-width: 180px;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
25
jshERP-web/src/views/account/settings/Binding.vue
Normal file
25
jshERP-web/src/views/account/settings/Binding.vue
Normal file
@@ -0,0 +1,25 @@
|
||||
<template>
|
||||
<a-list
|
||||
itemLayout="horizontal"
|
||||
:dataSource="data"
|
||||
>
|
||||
|
||||
</a-list>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
data: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
75
jshERP-web/src/views/account/settings/Custom.vue
Normal file
75
jshERP-web/src/views/account/settings/Custom.vue
Normal file
@@ -0,0 +1,75 @@
|
||||
<script>
|
||||
import { colorList } from '@/components/tools/setting'
|
||||
import ASwitch from 'ant-design-vue/es/switch'
|
||||
import AList from "ant-design-vue/es/list"
|
||||
import AListItem from "ant-design-vue/es/list/Item"
|
||||
import { mixin } from '@/utils/mixin.js'
|
||||
|
||||
const Meta = AListItem.Meta
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AListItem,
|
||||
AList,
|
||||
ASwitch,
|
||||
Meta
|
||||
},
|
||||
mixins: [mixin],
|
||||
data () {
|
||||
return {
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
themeFilter(theme) {
|
||||
const themeMap = {
|
||||
'dark': '暗色',
|
||||
'light': '白色'
|
||||
}
|
||||
return themeMap[theme]
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
colorFilter(color) {
|
||||
const c = colorList.filter(o => o.color === color)[0]
|
||||
return c && c.key
|
||||
},
|
||||
|
||||
onChange (checked) {
|
||||
if (checked) {
|
||||
this.$store.dispatch('ToggleTheme', 'dark')
|
||||
} else {
|
||||
this.$store.dispatch('ToggleTheme', 'light')
|
||||
}
|
||||
}
|
||||
},
|
||||
render () {
|
||||
return (
|
||||
<AList itemLayout="horizontal">
|
||||
<AListItem>
|
||||
<Meta>
|
||||
<a slot="title">风格配色</a>
|
||||
<span slot="description">
|
||||
整体风格配色设置
|
||||
</span>
|
||||
</Meta>
|
||||
<div slot="actions">
|
||||
<ASwitch checkedChildren="暗色" unCheckedChildren="白色" defaultChecked={this.navTheme === 'dark' && true || false} onChange={this.onChange} />
|
||||
</div>
|
||||
</AListItem>
|
||||
<AListItem>
|
||||
<Meta>
|
||||
<a slot="title">主题色</a>
|
||||
<span slot="description">
|
||||
页面风格配色： <a domPropsInnerHTML={ this.colorFilter(this.primaryColor) }/>
|
||||
</span>
|
||||
</Meta>
|
||||
</AListItem>
|
||||
</AList>
|
||||
)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
154
jshERP-web/src/views/account/settings/Index.vue
Normal file
154
jshERP-web/src/views/account/settings/Index.vue
Normal file
@@ -0,0 +1,154 @@
|
||||
<template>
|
||||
<div class="page-header-index-wide">
|
||||
<a-card :bordered="false" :bodyStyle="{ padding: '16px 0', height: '100%' }" :style="{ height: '100%' }">
|
||||
<div class="account-settings-info-main" :class="device" :style=" 'min-height:'+ mainInfoHeight ">
|
||||
<div class="account-settings-info-left">
|
||||
<a-menu
|
||||
:mode="device == 'mobile' ? 'horizontal' : 'inline'"
|
||||
:style="{ border: '0', width: device == 'mobile' ? '560px' : 'auto'}"
|
||||
:defaultSelectedKeys="defaultSelectedKeys"
|
||||
type="inner"
|
||||
@openChange="onOpenChange"
|
||||
>
|
||||
<a-menu-item key="/account/settings/base">
|
||||
<router-link :to="{ name: 'account-settings-base' }">
|
||||
基本设置
|
||||
</router-link>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="/account/settings/security">
|
||||
<router-link :to="{ name: 'account-settings-security' }">
|
||||
安全设置
|
||||
</router-link>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="/account/settings/custom">
|
||||
<router-link :to="{ name: 'account-settings-custom' }">
|
||||
个性化
|
||||
</router-link>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="/account/settings/binding">
|
||||
<router-link :to="{ name: 'account-settings-binding' }">
|
||||
账户绑定
|
||||
</router-link>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="/account/settings/notification">
|
||||
<router-link :to="{ name: 'account-settings-notification' }">
|
||||
新消息通知
|
||||
</router-link>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</div>
|
||||
<div class="account-settings-info-right">
|
||||
<div class="account-settings-info-title">
|
||||
<span>{{ $route.meta.title }}</span>
|
||||
</div>
|
||||
<route-view></route-view>
|
||||
</div>
|
||||
</div>
|
||||
</a-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PageLayout from '@/components/page/PageLayout'
|
||||
import RouteView from "@/components/layouts/RouteView"
|
||||
import { mixinDevice } from '@/utils/mixin.js'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
RouteView,
|
||||
PageLayout
|
||||
},
|
||||
mixins: [mixinDevice],
|
||||
data () {
|
||||
return {
|
||||
// horizontal inline
|
||||
mode: 'inline',
|
||||
mainInfoHeight:"100%",
|
||||
openKeys: [],
|
||||
defaultSelectedKeys: [],
|
||||
|
||||
// cropper
|
||||
preview: {},
|
||||
option: {
|
||||
img: '/avatar2.jpg',
|
||||
info: true,
|
||||
size: 1,
|
||||
outputType: 'jpeg',
|
||||
canScale: false,
|
||||
autoCrop: true,
|
||||
// 只有自动截图开启 宽度高度才生效
|
||||
autoCropWidth: 180,
|
||||
autoCropHeight: 180,
|
||||
fixedBox: true,
|
||||
// 开启宽度和高度比例
|
||||
fixed: true,
|
||||
fixedNumber: [1, 1]
|
||||
},
|
||||
|
||||
pageTitle: ''
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.updateMenu()
|
||||
},
|
||||
mounted(){
|
||||
this.mainInfoHeight = (window.innerHeight-285)+"px";
|
||||
},
|
||||
methods: {
|
||||
onOpenChange (openKeys) {
|
||||
this.openKeys = openKeys
|
||||
},
|
||||
updateMenu () {
|
||||
let routes = this.$route.matched.concat()
|
||||
this.defaultSelectedKeys = [ routes.pop().path ]
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.account-settings-info-main {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
|
||||
&.mobile {
|
||||
display: block;
|
||||
|
||||
.account-settings-info-left {
|
||||
border-right: unset;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
overflow-x: auto;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.account-settings-info-right {
|
||||
padding: 20px 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.account-settings-info-left {
|
||||
border-right: 1px solid #e8e8e8;
|
||||
width: 224px;
|
||||
}
|
||||
|
||||
.account-settings-info-right {
|
||||
flex: 1 1;
|
||||
padding: 8px 40px;
|
||||
|
||||
.account-settings-info-title {
|
||||
color: rgba(0,0,0,.85);
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
line-height: 28px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.account-settings-info-view {
|
||||
padding-top: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
25
jshERP-web/src/views/account/settings/Notification.vue
Normal file
25
jshERP-web/src/views/account/settings/Notification.vue
Normal file
@@ -0,0 +1,25 @@
|
||||
<template>
|
||||
<a-list
|
||||
itemLayout="horizontal"
|
||||
:dataSource="data"
|
||||
>
|
||||
|
||||
</a-list>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
data: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
41
jshERP-web/src/views/account/settings/Security.vue
Normal file
41
jshERP-web/src/views/account/settings/Security.vue
Normal file
@@ -0,0 +1,41 @@
|
||||
<template>
|
||||
<a-list
|
||||
itemLayout="horizontal"
|
||||
:dataSource="data"
|
||||
>
|
||||
<a-list-item slot="renderItem" slot-scope="item, index" :key="index">
|
||||
<a-list-item-meta>
|
||||
<a slot="title">{{ item.title }}</a>
|
||||
<span slot="description">
|
||||
<span class="security-list-description">{{ item.description }}</span>
|
||||
<span v-if="item.value"> : </span>
|
||||
<span class="security-list-value">{{ item.value }}</span>
|
||||
</span>
|
||||
</a-list-item-meta>
|
||||
<template v-if="item.actions">
|
||||
<a slot="actions" @click="item.actions.callback">{{ item.actions.title }}</a>
|
||||
</template>
|
||||
|
||||
</a-list-item>
|
||||
</a-list>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
data: [
|
||||
{ title: '账户密码' , description: '当前密码强度', value: '强', actions: { title: '修改', callback: () => { this.$message.info('This is a normal message'); } } },
|
||||
{ title: '密保手机' , description: '已绑定手机', value: '138****8293', actions: { title: '修改', callback: () => { this.$message.success('This is a message of success'); } } },
|
||||
{ title: '密保问题' , description: '未设置密保问题，密保问题可有效保护账户安全', value: '', actions: { title: '设置', callback: () => { this.$message.error('This is a message of error'); } } },
|
||||
{ title: '备用邮箱' , description: '已绑定邮箱', value: 'ant***sign.com', actions: { title: '修改', callback: () => { this.$message.warning('This is message of warning'); } } },
|
||||
{ title: 'MFA 设备' , description: '未绑定 MFA 设备，绑定后，可以进行二次确认', value: '', actions: { title: '绑定', callback: () => { this.$message.info('This is a normal message'); } } },
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
162
jshERP-web/src/views/bill/AllocationOutList.vue
Normal file
162
jshERP-web/src/views/bill/AllocationOutList.vue
Normal file
@@ -0,0 +1,162 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<allocation-out-modal ref="modalForm" @ok="modalFormOk"></allocation-out-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import AllocationOutModal from './modules/AllocationOutModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "AllocationOutList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
AllocationOutModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
searchMaterial: "",
|
||||
type: "出库",
|
||||
subType: "调拨"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
162
jshERP-web/src/views/bill/AssembleList.vue
Normal file
162
jshERP-web/src/views/bill/AssembleList.vue
Normal file
@@ -0,0 +1,162 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<assemble-modal ref="modalForm" @ok="modalFormOk"></assemble-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import AssembleModal from './modules/AssembleModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "AssembleList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
AssembleModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
searchMaterial: "",
|
||||
type: "其它",
|
||||
subType: "组装单"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
162
jshERP-web/src/views/bill/DisassembleList.vue
Normal file
162
jshERP-web/src/views/bill/DisassembleList.vue
Normal file
@@ -0,0 +1,162 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<disassemble-modal ref="modalForm" @ok="modalFormOk"></disassemble-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import DisassembleModal from './modules/DisassembleModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "DisassembleList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
DisassembleModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
searchMaterial: "",
|
||||
type: "其它",
|
||||
subType: "拆卸单"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
163
jshERP-web/src/views/bill/OtherInList.vue
Normal file
163
jshERP-web/src/views/bill/OtherInList.vue
Normal file
@@ -0,0 +1,163 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<other-in-modal ref="modalForm" @ok="modalFormOk"></other-in-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import OtherInModal from './modules/OtherInModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "OtherInList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
OtherInModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
searchMaterial: "",
|
||||
type: "入库",
|
||||
subType: "其它"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '供应商名称', dataIndex: 'organName',width:120},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
163
jshERP-web/src/views/bill/OtherOutList.vue
Normal file
163
jshERP-web/src/views/bill/OtherOutList.vue
Normal file
@@ -0,0 +1,163 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<other-out-modal ref="modalForm" @ok="modalFormOk"></other-out-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import OtherOutModal from './modules/OtherOutModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "OtherOutList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
OtherOutModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
searchMaterial: "",
|
||||
type: "出库",
|
||||
subType: "其它"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '客户名称', dataIndex: 'organName',width:120},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
170
jshERP-web/src/views/bill/PurchaseBackList.vue
Normal file
170
jshERP-web/src/views/bill/PurchaseBackList.vue
Normal file
@@ -0,0 +1,170 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<purchase-back-modal ref="modalForm" @ok="modalFormOk"></purchase-back-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import PurchaseBackModal from './modules/PurchaseBackModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "PurchaseBackList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
PurchaseBackModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
searchMaterial: "",
|
||||
type: "出库",
|
||||
subType: "采购退货"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '供应商名称', dataIndex: 'organName',width:120},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{ title: '含税合计', dataIndex: 'totalTaxLastMoney',width:80,
|
||||
customRender:function (text,record,index) {
|
||||
return (record.discountMoney + record.discountLastMoney).toFixed(2);
|
||||
}
|
||||
},
|
||||
{ title: '优惠后金额', dataIndex: 'discountLastMoney',width:100},
|
||||
{ title: '收款', dataIndex: 'changeAmount',width:50},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
170
jshERP-web/src/views/bill/PurchaseInList.vue
Normal file
170
jshERP-web/src/views/bill/PurchaseInList.vue
Normal file
@@ -0,0 +1,170 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<purchase-in-modal ref="modalForm" @ok="modalFormOk"></purchase-in-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import PurchaseInModal from './modules/PurchaseInModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "PurchaseInList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
PurchaseInModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
searchMaterial: "",
|
||||
type: "入库",
|
||||
subType: "采购"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '供应商名称', dataIndex: 'organName',width:120},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{ title: '含税合计', dataIndex: 'totalTaxLastMoney',width:80,
|
||||
customRender:function (text,record,index) {
|
||||
return (record.discountMoney + record.discountLastMoney).toFixed(2);
|
||||
}
|
||||
},
|
||||
{ title: '优惠后金额', dataIndex: 'discountLastMoney',width:100},
|
||||
{ title: '付款', dataIndex: 'changeAmount',width:50},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
174
jshERP-web/src/views/bill/PurchaseOrderList.vue
Normal file
174
jshERP-web/src/views/bill/PurchaseOrderList.vue
Normal file
@@ -0,0 +1,174 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
<a-menu-item key="2" @click="batchSetStatus(1)"><a-icon type="check"/>审核</a-menu-item>
|
||||
<a-menu-item key="3" @click="batchSetStatus(0)"><a-icon type="stop"/>反审核</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
<template slot="customRenderStatus" slot-scope="status">
|
||||
<a-tag v-if="status == '0'" color="red">未审核</a-tag>
|
||||
<a-tag v-if="status == '1'" color="green">已审核</a-tag>
|
||||
<a-tag v-if="status == '2'" color="blue">已转采购</a-tag>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<purchase-order-modal ref="modalForm" @ok="modalFormOk"></purchase-order-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import PurchaseOrderModal from './modules/PurchaseOrderModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "PurchaseOrderList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
PurchaseOrderModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
materialParam: "",
|
||||
type: "其它",
|
||||
subType: "采购订单"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '供应商名称', dataIndex: 'organName',width:120},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{title: '状态', dataIndex: 'status', width: 80, align: "center",
|
||||
scopedSlots: { customRender: 'customRenderStatus' }
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch",
|
||||
batchSetStatusUrl: "/depotHead/batchSetStatus"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
164
jshERP-web/src/views/bill/RetailBackList.vue
Normal file
164
jshERP-web/src/views/bill/RetailBackList.vue
Normal file
@@ -0,0 +1,164 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<retail-back-modal ref="modalForm" @ok="modalFormOk"></retail-back-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import RetailBackModal from './modules/RetailBackModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "RetailBackList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
RetailBackModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
searchMaterial: "",
|
||||
type: "入库",
|
||||
subType: "零售退货"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '会员卡号', dataIndex: 'organName',width:120},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{ title: '付款', dataIndex: 'changeAmount',width:50},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
164
jshERP-web/src/views/bill/RetailOutList.vue
Normal file
164
jshERP-web/src/views/bill/RetailOutList.vue
Normal file
@@ -0,0 +1,164 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<retail-out-modal ref="modalForm" @ok="modalFormOk"></retail-out-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import RetailOutModal from './modules/RetailOutModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "RetailOutList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
RetailOutModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
searchMaterial: "",
|
||||
type: "出库",
|
||||
subType: "零售"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '会员卡号', dataIndex: 'organName',width:120},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{ title: '收款', dataIndex: 'changeAmount',width:50},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
162
jshERP-web/src/views/bill/SaleBackList.vue
Normal file
162
jshERP-web/src/views/bill/SaleBackList.vue
Normal file
@@ -0,0 +1,162 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<sale-back-modal ref="modalForm" @ok="modalFormOk"></sale-back-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import SaleBackModal from './modules/SaleBackModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "SaleBackList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
SaleBackModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
searchMaterial: "",
|
||||
type: "入库",
|
||||
subType: "销售退货"
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '客户名称', dataIndex: 'organName',width:120},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{ title: '含税合计', dataIndex: 'totalTaxLastMoney',width:80,
|
||||
customRender:function (text,record,index) {
|
||||
return (record.discountMoney + record.discountLastMoney).toFixed(2);
|
||||
}
|
||||
},
|
||||
{ title: '优惠后金额', dataIndex: 'discountLastMoney',width:100},
|
||||
{ title: '付款', dataIndex: 'changeAmount',width:50},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
174
jshERP-web/src/views/bill/SaleOrderList.vue
Normal file
174
jshERP-web/src/views/bill/SaleOrderList.vue
Normal file
@@ -0,0 +1,174 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
<a-menu-item key="2" @click="batchSetStatus(1)"><a-icon type="check"/>审核</a-menu-item>
|
||||
<a-menu-item key="3" @click="batchSetStatus(0)"><a-icon type="stop"/>反审核</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
<template slot="customRenderStatus" slot-scope="status">
|
||||
<a-tag v-if="status == '0'" color="red">未审核</a-tag>
|
||||
<a-tag v-if="status == '1'" color="green">已审核</a-tag>
|
||||
<a-tag v-if="status == '2'" color="blue">已转采购</a-tag>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<sale-order-modal ref="modalForm" @ok="modalFormOk"></sale-order-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import SaleOrderModal from './modules/SaleOrderModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "SaleOrderList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
SaleOrderModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
searchMaterial: "",
|
||||
type: "其它",
|
||||
subType: "销售订单"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '客户名称', dataIndex: 'organName',width:120},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{title: '状态', dataIndex: 'status', width: 70, align: "center",
|
||||
scopedSlots: { customRender: 'customRenderStatus' }
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch",
|
||||
batchSetStatusUrl: "/depotHead/batchSetStatus"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
170
jshERP-web/src/views/bill/SaleOutList.vue
Normal file
170
jshERP-web/src/views/bill/SaleOutList.vue
Normal file
@@ -0,0 +1,170 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<sale-out-modal ref="modalForm" @ok="modalFormOk"></sale-out-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import SaleOutModal from './modules/SaleOutModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { BillListMixin } from './mixins/BillListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "SaleOutList",
|
||||
mixins:[JeecgListMixin,BillListMixin],
|
||||
components: {
|
||||
SaleOutModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
number: "",
|
||||
searchMaterial: "",
|
||||
type: "出库",
|
||||
subType: "销售"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '客户名称', dataIndex: 'organName',width:120},
|
||||
{ title: '单据编号', dataIndex: 'number',width:160,
|
||||
customRender:function (text,record,index) {
|
||||
if(record.linkNumber) {
|
||||
return text + "[转]";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '商品信息', dataIndex: 'materialsList',width:220, ellipsis:true,
|
||||
customRender:function (text,record,index) {
|
||||
if(text) {
|
||||
return text.replace(",","，");
|
||||
}
|
||||
}
|
||||
},
|
||||
{ title: '单据日期', dataIndex: 'operTimeStr',width:145},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '金额合计', dataIndex: 'totalPrice',width:80},
|
||||
{ title: '含税合计', dataIndex: 'totalTaxLastMoney',width:80,
|
||||
customRender:function (text,record,index) {
|
||||
return (record.discountMoney + record.discountLastMoney).toFixed(2);
|
||||
}
|
||||
},
|
||||
{ title: '优惠后金额', dataIndex: 'discountLastMoney',width:100},
|
||||
{ title: '收款', dataIndex: 'changeAmount',width:50},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center", width: 150,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/depotHead/list",
|
||||
delete: "/depotHead/delete",
|
||||
deleteBatch: "/depotHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
170
jshERP-web/src/views/bill/dialog/ManyAccountModal.vue
Normal file
170
jshERP-web/src/views/bill/dialog/ManyAccountModal.vue
Normal file
@@ -0,0 +1,170 @@
|
||||
<template>
|
||||
<a-modal
|
||||
:title="title"
|
||||
:width="650"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:20%;height: 60%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="12" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="结算账户1">
|
||||
<a-select style="width:185px;" placeholder="请选择结算账户" v-decorator="[ 'oneAccountId' ]" :dropdownMatchSelectWidth="false" allowClear>
|
||||
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="12" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="结算金额">
|
||||
<a-input-number placeholder="请输入金额" v-decorator.trim="[ 'oneAccountPrice' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="12" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="结算账户2">
|
||||
<a-select style="width:185px;" placeholder="请选择结算账户" v-decorator="[ 'twoAccountId' ]" :dropdownMatchSelectWidth="false" allowClear>
|
||||
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="12" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="结算金额">
|
||||
<a-input-number placeholder="请输入金额" v-decorator.trim="[ 'twoAccountPrice' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="12" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="结算账户3">
|
||||
<a-select style="width:185px;" placeholder="请选择结算账户" v-decorator="[ 'threeAccountId' ]" :dropdownMatchSelectWidth="false" allowClear>
|
||||
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="12" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="结算金额">
|
||||
<a-input-number placeholder="请输入金额" v-decorator.trim="[ 'threeAccountPrice' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import {getAccount} from '@/api/api'
|
||||
export default {
|
||||
name: 'ManyAccountModal',
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
visible: false,
|
||||
model: {},
|
||||
accountList: [],
|
||||
accountIdList: [],
|
||||
accountMoneyList: [],
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this)
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.initAccount()
|
||||
},
|
||||
methods: {
|
||||
edit (idStr, moneyStr) {
|
||||
this.form.resetFields();
|
||||
this.model = Object.assign({}, {});
|
||||
if(idStr && idStr.indexOf(',')>-1) {
|
||||
let idList = idStr.split(",")
|
||||
if(idList[0]) {this.model.oneAccountId = idList[0]-0}
|
||||
if(idList[1]) {this.model.twoAccountId = idList[1]-0}
|
||||
if(idList[2]) {this.model.threeAccountId = idList[2]-0}
|
||||
let moneyList = moneyStr.split(",")
|
||||
if(moneyList[0]) {this.model.oneAccountPrice = moneyList[0]}
|
||||
if(moneyList[1]) {this.model.twoAccountPrice = moneyList[1]}
|
||||
if(moneyList[2]) {this.model.threeAccountPrice = moneyList[2]}
|
||||
}
|
||||
this.visible = true;
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'oneAccountId','oneAccountPrice',
|
||||
'twoAccountId','twoAccountPrice','threeAccountId','threeAccountPrice'))
|
||||
});
|
||||
},
|
||||
close () {
|
||||
this.$emit('close');
|
||||
this.visible = false;
|
||||
},
|
||||
handleOk () {
|
||||
const that = this;
|
||||
// 触发表单验证
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
let allPrice = 0
|
||||
that.confirmLoading = true;
|
||||
let formData = Object.assign(this.model, values);
|
||||
console.log(formData)
|
||||
if(formData.oneAccountId!==undefined) {
|
||||
that.accountIdList.push(formData.oneAccountId)
|
||||
}
|
||||
if(formData.twoAccountId!==undefined) {
|
||||
that.accountIdList.push(formData.twoAccountId)
|
||||
}
|
||||
if(formData.threeAccountId!==undefined) {
|
||||
that.accountIdList.push(formData.threeAccountId)
|
||||
}
|
||||
if(formData.oneAccountPrice!==undefined) {
|
||||
that.accountMoneyList.push(formData.oneAccountPrice)
|
||||
allPrice = allPrice + formData.oneAccountPrice
|
||||
}
|
||||
if(formData.twoAccountPrice!==undefined) {
|
||||
that.accountMoneyList.push(formData.twoAccountPrice)
|
||||
allPrice = allPrice + formData.twoAccountPrice
|
||||
}
|
||||
if(formData.threeAccountPrice!==undefined) {
|
||||
that.accountMoneyList.push(formData.threeAccountPrice)
|
||||
allPrice = allPrice + formData.threeAccountPrice
|
||||
}
|
||||
that.$emit('ok', that.accountIdList, that.accountMoneyList, allPrice);
|
||||
that.close();
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
initAccount(){
|
||||
let that = this;
|
||||
getAccount({}).then((res)=>{
|
||||
if(res && res.code === 200) {
|
||||
that.accountList = res.data.accountList
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
50
jshERP-web/src/views/bill/mixins/BillListMixin.js
Normal file
50
jshERP-web/src/views/bill/mixins/BillListMixin.js
Normal file
@@ -0,0 +1,50 @@
|
||||
export const BillListMixin = {
|
||||
computed: {
|
||||
importExcelUrl: function(){
|
||||
return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
|
||||
},
|
||||
|
||||
isBatchDelEnabled: function () {
|
||||
for (let i = 0; i < this.selectedRowKeys.length; i++) {
|
||||
if (!this.selectionRows[i].actionsEnabled.delete) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
myHandleAdd() {
|
||||
this.$refs.modalForm.action = "add";
|
||||
this.handleAdd();
|
||||
},
|
||||
myHandleEdit(record) {
|
||||
this.$refs.modalForm.action = "edit";
|
||||
this.handleEdit(record);
|
||||
},
|
||||
myHandleDetail(record) {
|
||||
this.$refs.modalForm.action = "detail";
|
||||
this.handleDetail(record);
|
||||
},
|
||||
handleApprove(record) {
|
||||
this.$refs.modalForm.action = "approve";
|
||||
this.$refs.modalForm.edit(record);
|
||||
this.$refs.modalForm.title = "审核";
|
||||
},
|
||||
searchReset() {
|
||||
this.queryParam = {
|
||||
type: this.queryParam.type,
|
||||
subType: this.queryParam.subType
|
||||
}
|
||||
this.loadData(1);
|
||||
},
|
||||
onDateChange: function (value, dateString) {
|
||||
this.queryParam.beginTime=dateString[0];
|
||||
this.queryParam.endTime=dateString[1];
|
||||
},
|
||||
onDateOk(value) {
|
||||
console.log(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
324
jshERP-web/src/views/bill/mixins/BillModalMixin.js
Normal file
324
jshERP-web/src/views/bill/mixins/BillModalMixin.js
Normal file
@@ -0,0 +1,324 @@
|
||||
import { VALIDATE_NO_PASSED, validateFormAndTables } from '@/utils/JEditableTableUtil'
|
||||
import {findBySelectSup,findBySelectCus,findBySelectRetail,getMaterialByBarCode,findStockByDepotAndBarCode,getAccount} from '@/api/api'
|
||||
import { getAction,putAction } from '@/api/manage'
|
||||
import { getMpListShort, getNowFormatDateTime } from "@/utils/util"
|
||||
import Vue from 'vue'
|
||||
|
||||
export const BillModalMixin = {
|
||||
data() {
|
||||
return {
|
||||
action: '',
|
||||
manyAccountBtnStatus: false,
|
||||
supList: [],
|
||||
cusList: [],
|
||||
retailList: [],
|
||||
depotList: [],
|
||||
accountList: [],
|
||||
accountIdList: [],
|
||||
accountMoneyList: [],
|
||||
spans: {
|
||||
labelCol1: {span: 2},
|
||||
wrapperCol1: {span: 22},
|
||||
//1_5: 分为1.5列（相当于占了2/3）
|
||||
labelCol1_5: { span: 3 },
|
||||
wrapperCol1_5: { span: 21 },
|
||||
labelCol2: {span: 4},
|
||||
wrapperCol2: {span: 20},
|
||||
labelCol3: {span: 6},
|
||||
wrapperCol3: {span: 18},
|
||||
labelCol6: {span: 12},
|
||||
wrapperCol6: {span: 12}
|
||||
},
|
||||
};
|
||||
},
|
||||
created () {
|
||||
this.initSupplier()
|
||||
this.initCustomer()
|
||||
this.initRetail()
|
||||
this.initDepot()
|
||||
this.initAccount()
|
||||
},
|
||||
computed: {
|
||||
readOnly: function() {
|
||||
return this.action !== "add" && this.action !== "edit";
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addInit(amountNum) {
|
||||
getAction('/sequence/buildNumber').then((res) => {
|
||||
if (res && res.code === 200) {
|
||||
this.form.setFieldsValue({'number':amountNum + res.data.defaultNumber})
|
||||
}
|
||||
})
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'operTime':getNowFormatDateTime(), 'discount': 0,
|
||||
'discountMoney': 0, 'discountLastMoney': 0, 'otherMoney': 0, 'changeAmount': 0, 'debt': 0})
|
||||
})
|
||||
this.$nextTick(() => {
|
||||
getAccount({}).then((res)=>{
|
||||
if(res && res.code === 200) {
|
||||
for (const item of res.data.accountList) {
|
||||
if(item.isDefault){
|
||||
this.form.setFieldsValue({'accountId': item.id})
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'payType': '现金'})
|
||||
})
|
||||
this.accountIdList = []
|
||||
this.accountMoneyList = []
|
||||
this.manyAccountBtnStatus = false
|
||||
},
|
||||
initSupplier() {
|
||||
let that = this;
|
||||
findBySelectSup({}).then((res)=>{
|
||||
if(res) {
|
||||
that.supList = res;
|
||||
}
|
||||
});
|
||||
},
|
||||
initCustomer() {
|
||||
let that = this;
|
||||
findBySelectCus({}).then((res)=>{
|
||||
if(res) {
|
||||
that.cusList = res;
|
||||
}
|
||||
});
|
||||
},
|
||||
initRetail() {
|
||||
let that = this;
|
||||
findBySelectRetail({}).then((res)=>{
|
||||
if(res) {
|
||||
that.retailList = res;
|
||||
}
|
||||
});
|
||||
},
|
||||
initDepot() {
|
||||
let that = this;
|
||||
getAction('/depot/findDepotByUserId?UBType=UserDepot&UBKeyId=').then((res) => {
|
||||
if (res) {
|
||||
for(let i=0; i<res.length; i++) {
|
||||
let depotInfo = {};
|
||||
depotInfo.value = res[i].id+'' //注意-此处value必须为字符串格式
|
||||
depotInfo.text = res[i].depotName
|
||||
depotInfo.title = res[i].depotName
|
||||
for(let item of that.materialTable.columns){
|
||||
if(item.key == 'depotId' || item.key == 'anotherDepotId') {
|
||||
item.options.push(depotInfo)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
initAccount(){
|
||||
let that = this;
|
||||
getAccount({}).then((res)=>{
|
||||
if(res && res.code === 200) {
|
||||
let list = res.data.accountList
|
||||
list.splice(0,0,{id: 0, name: '多账户'})
|
||||
that.accountList = list
|
||||
}
|
||||
})
|
||||
},
|
||||
handleManyAccount(){
|
||||
this.selectAccount(0)
|
||||
},
|
||||
selectAccount(value){
|
||||
if(value === 0) { //多账户
|
||||
this.$refs.manyAccountModalForm.edit(this.accountIdList, this.accountMoneyList)
|
||||
this.$refs.manyAccountModalForm.title = "多账户结算"
|
||||
this.manyAccountBtnStatus = true
|
||||
} else {
|
||||
this.accountIdList = []
|
||||
this.accountMoneyList = []
|
||||
this.manyAccountBtnStatus = false
|
||||
}
|
||||
},
|
||||
//单元值改变一个字符就触发一次
|
||||
onValueChange(event) {
|
||||
let that = this
|
||||
const { type, row, column, value, target } = event
|
||||
let param,operNumber,unitPrice,taxUnitPrice,allPrice,taxRate,taxMoney,taxLastMoney
|
||||
switch(column.key) {
|
||||
case "depotId":
|
||||
if(row.barCode){
|
||||
that.getStockByDepotBarCode(row, target)
|
||||
}
|
||||
break;
|
||||
case "barCode":
|
||||
param = {
|
||||
barCode: value,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
getMaterialByBarCode(param).then((res) => {
|
||||
if (res && res.code === 200) {
|
||||
target.setValues([{
|
||||
rowKey: row.id,
|
||||
values: {
|
||||
barCode: res.data.mBarCode,
|
||||
name: res.data.name,
|
||||
standard: res.data.standard,
|
||||
model: res.data.model,
|
||||
materialOther: res.data.materialOther,
|
||||
unit: res.data.commodityUnit,
|
||||
operNumber: 1,
|
||||
unitPrice: res.data.purchaseDecimal,
|
||||
taxUnitPrice: res.data.purchaseDecimal,
|
||||
allPrice: res.data.purchaseDecimal,
|
||||
taxRate: 0,
|
||||
taxMoney: 0,
|
||||
taxLastMoney: res.data.purchaseDecimal
|
||||
}
|
||||
}]);
|
||||
that.getStockByDepotBarCode(row, target)
|
||||
target.recalcAllStatisticsColumns()
|
||||
that.autoChangePrice(target)
|
||||
}
|
||||
});
|
||||
break;
|
||||
case "operNumber":
|
||||
operNumber = value-0
|
||||
taxRate = row.taxRate-0 //税率
|
||||
unitPrice = row.unitPrice-0 //单价
|
||||
taxUnitPrice = row.taxUnitPrice-0
|
||||
allPrice = (unitPrice*operNumber).toFixed(2)-0
|
||||
taxMoney =((taxRate*0.01)*allPrice).toFixed(2)-0
|
||||
taxLastMoney = (allPrice + taxMoney).toFixed(2)-0
|
||||
target.setValues([{rowKey: row.id, values: {allPrice: allPrice, taxMoney: taxMoney, taxLastMoney: taxLastMoney}}])
|
||||
target.recalcAllStatisticsColumns()
|
||||
that.autoChangePrice(target)
|
||||
break;
|
||||
case "unitPrice":
|
||||
operNumber = row.operNumber-0 //数量
|
||||
unitPrice = value-0 //单价
|
||||
taxRate = row.taxRate-0 //税率
|
||||
taxUnitPrice = (unitPrice*(1+taxRate*0.01)).toFixed(2)-0
|
||||
allPrice = (unitPrice*operNumber).toFixed(2)-0
|
||||
taxMoney =((taxRate*0.01)*allPrice).toFixed(2)-0
|
||||
taxLastMoney = (allPrice + taxMoney).toFixed(2)-0
|
||||
target.setValues([{rowKey: row.id, values: {taxUnitPrice: taxUnitPrice, allPrice: allPrice, taxMoney: taxMoney, taxLastMoney: taxLastMoney}}])
|
||||
target.recalcAllStatisticsColumns()
|
||||
that.autoChangePrice(target)
|
||||
break;
|
||||
case "allPrice":
|
||||
operNumber = row.operNumber-0 //数量
|
||||
taxRate = row.taxRate-0 //税率
|
||||
allPrice = value-0
|
||||
unitPrice = (allPrice/operNumber).toFixed(2)-0 //单价
|
||||
taxUnitPrice =(unitPrice*(1+taxRate*0.01)).toFixed(2)-0
|
||||
taxMoney =((taxRate*0.01)*allPrice).toFixed(2)-0
|
||||
taxLastMoney = (allPrice + taxMoney).toFixed(2)-0
|
||||
target.setValues([{rowKey: row.id, values: {unitPrice: unitPrice, taxUnitPrice: taxUnitPrice, taxMoney: taxMoney, taxLastMoney: taxLastMoney}}])
|
||||
target.recalcAllStatisticsColumns()
|
||||
that.autoChangePrice(target)
|
||||
break;
|
||||
case "taxRate":
|
||||
operNumber = row.operNumber-0 //数量
|
||||
allPrice = row.allPrice-0
|
||||
unitPrice = row.unitPrice-0
|
||||
taxRate = value-0 //税率
|
||||
taxUnitPrice =(unitPrice*(1+taxRate*0.01)).toFixed(2)-0
|
||||
taxMoney =((taxRate*0.01)*allPrice).toFixed(2)-0
|
||||
taxLastMoney = (allPrice + taxMoney).toFixed(2)-0
|
||||
target.setValues([{rowKey: row.id, values: {taxUnitPrice: taxUnitPrice, taxMoney: taxMoney, taxLastMoney: taxLastMoney}}])
|
||||
target.recalcAllStatisticsColumns()
|
||||
that.autoChangePrice(target)
|
||||
break;
|
||||
case "taxLastMoney":
|
||||
operNumber = row.operNumber-0 //数量
|
||||
taxLastMoney = value-0
|
||||
taxRate = row.taxRate-0 //税率
|
||||
taxUnitPrice = (taxLastMoney/operNumber).toFixed(2)-0
|
||||
unitPrice = (taxUnitPrice/(1+taxRate*0.01)).toFixed(2)-0
|
||||
allPrice = (unitPrice*operNumber).toFixed(2)-0
|
||||
taxMoney =(taxLastMoney-allPrice).toFixed(2)-0
|
||||
target.setValues([{rowKey: row.id, values: {unitPrice: unitPrice, taxUnitPrice: taxUnitPrice, allPrice: allPrice, taxMoney: taxMoney}}])
|
||||
target.recalcAllStatisticsColumns()
|
||||
that.autoChangePrice(target)
|
||||
break;
|
||||
}
|
||||
},
|
||||
//删除一行或多行的时候触发
|
||||
onDeleted(ids, target) {
|
||||
target.recalcAllStatisticsColumns()
|
||||
this.autoChangePrice(target)
|
||||
},
|
||||
//根据仓库和条码查询库存
|
||||
getStockByDepotBarCode(row, target){
|
||||
findStockByDepotAndBarCode({ depotId: row.depotId, barCode: row.barCode }).then((res) => {
|
||||
if (res && res.code === 200) {
|
||||
target.setValues([{rowKey: row.id, values: {stock: res.data.stock}}])
|
||||
target.recalcAllStatisticsColumns()
|
||||
}
|
||||
})
|
||||
},
|
||||
//改变优惠、本次付款、欠款的值
|
||||
autoChangePrice(target) {
|
||||
let allTaxLastMoney = target.statisticsColumns.taxLastMoney
|
||||
let discount = this.form.getFieldValue('discount')-0
|
||||
let otherMoney = this.form.getFieldValue('otherMoney')-0
|
||||
let discountMoney = (discount*0.01*allTaxLastMoney).toFixed(2)-0
|
||||
let discountLastMoney = (allTaxLastMoney-discountMoney).toFixed(2)-0
|
||||
let changeAmountNew = (discountLastMoney + otherMoney).toFixed(2)-0
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'discount':discount,'discountMoney':discountMoney,'discountLastMoney':discountLastMoney,
|
||||
'changeAmount':changeAmountNew,'debt':0})
|
||||
});
|
||||
},
|
||||
//改变优惠率
|
||||
onKeyUpDiscount(e) {
|
||||
const value = e.target.value-0
|
||||
let discountMoney = this.form.getFieldValue('discountMoney')-0
|
||||
let discountLastMoney = this.form.getFieldValue('discountLastMoney')-0
|
||||
let otherMoney = this.form.getFieldValue('otherMoney')-0
|
||||
let allTaxLastMoney = (discountMoney + discountLastMoney).toFixed(2)-0
|
||||
let discountMoneyNew = (allTaxLastMoney*value*0.01).toFixed(2)-0
|
||||
let discountLastMoneyNew = (allTaxLastMoney - discountMoneyNew).toFixed(2)-0
|
||||
let changeAmountNew = (discountLastMoneyNew + otherMoney).toFixed(2)-0
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'discountMoney':discountMoneyNew,'discountLastMoney':discountLastMoneyNew,
|
||||
'changeAmount':changeAmountNew,'debt':0})
|
||||
});
|
||||
},
|
||||
//改变付款优惠
|
||||
onKeyUpDiscountMoney(e) {
|
||||
const value = e.target.value-0
|
||||
let discount = this.form.getFieldValue('discount')-0
|
||||
let discountLastMoney = this.form.getFieldValue('discountLastMoney')-0
|
||||
let otherMoney = this.form.getFieldValue('otherMoney')-0
|
||||
if(discount !== 100) {
|
||||
let allTaxLastMoney = (discountLastMoney/(1-discount/100)).toFixed(2)-0
|
||||
let discountNew = (value/allTaxLastMoney*100).toFixed(2)-0
|
||||
let discountLastMoneyNew = (allTaxLastMoney - value).toFixed(2)-0
|
||||
let changeAmountNew = (discountLastMoneyNew + otherMoney).toFixed(2)-0
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'discount':discountNew,'discountLastMoney':discountLastMoneyNew,
|
||||
'changeAmount':changeAmountNew,'debt':0})
|
||||
});
|
||||
}
|
||||
},
|
||||
//其它费用
|
||||
onKeyUpOtherMoney(e) {
|
||||
const value = e.target.value-0
|
||||
let discountLastMoney = this.form.getFieldValue('discountLastMoney')-0
|
||||
let changeAmountNew = (discountLastMoney + value).toFixed(2)-0
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'changeAmount':changeAmountNew, 'debt':0})
|
||||
});
|
||||
},
|
||||
//改变本次付款
|
||||
onKeyUpChangeAmount(e) {
|
||||
const value = e.target.value-0
|
||||
let discountLastMoney = this.form.getFieldValue('discountLastMoney')-0
|
||||
let otherMoney = this.form.getFieldValue('otherMoney')-0
|
||||
let debtNew = (discountLastMoney + otherMoney - value).toFixed(2)-0
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'debt':debtNew})
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
173
jshERP-web/src/views/bill/modules/AllocationOutModal.vue
Normal file
173
jshERP-web/src/views/bill/modules/AllocationOutModal.vue
Normal file
@@ -0,0 +1,173 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@deleted="onDeleted" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "AllocationOutModal",
|
||||
mixins: [JEditableTableMixin, BillModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '10%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '调入仓库', key: 'anotherDepotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: []},
|
||||
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '5%', type: FormTypes.inputNumber},
|
||||
{ title: '金额', key: 'allPrice', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '5%', type: FormTypes.input }
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
type:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择类型!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("DBCK")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'remark',
|
||||
'discount','discountMoney','discountLastMoney','otherMoney','accountId','changeAmount'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '出库'
|
||||
billMain.subType = '调拨'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
184
jshERP-web/src/views/bill/modules/AssembleModal.vue
Normal file
184
jshERP-web/src/views/bill/modules/AssembleModal.vue
Normal file
@@ -0,0 +1,184 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@added="onAdded"
|
||||
@deleted="onDeleted" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "AssembleModal",
|
||||
mixins: [JEditableTableMixin, BillModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '商品类型',key: 'mType',width:'7%', type: FormTypes.input, readonly: true },
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '10%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '5%', type: FormTypes.inputNumber},
|
||||
{ title: '金额', key: 'allPrice', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '5%', type: FormTypes.input }
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
type:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择类型!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("ZZD")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.model.debt = (this.model.discountLastMoney - this.model.changeAmount).toFixed(2)
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'remark',
|
||||
'discount','discountMoney','discountLastMoney','otherMoney','accountId','changeAmount','debt'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '其它'
|
||||
billMain.subType = '组装单'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
},
|
||||
onAdded(event) {
|
||||
let that = this
|
||||
const { row, target } = event
|
||||
if(target.rows.length>=2) {
|
||||
target.setValues([{rowKey: row.id, values: {mType: '普通子件'}}])
|
||||
} else {
|
||||
target.setValues([{rowKey: row.id, values: {mType: '组合件'}}])
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
183
jshERP-web/src/views/bill/modules/DisassembleModal.vue
Normal file
183
jshERP-web/src/views/bill/modules/DisassembleModal.vue
Normal file
@@ -0,0 +1,183 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@added="onAdded"
|
||||
@deleted="onDeleted" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "DisassembleModal",
|
||||
mixins: [JEditableTableMixin, BillModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '商品类型',key: 'mType',width:'7%', type: FormTypes.input, readonly: true },
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '10%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '5%', type: FormTypes.inputNumber},
|
||||
{ title: '金额', key: 'allPrice', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '5%', type: FormTypes.input }
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
type:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择类型!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("CXD")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'remark',
|
||||
'discount','discountMoney','discountLastMoney','otherMoney','accountId','changeAmount'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '其它'
|
||||
billMain.subType = '拆卸单'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
},
|
||||
onAdded(event) {
|
||||
let that = this
|
||||
const { row, target } = event
|
||||
if(target.rows.length>=2) {
|
||||
target.setValues([{rowKey: row.id, values: {mType: '普通子件'}}])
|
||||
} else {
|
||||
target.setValues([{rowKey: row.id, values: {mType: '组合件'}}])
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
180
jshERP-web/src/views/bill/modules/OtherInModal.vue
Normal file
180
jshERP-web/src/views/bill/modules/OtherInModal.vue
Normal file
@@ -0,0 +1,180 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="供应商">
|
||||
<a-select placeholder="选择供应商" v-decorator="[ 'organId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in supList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@deleted="onDeleted" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "OtherInModal",
|
||||
mixins: [JEditableTableMixin, BillModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '10%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '5%', type: FormTypes.inputNumber},
|
||||
{ title: '金额', key: 'allPrice', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '5%', type: FormTypes.input }
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
type:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择类型!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("QTRK")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'remark',
|
||||
'discount','discountMoney','discountLastMoney','otherMoney','accountId','changeAmount'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '入库'
|
||||
billMain.subType = '其它'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
180
jshERP-web/src/views/bill/modules/OtherOutModal.vue
Normal file
180
jshERP-web/src/views/bill/modules/OtherOutModal.vue
Normal file
@@ -0,0 +1,180 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="客户">
|
||||
<a-select placeholder="选择客户" v-decorator="[ 'organId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in cusList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@deleted="onDeleted" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "OtherOutModal",
|
||||
mixins: [JEditableTableMixin, BillModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '10%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '5%', type: FormTypes.inputNumber},
|
||||
{ title: '金额', key: 'allPrice', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '5%', type: FormTypes.input }
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
type:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择类型!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("QTCK")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'remark',
|
||||
'discount','discountMoney','discountLastMoney','otherMoney','accountId','changeAmount'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '出库'
|
||||
billMain.subType = '其它'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
238
jshERP-web/src/views/bill/modules/PurchaseBackModal.vue
Normal file
238
jshERP-web/src/views/bill/modules/PurchaseBackModal.vue
Normal file
@@ -0,0 +1,238 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="供应商">
|
||||
<a-select placeholder="选择供应商" v-decorator="[ 'organId', validatorRules.organId ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in supList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@deleted="onDeleted" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优惠率">
|
||||
<a-input placeholder="请输入优惠率" v-decorator.trim="[ 'discount' ]" suffix="%" @keyup="onKeyUpDiscount"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="退款优惠">
|
||||
<a-input placeholder="请输入付款优惠" v-decorator.trim="[ 'discountMoney' ]" @keyup="onKeyUpDiscountMoney"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优惠后金额">
|
||||
<a-input placeholder="请输入优惠后金额" v-decorator.trim="[ 'discountLastMoney' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="其它费用">
|
||||
<a-input placeholder="请选择其它费用" v-decorator.trim="[ 'otherMoney' ]" @keyup="onKeyUpOtherMoney"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="结算账户">
|
||||
<a-select placeholder="选择结算账户" v-decorator="[ 'accountId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="本次退款">
|
||||
<a-input placeholder="请输入本次付款" v-decorator.trim="[ 'changeAmount' ]" @keyup="onKeyUpChangeAmount"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="本次欠款">
|
||||
<a-input placeholder="请输入本次欠款" v-decorator.trim="[ 'debt' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "PurchaseBackModal",
|
||||
mixins: [JEditableTableMixin, BillModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '10%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '5%', type: FormTypes.inputNumber},
|
||||
{ title: '含税单价', key: 'taxUnitPrice', width: '6%', type: FormTypes.inputNumber},
|
||||
{ title: '金额', key: 'allPrice', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '税率(%)', key: 'taxRate', width: '6%', type: FormTypes.inputNumber},
|
||||
{ title: '税额', key: 'taxMoney', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '价税合计', key: 'taxLastMoney', width: '6%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '5%', type: FormTypes.input }
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
organId:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择供应商!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("CGTH")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.model.debt = (this.model.discountLastMoney + this.model.otherMoney - this.model.changeAmount).toFixed(2)
|
||||
if(this.model.accountId == null) {
|
||||
this.model.accountId = 0
|
||||
this.manyAccountBtnStatus = true
|
||||
this.accountIdList = this.model.accountIdList
|
||||
this.accountMoneyList = this.model.accountMoneyList
|
||||
} else {
|
||||
this.manyAccountBtnStatus = false
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'remark',
|
||||
'discount','discountMoney','discountLastMoney','otherMoney','accountId','changeAmount','debt'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '出库'
|
||||
billMain.subType = '采购退货'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
260
jshERP-web/src/views/bill/modules/PurchaseInModal.vue
Normal file
260
jshERP-web/src/views/bill/modules/PurchaseInModal.vue
Normal file
@@ -0,0 +1,260 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="供应商">
|
||||
<a-select placeholder="选择供应商" v-decorator="[ 'organId', validatorRules.organId ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in supList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@deleted="onDeleted" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优惠率">
|
||||
<a-input style="width:185px;" placeholder="请输入优惠率" v-decorator.trim="[ 'discount' ]" suffix="%" @keyup="onKeyUpDiscount"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="付款优惠">
|
||||
<a-input placeholder="请输入付款优惠" v-decorator.trim="[ 'discountMoney' ]" @keyup="onKeyUpDiscountMoney"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优惠后金额">
|
||||
<a-input placeholder="请输入优惠后金额" v-decorator.trim="[ 'discountLastMoney' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="其它费用">
|
||||
<a-input placeholder="请输入其它费用" v-decorator.trim="[ 'otherMoney' ]" @keyup="onKeyUpOtherMoney"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="结算账户">
|
||||
<a-select style="width:185px;" placeholder="选择结算账户" v-decorator="[ 'accountId' ]"
|
||||
:dropdownMatchSelectWidth="false" allowClear @select="selectAccount">
|
||||
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
<a-tooltip title="多账户明细">
|
||||
<a-button type="default" icon="folder" style="margin-left: 8px;" size="small" v-show="manyAccountBtnStatus" @click="handleManyAccount"/>
|
||||
</a-tooltip>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="本次付款">
|
||||
<a-input placeholder="请输入本次付款" v-decorator.trim="[ 'changeAmount' ]" @keyup="onKeyUpChangeAmount"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="本次欠款">
|
||||
<a-input placeholder="请输入本次欠款" v-decorator.trim="[ 'debt' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
<many-account-modal ref="manyAccountModalForm" @ok="manyAccountModalFormOk"></many-account-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import ManyAccountModal from '../dialog/ManyAccountModal'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "PurchaseInModal",
|
||||
mixins: [JEditableTableMixin, BillModalMixin],
|
||||
components: {
|
||||
ManyAccountModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '10%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '5%', type: FormTypes.inputNumber},
|
||||
{ title: '含税单价', key: 'taxUnitPrice', width: '6%', type: FormTypes.inputNumber, readonly: true},
|
||||
{ title: '金额', key: 'allPrice', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '税率(%)', key: 'taxRate', width: '6%', type: FormTypes.inputNumber},
|
||||
{ title: '税额', key: 'taxMoney', width: '5%', type: FormTypes.inputNumber, statistics: true , readonly: true},
|
||||
{ title: '价税合计', key: 'taxLastMoney', width: '6%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '5%', type: FormTypes.input }
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
organId:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择供应商!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("CGRK")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.model.debt = (this.model.discountLastMoney + this.model.otherMoney - this.model.changeAmount).toFixed(2)
|
||||
if(this.model.accountId == null) {
|
||||
this.model.accountId = 0
|
||||
this.manyAccountBtnStatus = true
|
||||
this.accountIdList = this.model.accountIdList
|
||||
this.accountMoneyList = this.model.accountMoneyList
|
||||
} else {
|
||||
this.manyAccountBtnStatus = false
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'remark',
|
||||
'discount','discountMoney','discountLastMoney','otherMoney','accountId','changeAmount','debt'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '入库'
|
||||
billMain.subType = '采购'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(billMain.accountId === 0) {
|
||||
billMain.accountId = ''
|
||||
}
|
||||
billMain.accountIdList = this.accountIdList.length>0 ? JSON.stringify(this.accountIdList) : ""
|
||||
billMain.accountMoneyList = this.accountMoneyList.length>0 ? JSON.stringify(this.accountMoneyList) : ""
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
},
|
||||
manyAccountModalFormOk(idList, moneyList, allPrice) {
|
||||
this.accountIdList = idList
|
||||
this.accountMoneyList = moneyList
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'changeAmount':allPrice})
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
182
jshERP-web/src/views/bill/modules/PurchaseOrderModal.vue
Normal file
182
jshERP-web/src/views/bill/modules/PurchaseOrderModal.vue
Normal file
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="供应商">
|
||||
<a-select placeholder="选择供应商" v-decorator="[ 'organId', validatorRules.organId ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in supList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@deleted="onDeleted" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "PurchaseOrderModal",
|
||||
mixins: [JEditableTableMixin,BillModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
supList: [],
|
||||
depotList: [],
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
tableKeys:['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '12%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '10%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '单位', key: 'unit', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '6%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '6%', type: FormTypes.inputNumber },
|
||||
{ title: '金额', key: 'allPrice', width: '6%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '8%', type: FormTypes.input}
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
organId:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择供应商!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("CGDD")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'remark'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
/** 整理成formData */
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '其它'
|
||||
billMain.subType = '采购订单'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
230
jshERP-web/src/views/bill/modules/RetailBackModal.vue
Normal file
230
jshERP-web/src/views/bill/modules/RetailBackModal.vue
Normal file
@@ -0,0 +1,230 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="会员卡号">
|
||||
<a-select placeholder="选择会员卡号" v-decorator="[ 'organId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in retailList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="18" :md="12" :sm="24">
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@deleted="onDeleted" />
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="6" :sm="6"><br/><br/></a-col>
|
||||
<a-col :lg="24" :md="6" :sm="6">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="实付金额">
|
||||
<a-input v-decorator.trim="[ 'changeAmount' ]" :style="{color:'purple'}" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="24" :md="6" :sm="6">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="付款金额">
|
||||
<a-input v-decorator.trim="[ 'getAmount' ]" :style="{color:'red'}" defaultValue="0" @keyup="onKeyUpGetAmount"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="24" :md="6" :sm="6">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="找零">
|
||||
<a-input v-decorator.trim="[ 'backAmount' ]" :style="{color:'green'}" :readOnly="true" defaultValue="0"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="24" :md="6" :sm="6">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="付款账户">
|
||||
<a-select placeholder="选择付款账户" v-decorator="[ 'accountId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "RetailBackModal",
|
||||
mixins: [JEditableTableMixin, BillModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '10%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '10%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '单位', key: 'unit', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '6%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '8%', type: FormTypes.inputNumber},
|
||||
{ title: '金额', key: 'allPrice', width: '8%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '9%', type: FormTypes.input }
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
type:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择类型!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("LSTH")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.model.debt = this.model.discountLastMoney - this.model.changeAmount
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'remark',
|
||||
'discount','discountMoney','discountLastMoney','otherMoney','accountId','changeAmount','debt'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '入库'
|
||||
billMain.subType = '零售退货'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
},
|
||||
//改变实收金额、收款金额的值
|
||||
autoChangePrice(target) {
|
||||
let allLastMoney = target.statisticsColumns.allPrice
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'changeAmount':allLastMoney,'getAmount':allLastMoney,'backAmount':0})
|
||||
});
|
||||
},
|
||||
//改变收款金额
|
||||
onKeyUpGetAmount(e) {
|
||||
const value = e.target.value
|
||||
let changeAmount = this.form.getFieldValue('changeAmount')-0
|
||||
let backAmount = (value - changeAmount).toFixed(2)-0
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'backAmount':backAmount})
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
237
jshERP-web/src/views/bill/modules/RetailOutModal.vue
Normal file
237
jshERP-web/src/views/bill/modules/RetailOutModal.vue
Normal file
@@ -0,0 +1,237 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="会员卡号">
|
||||
<a-select placeholder="选择会员卡号" v-decorator="[ 'organId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in retailList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="付款类型">
|
||||
<a-select placeholder="请选择付款类型" v-decorator="[ 'payType' ]">
|
||||
<a-select-option value="现付">现付</a-select-option>
|
||||
<a-select-option value="预付款">预付款</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="18" :md="12" :sm="24">
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@deleted="onDeleted" />
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="6" :sm="6"><br/><br/></a-col>
|
||||
<a-col :lg="24" :md="6" :sm="6">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="实收金额">
|
||||
<a-input v-decorator.trim="[ 'changeAmount' ]" :style="{color:'purple'}" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="24" :md="6" :sm="6">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="收款金额">
|
||||
<a-input v-decorator.trim="[ 'getAmount' ]" :style="{color:'red'}" defaultValue="0" @keyup="onKeyUpGetAmount"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="24" :md="6" :sm="6">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="找零">
|
||||
<a-input v-decorator.trim="[ 'backAmount' ]" :style="{color:'green'}" :readOnly="true" defaultValue="0"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="24" :md="6" :sm="6">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="收款账户">
|
||||
<a-select placeholder="选择收款账户" v-decorator="[ 'accountId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "RetailOutModal",
|
||||
mixins: [JEditableTableMixin, BillModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '10%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '10%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '单位', key: 'unit', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '6%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '8%', type: FormTypes.inputNumber},
|
||||
{ title: '金额', key: 'allPrice', width: '8%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '9%', type: FormTypes.input }
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
type:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择类型!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("LSCK")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.model.getAmount = this.model.changeAmount
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'payType', 'remark',
|
||||
'discount','discountMoney','discountLastMoney','otherMoney','accountId','changeAmount','getAmount'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '出库'
|
||||
billMain.subType = '零售'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
},
|
||||
//改变实收金额、收款金额的值
|
||||
autoChangePrice(target) {
|
||||
let allLastMoney = target.statisticsColumns.allPrice
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'changeAmount':allLastMoney,'getAmount':allLastMoney,'backAmount':0})
|
||||
});
|
||||
},
|
||||
//改变收款金额
|
||||
onKeyUpGetAmount(e) {
|
||||
const value = e.target.value
|
||||
let changeAmount = this.form.getFieldValue('changeAmount')-0
|
||||
let backAmount = (value - changeAmount).toFixed(2)-0
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'backAmount':backAmount})
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
238
jshERP-web/src/views/bill/modules/SaleBackModal.vue
Normal file
238
jshERP-web/src/views/bill/modules/SaleBackModal.vue
Normal file
@@ -0,0 +1,238 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="客户">
|
||||
<a-select placeholder="选择客户" v-decorator="[ 'organId', validatorRules.organId ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in cusList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@deleted="onDeleted" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优惠率">
|
||||
<a-input placeholder="请输入优惠率" v-decorator.trim="[ 'discount' ]" suffix="%" @keyup="onKeyUpDiscount"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="退款优惠">
|
||||
<a-input placeholder="请输入付款优惠" v-decorator.trim="[ 'discountMoney' ]" @keyup="onKeyUpDiscountMoney"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优惠后金额">
|
||||
<a-input placeholder="请输入优惠后金额" v-decorator.trim="[ 'discountLastMoney' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="其它费用">
|
||||
<a-input placeholder="请选择其它费用" v-decorator.trim="[ 'otherMoney' ]" @keyup="onKeyUpOtherMoney"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="结算账户">
|
||||
<a-select placeholder="选择结算账户" v-decorator="[ 'accountId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="本次退款">
|
||||
<a-input placeholder="请输入本次付款" v-decorator.trim="[ 'changeAmount' ]" @keyup="onKeyUpChangeAmount"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="本次欠款">
|
||||
<a-input placeholder="请输入本次欠款" v-decorator.trim="[ 'debt' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "SaleBackModal",
|
||||
mixins: [JEditableTableMixin, BillModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '10%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '5%', type: FormTypes.inputNumber},
|
||||
{ title: '含税单价', key: 'taxUnitPrice', width: '6%', type: FormTypes.inputNumber},
|
||||
{ title: '金额', key: 'allPrice', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '税率(%)', key: 'taxRate', width: '6%', type: FormTypes.inputNumber},
|
||||
{ title: '税额', key: 'taxMoney', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '价税合计', key: 'taxLastMoney', width: '6%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '5%', type: FormTypes.input }
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
organId:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择客户!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("XSTH")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.model.debt = (this.model.discountLastMoney + this.model.otherMoney - this.model.changeAmount).toFixed(2)
|
||||
if(this.model.accountId == null) {
|
||||
this.model.accountId = 0
|
||||
this.manyAccountBtnStatus = true
|
||||
this.accountIdList = this.model.accountIdList
|
||||
this.accountMoneyList = this.model.accountMoneyList
|
||||
} else {
|
||||
this.manyAccountBtnStatus = false
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'remark',
|
||||
'discount','discountMoney','discountLastMoney','otherMoney','accountId','changeAmount','debt'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '入库'
|
||||
billMain.subType = '销售退货'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
180
jshERP-web/src/views/bill/modules/SaleOrderModal.vue
Normal file
180
jshERP-web/src/views/bill/modules/SaleOrderModal.vue
Normal file
@@ -0,0 +1,180 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="客户">
|
||||
<a-select placeholder="选择客户" v-decorator="[ 'organId', validatorRules.organId ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in cusList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@deleted="onDeleted" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "SaleOrderModal",
|
||||
mixins: [JEditableTableMixin, BillModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '10%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '5%', type: FormTypes.inputNumber},
|
||||
{ title: '金额', key: 'allPrice', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '5%', type: FormTypes.input }
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
organId:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择客户!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("XSDD")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'remark',
|
||||
'discount','discountMoney','discountLastMoney','otherMoney','accountId','changeAmount'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '其它'
|
||||
billMain.subType = '销售订单'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
238
jshERP-web/src/views/bill/modules/SaleOutModal.vue
Normal file
238
jshERP-web/src/views/bill/modules/SaleOutModal.vue
Normal file
@@ -0,0 +1,238 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="客户">
|
||||
<a-select placeholder="选择客户" v-decorator="[ 'organId', validatorRules.organId ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in cusList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['operTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'number' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24"></a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="materialTable.loading"
|
||||
:columns="materialTable.columns"
|
||||
:dataSource="materialTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange"
|
||||
@deleted="onDeleted" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优惠率">
|
||||
<a-input placeholder="请输入优惠率" v-decorator.trim="[ 'discount' ]" suffix="%" @keyup="onKeyUpDiscount"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="收款优惠">
|
||||
<a-input placeholder="请输入付款优惠" v-decorator.trim="[ 'discountMoney' ]" @keyup="onKeyUpDiscountMoney"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优惠后金额">
|
||||
<a-input placeholder="请输入优惠后金额" v-decorator.trim="[ 'discountLastMoney' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="其它费用">
|
||||
<a-input placeholder="请选择其它费用" v-decorator.trim="[ 'otherMoney' ]" @keyup="onKeyUpOtherMoney"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="结算账户">
|
||||
<a-select placeholder="选择结算账户" v-decorator="[ 'accountId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="本次收款">
|
||||
<a-input placeholder="请输入本次付款" v-decorator.trim="[ 'changeAmount' ]" @keyup="onKeyUpChangeAmount"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="本次欠款">
|
||||
<a-input placeholder="请输入本次欠款" v-decorator.trim="[ 'debt' ]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { BillModalMixin } from '../mixins/BillModalMixin'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "SaleOutModal",
|
||||
mixins: [JEditableTableMixin, BillModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1450px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
operTimeStr: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['materialDataTable', ],
|
||||
activeKey: 'materialDataTable',
|
||||
materialTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '仓库名称', key: 'depotId', width: '8%', type: FormTypes.select, placeholder: '请选择${title}', options: [] },
|
||||
{ title: '条码', key: 'barCode', width: '10%', type: FormTypes.popupJsh },
|
||||
{ title: '名称', key: 'name', width: '8%', type: FormTypes.input, readonly: true },
|
||||
{ title: '规格', key: 'standard', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '型号', key: 'model', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '扩展信息', key: 'materialOther', width: '6%', type: FormTypes.input, readonly: true },
|
||||
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.input, readonly: true },
|
||||
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.input, readonly: true },
|
||||
{ title: '数量', key: 'operNumber', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '单价', key: 'unitPrice', width: '5%', type: FormTypes.inputNumber},
|
||||
{ title: '含税单价', key: 'taxUnitPrice', width: '6%', type: FormTypes.inputNumber},
|
||||
{ title: '金额', key: 'allPrice', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '税率(%)', key: 'taxRate', width: '6%', type: FormTypes.inputNumber},
|
||||
{ title: '税额', key: 'taxMoney', width: '5%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '价税合计', key: 'taxLastMoney', width: '6%', type: FormTypes.inputNumber, statistics: true },
|
||||
{ title: '备注', key: 'remark', width: '5%', type: FormTypes.input }
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
operTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
},
|
||||
organId:{
|
||||
rules: [
|
||||
{ required: true, message: '请选择客户!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/depotHead/addDepotHeadAndDetail',
|
||||
edit: '/depotHead/updateDepotHeadAndDetail',
|
||||
detailList: '/depotItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("XSCK")
|
||||
} else {
|
||||
this.model.operTime = this.model.operTimeStr
|
||||
this.model.debt = (this.model.discountLastMoney + this.model.otherMoney - this.model.changeAmount).toFixed(2)
|
||||
if(this.model.accountId == null) {
|
||||
this.model.accountId = 0
|
||||
this.manyAccountBtnStatus = true
|
||||
this.accountIdList = this.model.accountIdList
|
||||
this.accountMoneyList = this.model.accountMoneyList
|
||||
} else {
|
||||
this.manyAccountBtnStatus = false
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'operTime', 'number', 'remark',
|
||||
'discount','discountMoney','discountLastMoney','otherMoney','accountId','changeAmount','debt'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id,
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.materialTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '出库'
|
||||
billMain.subType = '销售'
|
||||
billMain.defaultNumber = billMain.number
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.allPrice-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
27
jshERP-web/src/views/dashboard/Analysis.vue
Normal file
27
jshERP-web/src/views/dashboard/Analysis.vue
Normal file
@@ -0,0 +1,27 @@
|
||||
<template>
|
||||
<div style="margin: 12px 12px 0px;">
|
||||
<index-chart></index-chart>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import IndexChart from './IndexChart'
|
||||
|
||||
export default {
|
||||
name: "Analysis",
|
||||
components: {
|
||||
IndexChart
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
519
jshERP-web/src/views/dashboard/IndexBdc.vue
Normal file
519
jshERP-web/src/views/dashboard/IndexBdc.vue
Normal file
@@ -0,0 +1,519 @@
|
||||
<template>
|
||||
<div class="page-header-index-wide">
|
||||
<a-row :gutter="24">
|
||||
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
|
||||
<chart-card :loading="loading" title="受理量" :total="cardCount.sll | NumberFormat">
|
||||
<a-tooltip title="指标说明" slot="action">
|
||||
<a-icon type="info-circle-o" />
|
||||
</a-tooltip>
|
||||
<div>
|
||||
<mini-area :datasource="chartData.sll" />
|
||||
</div>
|
||||
<template slot="footer">今日受理量：<span>{{ todaySll }}</span></template>
|
||||
</chart-card>
|
||||
</a-col>
|
||||
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
|
||||
<chart-card :loading="loading" title="办结量" :total="cardCount.bjl | NumberFormat">
|
||||
<a-tooltip title="指标说明" slot="action">
|
||||
<a-icon type="info-circle-o" />
|
||||
</a-tooltip>
|
||||
<div>
|
||||
<mini-area :datasource="chartData.bjl"/>
|
||||
</div>
|
||||
<template slot="footer">今日办结量：<span>{{ todayBjl }}</span></template>
|
||||
</chart-card>
|
||||
</a-col>
|
||||
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
|
||||
<chart-card :loading="loading" title="用户受理量" :total="cardCount.isll | NumberFormat">
|
||||
<a-tooltip title="指标说明" slot="action">
|
||||
<a-icon type="info-circle-o" />
|
||||
</a-tooltip>
|
||||
<div>
|
||||
<mini-bar :datasource="chartData.isll" :height="50"/>
|
||||
</div>
|
||||
<template slot="footer">用户今日受理量：<span>{{ todayISll }}</span></template>
|
||||
</chart-card>
|
||||
</a-col>
|
||||
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
|
||||
<chart-card :loading="loading" title="用户办结量" :total="cardCount.ibjl | NumberFormat">
|
||||
<a-tooltip title="指标说明" slot="action">
|
||||
<a-icon type="info-circle-o" />
|
||||
</a-tooltip>
|
||||
<div>
|
||||
<mini-bar :datasource="chartData.ibjl" :height="50"/>
|
||||
</div>
|
||||
<template slot="footer">用户今日办结量：<span>{{ todayIBjl }}</span></template>
|
||||
</chart-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}">
|
||||
<div class="salesCard">
|
||||
<a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
|
||||
<div class="extra-wrapper" slot="tabBarExtraContent">
|
||||
<div class="extra-item">
|
||||
<a>今日</a>
|
||||
<a>本周</a>
|
||||
<a>本月</a>
|
||||
<a>本年</a>
|
||||
</div>
|
||||
<a-range-picker :style="{width: '256px'}" />
|
||||
</div>
|
||||
|
||||
<a-tab-pane loading="true" tab="受理监管" key="1">
|
||||
<a-row>
|
||||
<a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
|
||||
<index-bar title="受理量统计" />
|
||||
</a-col>
|
||||
<a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
|
||||
|
||||
<a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
|
||||
<div class="item-group">
|
||||
<a-row>
|
||||
<a-col :class="'more-btn'" :span="12" v-for="(item,index) in registerTypeList" :key=" 'registerType'+index ">
|
||||
<a-button @click="goPage(index)" style="margin-bottom:10px" size="small" type="primary" ghost>{{ item.text }}</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</a-card>
|
||||
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-tab-pane>
|
||||
|
||||
<a-tab-pane tab="交互监管" key="2">
|
||||
<a-row>
|
||||
<a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
|
||||
<bar-multid :sourceData="jhjgData" :fields="jhjgFields" title="平台与部门交互量统计"></bar-multid>
|
||||
</a-col>
|
||||
<a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
|
||||
|
||||
<a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
|
||||
<div class="item-group">
|
||||
<a-row>
|
||||
<a-col :class="'more-btn'" :span="12" v-for="(item,index) in registerTypeList" :key=" 'registerType'+index ">
|
||||
<a-button @click="goPage(index)" style="margin-bottom:10px" size="small" type="primary" ghost>{{ item.text }}</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</a-card>
|
||||
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-tab-pane>
|
||||
|
||||
<a-tab-pane tab="存储监管" key="4">
|
||||
<a-row>
|
||||
<a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
|
||||
<a-row>
|
||||
<template v-if="diskInfo && diskInfo.length>0">
|
||||
<a-col :span="12" v-for="(item,index) in diskInfo" :key=" 'diskInfo'+index ">
|
||||
<dash-chart-demo :title="item.name" :datasource="item.restPPT"></dash-chart-demo>
|
||||
</a-col>
|
||||
</template>
|
||||
</a-row>
|
||||
</a-col>
|
||||
|
||||
<a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
|
||||
|
||||
<a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
|
||||
<div class="item-group">
|
||||
<a-row>
|
||||
<a-col :class="'more-btn'" :span="10" v-for="(item,index) in registerTypeList" :key=" 'registerType'+index ">
|
||||
<a-button @click="goPage(index)" style="margin-bottom:10px" size="small" type="primary" ghost>{{ item.text }}</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</a-card>
|
||||
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-tab-pane>
|
||||
|
||||
</a-tabs>
|
||||
|
||||
</div>
|
||||
</a-card>
|
||||
|
||||
<a-row :gutter="12">
|
||||
<a-card :loading="loading" :class="{ 'anty-list-cust':true }" :bordered="false" :style="{ marginTop: '24px' }">
|
||||
|
||||
<a-tabs v-model="indexBottomTab" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
|
||||
<div class="extra-wrapper" slot="tabBarExtraContent">
|
||||
<a-radio-group v-model="indexRegisterType" @change="changeRegisterType">
|
||||
<a-radio-button value="转移登记">转移登记</a-radio-button>
|
||||
<a-radio-button value="抵押登记">抵押登记</a-radio-button>
|
||||
<a-radio-button value="">所有</a-radio-button>
|
||||
</a-radio-group>
|
||||
</div>
|
||||
|
||||
<a-tab-pane loading="true" tab="业务流程限时监管" key="1">
|
||||
|
||||
<a-table :dataSource="dataSource1" size="default" rowKey="id" :columns="columns" :pagination="ipagination1" @change="tableChange1">
|
||||
<template slot="flowRate" slot-scope="text, record, index">
|
||||
<a-progress :strokeColor="getPercentColor(record.flowRate)" :format="getPercentFormat" :percent="getFlowRateNumber(record.flowRate)" style="width:80px" />
|
||||
</template>
|
||||
</a-table>
|
||||
</a-tab-pane>
|
||||
|
||||
<a-tab-pane loading="true" tab="业务节点限时监管" key="2">
|
||||
<a-table :dataSource="dataSource2" size="default" rowKey="id" :columns="columns2" :pagination="ipagination2" @change="tableChange2">
|
||||
<template slot="flowRate" slot-scope="text, record, index">
|
||||
<span style="color: red;">{{ record.flowRate }}小时</span>
|
||||
</template>
|
||||
</a-table>
|
||||
</a-tab-pane>
|
||||
|
||||
</a-tabs>
|
||||
|
||||
|
||||
</a-card>
|
||||
</a-row>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import ACol from "ant-design-vue/es/grid/Col"
|
||||
import ATooltip from "ant-design-vue/es/tooltip/Tooltip"
|
||||
import ChartCard from '@/components/ChartCard'
|
||||
import MiniBar from '@/components/chart/MiniBar'
|
||||
import MiniArea from '@/components/chart/MiniArea'
|
||||
import IndexBar from '@/components/chart/IndexBar'
|
||||
import BarMultid from '@/components/chart/BarMultid'
|
||||
import DashChartDemo from '@/components/chart/DashChartDemo'
|
||||
|
||||
const jhjgData = [
|
||||
{ type: '房管', '1月': 900, '2月': 1120, '3月': 1380, '4月': 1480, '5月': 1450, '6月': 1100, '7月':1300, '8月':900,'9月':1000 ,'10月':1200 ,'11月':600 ,'12月':900 },
|
||||
{ type: '税务', '1月':1200, '2月': 1500, '3月': 1980, '4月': 2000, '5月': 1000, '6月': 600, '7月':900, '8月':1100,'9月':1300 ,'10月':2000 ,'11月':900 ,'12月':1100 },
|
||||
{ type: '不动产', '1月':2000, '2月': 1430, '3月': 1300, '4月': 1400, '5月': 900, '6月': 500, '7月':600, '8月':1000,'9月':600 ,'10月':1000 ,'11月':1500 ,'12月':1200 }
|
||||
]
|
||||
|
||||
const jhjgFields=[
|
||||
'1月','2月','3月','4月','5月','6月',
|
||||
'7月','8月','9月','10月','11月','12月'
|
||||
]
|
||||
|
||||
const xljgData = [
|
||||
{type:'一月',"房管":1.12,"税务":1.55,"不动产":1.2},
|
||||
{type:'二月',"房管":1.65,"税务":1.32,"不动产":1.42},
|
||||
{type:'三月',"房管":1.85,"税务":1.1,"不动产":1.5},
|
||||
|
||||
{type:'四月',"房管":1.33,"税务":1.63,"不动产":1.4},
|
||||
{type:'五月',"房管":1.63,"税务":1.8,"不动产":1.7},
|
||||
{type:'六月',"房管":1.85,"税务":1.98,"不动产":1.8},
|
||||
|
||||
{type:'七月',"房管":1.98,"税务":1.5,"不动产":1.76},
|
||||
{type:'八月',"房管":1.48,"税务":1.2,"不动产":1.3},
|
||||
{type:'九月',"房管":1.41,"税务":1.9,"不动产":1.6},
|
||||
|
||||
{type:'十月',"房管":1.1,"税务":1.1,"不动产":1.4},
|
||||
{type:'十一月',"房管":1.85,"税务":1.6,"不动产":1.5},
|
||||
{type:'十二月',"房管":1.5,"税务":1.4,"不动产":1.3}
|
||||
]
|
||||
const xljgFields=["房管","税务","不动产"]
|
||||
|
||||
const dataCol1 = [{
|
||||
title: '业务号',
|
||||
align:"center",
|
||||
dataIndex: 'reBizCode'
|
||||
},{
|
||||
title: '业务类型',
|
||||
align:"center",
|
||||
dataIndex: 'type'
|
||||
},{
|
||||
title: '受理人',
|
||||
align:"center",
|
||||
dataIndex: 'acceptBy'
|
||||
},{
|
||||
title: '受理时间',
|
||||
align:"center",
|
||||
dataIndex: 'acceptDate'
|
||||
},{
|
||||
title: '当前节点',
|
||||
align:"center",
|
||||
dataIndex: 'curNode'
|
||||
},{
|
||||
title: '办理时长',
|
||||
align:"center",
|
||||
dataIndex: 'flowRate',
|
||||
scopedSlots: { customRender: 'flowRate' }
|
||||
}];
|
||||
const dataSource1=[
|
||||
{reBizCode:"1",type:"转移登记",acceptBy:'张三',acceptDate:"2019-01-22",curNode:"任务分派",flowRate:60},
|
||||
{reBizCode:"2",type:"抵押登记",acceptBy:'李四',acceptDate:"2019-01-23",curNode:"领导审核",flowRate:30},
|
||||
{reBizCode:"3",type:"转移登记",acceptBy:'王武',acceptDate:"2019-01-25",curNode:"任务处理",flowRate:20},
|
||||
{reBizCode:"4",type:"转移登记",acceptBy:'赵楼',acceptDate:"2019-11-22",curNode:"部门审核",flowRate:80},
|
||||
{reBizCode:"5",type:"转移登记",acceptBy:'钱就',acceptDate:"2019-12-12",curNode:"任务分派",flowRate:90},
|
||||
{reBizCode:"6",type:"转移登记",acceptBy:'孙吧',acceptDate:"2019-03-06",curNode:"任务处理",flowRate:10},
|
||||
{reBizCode:"7",type:"抵押登记",acceptBy:'周大',acceptDate:"2019-04-13",curNode:"任务分派",flowRate:100},
|
||||
{reBizCode:"8",type:"抵押登记",acceptBy:'吴二',acceptDate:"2019-05-09",curNode:"任务上报",flowRate:50},
|
||||
{reBizCode:"9",type:"抵押登记",acceptBy:'郑爽',acceptDate:"2019-07-12",curNode:"任务处理",flowRate:63},
|
||||
{reBizCode:"20",type:"抵押登记",acceptBy:'林有',acceptDate:"2019-12-12",curNode:"任务打回",flowRate:59},
|
||||
{reBizCode:"11",type:"转移登记",acceptBy:'码云',acceptDate:"2019-09-10",curNode:"任务签收",flowRate:87},
|
||||
]
|
||||
|
||||
const dataCol2 = [{
|
||||
title: '业务号',
|
||||
align:"center",
|
||||
dataIndex: 'reBizCode'
|
||||
},{
|
||||
title: '受理人',
|
||||
align:"center",
|
||||
dataIndex: 'acceptBy'
|
||||
},{
|
||||
title: '发起时间',
|
||||
align:"center",
|
||||
dataIndex: 'acceptDate'
|
||||
},{
|
||||
title: '当前节点',
|
||||
align:"center",
|
||||
dataIndex: 'curNode'
|
||||
},{
|
||||
title: '超时时间',
|
||||
align:"center",
|
||||
dataIndex: 'flowRate',
|
||||
scopedSlots: { customRender: 'flowRate' }
|
||||
}];
|
||||
const dataSource2=[
|
||||
{reBizCode:"A001",type:"转移登记",acceptBy:'张四',acceptDate:"2019-01-22",curNode:"任务分派",flowRate:12},
|
||||
{reBizCode:"A002",type:"抵押登记",acceptBy:'李吧',acceptDate:"2019-01-23",curNode:"任务签收",flowRate:3},
|
||||
{reBizCode:"A003",type:"转移登记",acceptBy:'王三',acceptDate:"2019-01-25",curNode:"任务处理",flowRate:24},
|
||||
{reBizCode:"A004",type:"转移登记",acceptBy:'赵二',acceptDate:"2019-11-22",curNode:"部门审核",flowRate:10},
|
||||
{reBizCode:"A005",type:"转移登记",acceptBy:'钱大',acceptDate:"2019-12-12",curNode:"任务签收",flowRate:8},
|
||||
{reBizCode:"A006",type:"转移登记",acceptBy:'孙就',acceptDate:"2019-03-06",curNode:"任务处理",flowRate:10},
|
||||
{reBizCode:"A007",type:"抵押登记",acceptBy:'周晕',acceptDate:"2019-04-13",curNode:"部门审核",flowRate:24},
|
||||
{reBizCode:"A008",type:"抵押登记",acceptBy:'吴有',acceptDate:"2019-05-09",curNode:"部门审核",flowRate:30},
|
||||
{reBizCode:"A009",type:"抵押登记",acceptBy:'郑武',acceptDate:"2019-07-12",curNode:"任务分派",flowRate:1},
|
||||
{reBizCode:"A0010",type:"抵押登记",acceptBy:'林爽',acceptDate:"2019-12-12",curNode:"部门审核",flowRate:16},
|
||||
{reBizCode:"A0011",type:"转移登记",acceptBy:'码楼',acceptDate:"2019-09-10",curNode:"部门审核",flowRate:7},
|
||||
]
|
||||
|
||||
export default {
|
||||
name: "IndexBdc",
|
||||
components: {
|
||||
ATooltip,
|
||||
ACol,
|
||||
ChartCard,
|
||||
MiniArea,
|
||||
MiniBar,
|
||||
DashChartDemo,
|
||||
BarMultid,
|
||||
IndexBar
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: true,
|
||||
cardCount:{
|
||||
sll:100,
|
||||
bjl:87,
|
||||
isll:15,
|
||||
ibjl:9
|
||||
},
|
||||
|
||||
todaySll:60,
|
||||
todayBjl:54,
|
||||
todayISll:13,
|
||||
todayIBjl:7,
|
||||
|
||||
chartData:{
|
||||
sll:[],
|
||||
bjl:[],
|
||||
isll:[],
|
||||
ibjl:[]
|
||||
},
|
||||
jhjgFields,
|
||||
jhjgData,
|
||||
|
||||
xljgData,
|
||||
xljgFields,
|
||||
|
||||
diskInfo:[
|
||||
{name:"C盘",restPPT:7},
|
||||
{name:"D盘",restPPT:5}
|
||||
],
|
||||
|
||||
registerTypeList:[{
|
||||
text:"业务受理"
|
||||
},{
|
||||
text:"业务管理"
|
||||
},{
|
||||
text:"文件管理"
|
||||
},{
|
||||
text:"信息查询"
|
||||
}],
|
||||
|
||||
dataSource1:[],
|
||||
dataSource2:[],
|
||||
columns:dataCol1,
|
||||
columns2:dataCol2,
|
||||
ipagination1:{
|
||||
current: 1,
|
||||
pageSize: 5,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + "-" + range[1] + " 共" + total + "条"
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0,
|
||||
|
||||
},
|
||||
ipagination2:{
|
||||
current: 1,
|
||||
pageSize: 5,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + "-" + range[1] + " 共" + total + "条"
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0,
|
||||
},
|
||||
indexRegisterType:"转移登记",
|
||||
indexBottomTab:"1"
|
||||
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
goPage(){
|
||||
this.$message.success("根据业务自行处理跳转页面!")
|
||||
},
|
||||
changeRegisterType(e){
|
||||
this.indexRegisterType = e.target.value
|
||||
if(this.indexBottomTab=="1"){
|
||||
this.loadDataSource1()
|
||||
}else{
|
||||
this.loadDataSource2()
|
||||
}
|
||||
},
|
||||
tableChange1(pagination){
|
||||
this.ipagination1.current = pagination.current
|
||||
this.ipagination1.pageSize = pagination.pageSize
|
||||
this.queryTimeoutInfo()
|
||||
},
|
||||
tableChange2(pagination){
|
||||
this.ipagination2.current = pagination.current
|
||||
this.ipagination2.pageSize = pagination.pageSize
|
||||
this.queryNodeTimeoutInfo()
|
||||
},
|
||||
getFlowRateNumber(value){
|
||||
return Number(value)
|
||||
},
|
||||
getPercentFormat(value){
|
||||
if(value==100){
|
||||
return "超时"
|
||||
}else{
|
||||
return value+"%"
|
||||
}
|
||||
},
|
||||
getPercentColor(value){
|
||||
let p = Number(value)
|
||||
if(p>=90 && p<100){
|
||||
return 'rgb(244, 240, 89)'
|
||||
}else if(p>=100){
|
||||
return 'red'
|
||||
}else{
|
||||
return 'rgb(16, 142, 233)'
|
||||
}
|
||||
},
|
||||
|
||||
loadDataSource1(){
|
||||
this.dataSource1 = dataSource1.filter(item=>{
|
||||
if(!this.indexRegisterType){
|
||||
return true
|
||||
}
|
||||
return item.type==this.indexRegisterType
|
||||
})
|
||||
},
|
||||
loadDataSource2(){
|
||||
this.dataSource2 = dataSource2.filter(item=>{
|
||||
if(!this.indexRegisterType){
|
||||
return true
|
||||
}
|
||||
return item.type==this.indexRegisterType
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadDataSource1()
|
||||
this.loadDataSource2()
|
||||
setTimeout(() => {
|
||||
this.loading = !this.loading
|
||||
}, 1000)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.extra-wrapper {
|
||||
line-height: 55px;
|
||||
padding-right: 24px;
|
||||
|
||||
.extra-item {
|
||||
display: inline-block;
|
||||
margin-right: 24px;
|
||||
|
||||
a {
|
||||
margin-left: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-group {
|
||||
padding: 20px 0 8px 24px;
|
||||
font-size: 0;
|
||||
a {
|
||||
color: rgba(0, 0, 0, 0.65);
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
margin-bottom: 13px;
|
||||
width: 25%;
|
||||
}
|
||||
}
|
||||
|
||||
.item-group {
|
||||
.more-btn {
|
||||
margin-bottom: 13px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.list-content-item {
|
||||
color: rgba(0, 0, 0, .45);
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
font-size: 14px;
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1600px) {
|
||||
.list-content-item{
|
||||
margin-left:60px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1300px) {
|
||||
.list-content-item{
|
||||
margin-left:20px;
|
||||
}
|
||||
.width-hidden4{
|
||||
display:none
|
||||
}
|
||||
}
|
||||
.list-content-item{
|
||||
span{line-height: 20px;}
|
||||
}
|
||||
.list-content-item{
|
||||
p{margin-top: 4px;margin-bottom:0;line-height:22px;}
|
||||
}
|
||||
.anty-list-cust {
|
||||
.ant-list-item-meta{flex: 0.3 !important;}
|
||||
}
|
||||
.anty-list-cust {
|
||||
.ant-list-item-content{flex:1 !important; justify-content:flex-start !important;margin-left: 20px;}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
167
jshERP-web/src/views/dashboard/IndexChart.vue
Normal file
167
jshERP-web/src/views/dashboard/IndexChart.vue
Normal file
@@ -0,0 +1,167 @@
|
||||
<template>
|
||||
<div class="page-header-index-wide">
|
||||
<a-row :gutter="24">
|
||||
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
|
||||
<chart-card :loading="loading" title="今日累计销售">
|
||||
<a-tooltip title="指标说明" slot="action">
|
||||
<a-icon type="info-circle-o" />
|
||||
</a-tooltip>
|
||||
<head-info :content="statistics.todaySale"></head-info>
|
||||
</chart-card>
|
||||
</a-col>
|
||||
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
|
||||
<chart-card :loading="loading" title="本月累计销售">
|
||||
<a-tooltip title="指标说明" slot="action">
|
||||
<a-icon type="info-circle-o" />
|
||||
</a-tooltip>
|
||||
<head-info :content="statistics.thisMonthSale"></head-info>
|
||||
</chart-card>
|
||||
</a-col>
|
||||
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
|
||||
<chart-card :loading="loading" title="今日累计进货">
|
||||
<a-tooltip title="指标说明" slot="action">
|
||||
<a-icon type="info-circle-o" />
|
||||
</a-tooltip>
|
||||
<head-info :content="statistics.todayBuy"></head-info>
|
||||
</chart-card>
|
||||
</a-col>
|
||||
<a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
|
||||
<chart-card :loading="loading" title="本月累计进货">
|
||||
<a-tooltip title="指标说明" slot="action">
|
||||
<a-icon type="info-circle-o" />
|
||||
</a-tooltip>
|
||||
<head-info :content="statistics.thisMonthBuy"></head-info>
|
||||
</chart-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :sm="24" :md="12" :xl="12" :style="{ marginBottom: '24px' }">
|
||||
<a-card :loading="loading" :bordered="false" :body-style="{paddingRight: '5'}">
|
||||
<bar title="采购统计" :dataSource="buyPriceData"/>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :sm="24" :md="12" :xl="12" :style="{ marginBottom: '24px' }">
|
||||
<a-card :loading="loading" :bordered="false" :body-style="{paddingRight: '5'}">
|
||||
<bar title="销售统计" :dataSource="salePriceData"/>
|
||||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :sm="24" :md="24" :xl="24" :style="{ marginBottom: '5px' }">
|
||||
<a-card :bordered="false" :body-style="{padding: '5'}">
|
||||
<div class="hidden-xs" style="float:right;">当前版本：V2.3</div>
|
||||
© 2015-2030 {{systemTitle}} - Powered By
|
||||
<a href="http://www.huaxiaerp.com/" target="_blank">官方网站</a>
|
||||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import ChartCard from '@/components/ChartCard'
|
||||
import ACol from "ant-design-vue/es/grid/Col"
|
||||
import ATooltip from "ant-design-vue/es/tooltip/Tooltip"
|
||||
import MiniArea from '@/components/chart/MiniArea'
|
||||
import MiniBar from '@/components/chart/MiniBar'
|
||||
import MiniProgress from '@/components/chart/MiniProgress'
|
||||
import Bar from '@/components/chart/Bar'
|
||||
import LineChartMultid from '@/components/chart/LineChartMultid'
|
||||
import HeadInfo from '@/components/tools/HeadInfo.vue'
|
||||
import Trend from '@/components/Trend'
|
||||
import { getBuyAndSaleStatistics, buyOrSalePrice } from '@/api/api'
|
||||
|
||||
export default {
|
||||
name: "IndexChart",
|
||||
components: {
|
||||
ATooltip,
|
||||
ACol,
|
||||
ChartCard,
|
||||
MiniArea,
|
||||
MiniBar,
|
||||
MiniProgress,
|
||||
Bar,
|
||||
Trend,
|
||||
LineChartMultid,
|
||||
HeadInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
systemTitle: window.SYS_TITLE,
|
||||
loading: true,
|
||||
center: null,
|
||||
statistics: {},
|
||||
buyPriceData: [],
|
||||
salePriceData: [],
|
||||
visitFields:['ip','visit'],
|
||||
visitInfo:[]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
setTimeout(() => {
|
||||
this.loading = !this.loading
|
||||
}, 1000)
|
||||
this.initInfo();
|
||||
},
|
||||
methods: {
|
||||
initInfo () {
|
||||
getBuyAndSaleStatistics(null).then((res)=>{
|
||||
if(res.code === 200){
|
||||
this.statistics = res.data;
|
||||
}
|
||||
})
|
||||
buyOrSalePrice(null).then(res=>{
|
||||
if(res.code === 200){
|
||||
this.buyPriceData = res.data.buyPriceList;
|
||||
this.salePriceData = res.data.salePriceList;
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.circle-cust{
|
||||
position: relative;
|
||||
top: 28px;
|
||||
left: -100%;
|
||||
}
|
||||
.extra-wrapper {
|
||||
line-height: 55px;
|
||||
padding-right: 24px;
|
||||
|
||||
.extra-item {
|
||||
display: inline-block;
|
||||
margin-right: 24px;
|
||||
|
||||
a {
|
||||
margin-left: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
/* 首页访问量统计 */
|
||||
.head-info {
|
||||
position: relative;
|
||||
text-align: left;
|
||||
padding: 0 32px 0 0;
|
||||
min-width: 125px;
|
||||
&.center {
|
||||
text-align: center;
|
||||
padding: 0 32px;
|
||||
}
|
||||
span {
|
||||
color: rgba(0, 0, 0, .45);
|
||||
display: inline-block;
|
||||
font-size: .95rem;
|
||||
line-height: 42px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
p {
|
||||
line-height: 42px;
|
||||
margin: 0;
|
||||
a {
|
||||
font-weight: 600;
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
372
jshERP-web/src/views/dashboard/IndexTask.vue
Normal file
372
jshERP-web/src/views/dashboard/IndexTask.vue
Normal file
@@ -0,0 +1,372 @@
|
||||
<template>
|
||||
<div class="index-container-ty">
|
||||
<a-spin :spinning="loading">
|
||||
<a-row type="flex" justify="start" :gutter="3">
|
||||
<a-col :sm="24" :lg="12">
|
||||
<a-card>
|
||||
<div slot="title" class="index-md-title">
|
||||
<img src="../../assets/daiban.png"/>
|
||||
我的待办【{{ dataSource1.length }}】
|
||||
</div>
|
||||
<div slot="extra">
|
||||
<a v-if="dataSource1 && dataSource1.length>0" slot="footer" @click="goPage">更多 <a-icon type="double-right" /></a>
|
||||
</div>
|
||||
<a-table
|
||||
:class="'my-index-table tytable1'"
|
||||
ref="table1"
|
||||
size="small"
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource1"
|
||||
:pagination="false">
|
||||
<template slot="ellipsisText" slot-scope="text">
|
||||
<j-ellipsis :value="text" :length="textMaxLength"></j-ellipsis>
|
||||
</template>
|
||||
|
||||
<template slot="dayWarnning" slot-scope="text,record">
|
||||
<a-icon type="bulb" theme="twoTone" style="font-size:22px" :twoToneColor="getTipColor(record)"/>
|
||||
</template>
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleData">办理</a>
|
||||
</span>
|
||||
|
||||
</a-table>
|
||||
</a-card>
|
||||
</a-col>
|
||||
|
||||
<a-col :sm="24" :lg="12">
|
||||
<a-card>
|
||||
<div slot="title" class="index-md-title">
|
||||
<img src="../../assets/zaiban.png"/>
|
||||
我的在办【{{ dataSource2.length }}】
|
||||
</div>
|
||||
<div slot="extra">
|
||||
<a v-if="dataSource2 && dataSource2.length>0" slot="footer" @click="goPage">更多 <a-icon type="double-right" /></a>
|
||||
</div>
|
||||
<a-table
|
||||
:class="'my-index-table tytable2'"
|
||||
ref="table2"
|
||||
size="small"
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource2"
|
||||
:pagination="false">
|
||||
<template slot="ellipsisText" slot-scope="text">
|
||||
<j-ellipsis :value="text" :length="textMaxLength"></j-ellipsis>
|
||||
</template>
|
||||
|
||||
<template slot="dayWarnning" slot-scope="text,record">
|
||||
<a-icon type="bulb" theme="twoTone" style="font-size:22px" :twoToneColor="getTipColor(record)"/>
|
||||
</template>
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleData">办理</a>
|
||||
</span>
|
||||
|
||||
</a-table>
|
||||
</a-card>
|
||||
</a-col>
|
||||
|
||||
<a-col :span="24">
|
||||
<div style="height: 5px;"></div>
|
||||
</a-col>
|
||||
|
||||
<a-col :sm="24" :lg="12">
|
||||
<a-card>
|
||||
<div slot="title" class="index-md-title">
|
||||
<img src="../../assets/guaz.png"/>
|
||||
我的挂账【{{ dataSource4.length }}】
|
||||
</div>
|
||||
<a-table
|
||||
:class="'my-index-table tytable4'"
|
||||
ref="table4"
|
||||
size="small"
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource4"
|
||||
:pagination="false">
|
||||
<template slot="ellipsisText" slot-scope="text">
|
||||
<j-ellipsis :value="text" :length="textMaxLength"></j-ellipsis>
|
||||
</template>
|
||||
|
||||
<template slot="dayWarnning" slot-scope="text,record">
|
||||
<a-icon type="bulb" theme="twoTone" style="font-size:22px" :twoToneColor="getTipColor(record)"/>
|
||||
</template>
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleData">办理</a>
|
||||
</span>
|
||||
|
||||
</a-table>
|
||||
</a-card>
|
||||
</a-col>
|
||||
|
||||
<a-col :sm="24" :lg="12">
|
||||
<a-card>
|
||||
<div slot="title" class="index-md-title">
|
||||
<img src="../../assets/duban.png"/>
|
||||
我的督办【{{ dataSource3.length }}】
|
||||
</div>
|
||||
<a-table
|
||||
:class="'my-index-table tytable3'"
|
||||
ref="table3"
|
||||
size="small"
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource3"
|
||||
:pagination="false">
|
||||
<template slot="ellipsisText" slot-scope="text">
|
||||
<j-ellipsis :value="text" :length="textMaxLength"></j-ellipsis>
|
||||
</template>
|
||||
|
||||
<template slot="dayWarnning" slot-scope="text,record">
|
||||
<a-icon type="bulb" theme="twoTone" style="font-size:22px" :twoToneColor="getTipColor(record)"/>
|
||||
</template>
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleData">办理</a>
|
||||
</span>
|
||||
|
||||
</a-table>
|
||||
</a-card>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
</a-spin>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import noDataPng from '@/assets/nodata.png'
|
||||
import JEllipsis from '@/components/jeecg/JEllipsis'
|
||||
|
||||
const tempSs1=[{
|
||||
id:"001",
|
||||
orderNo:"电[1]1267102",
|
||||
orderTitle:"药品出问题了",
|
||||
restDay:1
|
||||
},{
|
||||
id:"002",
|
||||
orderNo:"电[4]5967102",
|
||||
orderTitle:"吃了xxx医院的药，病情越来越严重",
|
||||
restDay:0
|
||||
},{
|
||||
id:"003",
|
||||
orderNo:"电[3]5988987",
|
||||
orderTitle:"今天去超市买鸡蛋，鸡蛋都是坏的",
|
||||
restDay:7
|
||||
},{
|
||||
id:"004",
|
||||
orderNo:"电[2]5213491",
|
||||
orderTitle:"xx宝实体店高价售卖xx",
|
||||
restDay:5
|
||||
},{
|
||||
id:"005",
|
||||
orderNo:"电[1]1603491",
|
||||
orderTitle:"以红利相诱，答应退保后扣一年费用",
|
||||
restDay:0
|
||||
}]
|
||||
|
||||
const tempSs2=[{
|
||||
id:"001",
|
||||
orderTitle:"我要投诉这个大超市",
|
||||
orderNo:"电[1]10299456",
|
||||
restDay:6
|
||||
},{
|
||||
id:"002",
|
||||
orderTitle:"xxx医院乱开药方,售卖假药",
|
||||
orderNo:"电[2]20235691",
|
||||
restDay:0
|
||||
},{
|
||||
id:"003",
|
||||
orderTitle:"我想问问这家店是干啥的",
|
||||
orderNo:"电[3]495867322",
|
||||
restDay:7
|
||||
},{
|
||||
id:"004",
|
||||
orderTitle:"我要举报朝阳区奥森公园酒店",
|
||||
orderNo:"电[2]1193849",
|
||||
restDay:3
|
||||
},{
|
||||
id:"005",
|
||||
orderTitle:"我今天吃饭吃到一个石头子",
|
||||
orderNo:"电[4]56782344",
|
||||
restDay:9
|
||||
}]
|
||||
|
||||
//4-7天
|
||||
const tip_green = "rgba(0, 255, 0, 1)"
|
||||
//1-3天
|
||||
const tip_yellow = "rgba(255, 255, 0, 1)"
|
||||
//超期
|
||||
const tip_red = "rgba(255, 0, 0, 1)"
|
||||
|
||||
export default {
|
||||
name: "IndexTask",
|
||||
components:{ JEllipsis },
|
||||
data() {
|
||||
return {
|
||||
loading:false,
|
||||
textMaxLength:8,
|
||||
dataSource1:[],
|
||||
dataSource2:[],
|
||||
dataSource3:[],
|
||||
dataSource4:[],
|
||||
columns: [
|
||||
{
|
||||
title: '',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:50,
|
||||
fixed:'left',
|
||||
align:"center",
|
||||
scopedSlots: {customRender: "dayWarnning"}
|
||||
},
|
||||
{
|
||||
title:'剩余天数',
|
||||
align:"center",
|
||||
dataIndex: 'restDay',
|
||||
width:80
|
||||
},
|
||||
{
|
||||
title:'工单标题',
|
||||
align:"center",
|
||||
dataIndex: 'orderTitle',
|
||||
scopedSlots: {customRender: "ellipsisText"}
|
||||
},
|
||||
{
|
||||
title:'工单编号',
|
||||
align:"center",
|
||||
dataIndex: 'orderNo',
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center",
|
||||
scopedSlots: { customRender: 'action' }
|
||||
}
|
||||
]
|
||||
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.mock();
|
||||
},
|
||||
mounted(){
|
||||
|
||||
},
|
||||
methods: {
|
||||
getTipColor(rd){
|
||||
let num = rd.restDay
|
||||
if(num<=0){
|
||||
return tip_red
|
||||
}else if(num>=1 && num<4){
|
||||
return tip_yellow
|
||||
}else if(num>=4){
|
||||
return tip_green
|
||||
}
|
||||
},
|
||||
goPage(){
|
||||
this.$message.success("请根据具体业务跳转页面")
|
||||
//this.$router.push({ path: '/comp/mytask' })
|
||||
},
|
||||
mock(){
|
||||
this.dataSource1=tempSs1
|
||||
this.dataSource2=tempSs2
|
||||
this.dataSource3=tempSs1
|
||||
this.dataSource4=[]
|
||||
this.ifNullDataSource(this.dataSource4,'.tytable4')
|
||||
},
|
||||
|
||||
ifNullDataSource(ds,tb){
|
||||
this.$nextTick(()=>{
|
||||
if(!ds || ds.length==0){
|
||||
var tmp = document.createElement('img');
|
||||
tmp.src=noDataPng
|
||||
tmp.width=300
|
||||
let tbclass=`${tb} .ant-table-placeholder`
|
||||
document.querySelector(tbclass).innerHTML=""
|
||||
document.querySelector(tbclass).appendChild(tmp)
|
||||
}
|
||||
})
|
||||
},
|
||||
handleData(){
|
||||
this.$message.success("办理完成")
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.my-index-table{height:270px}
|
||||
.my-index-table table{font-size: 14px !important;}
|
||||
|
||||
.index-container-ty .ant-card-head-title{padding-top: 6px;padding-bottom: 6px;}
|
||||
.index-container-ty .ant-card-extra{padding:0}
|
||||
.index-container-ty .ant-card-extra a{color:#fff}
|
||||
.index-container-ty .ant-card-extra a:hover{color:#152ede}
|
||||
.index-container-ty .ant-card-head-wrapper,.index-container-ty .ant-card-head{
|
||||
line-height:24px;
|
||||
min-height:24px;
|
||||
/*background: #90aeff;*/
|
||||
background: #7196fb;
|
||||
}
|
||||
.index-container-ty .ant-card-body{padding: 10px 12px 0px 12px}
|
||||
|
||||
/* .index-container-ty .ant-card-actions{background: #fff}
|
||||
.index-container-ty .ant-card-actions li {margin:2px 0;}
|
||||
.index-container-ty .ant-card-actions > li > span{width: 100%}*/
|
||||
|
||||
|
||||
.index-container-ty .ant-table-footer{text-align: right;padding:6px 12px 6px 6px;background: #fff;border-top: 2px solid #f7f1f1;}
|
||||
|
||||
.index-md-title{
|
||||
postion:relative;
|
||||
padding-left:24px;
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
font-size: 21px;
|
||||
font-family: cursive;
|
||||
}
|
||||
.index-md-title img{
|
||||
position: absolute;
|
||||
height:32px;
|
||||
top: 2px;
|
||||
left:14px;
|
||||
}
|
||||
|
||||
.index-container-ty .ant-card-body{
|
||||
/*border-left:1px solid #90aeff;
|
||||
/*border-right:1px solid #90aeff;
|
||||
border-bottom:1px solid #90aeff;*/
|
||||
}
|
||||
|
||||
|
||||
.index-container-ty .ant-table-thead > tr > th,
|
||||
.index-container-ty .ant-table-tbody > tr > td{
|
||||
border-bottom: 1px solid #90aeff;
|
||||
}
|
||||
|
||||
.index-container-ty .ant-table-small > .ant-table-content > .ant-table-fixed-left > .ant-table-body-outer > .ant-table-body-inner > table > .ant-table-thead > tr > th,
|
||||
.index-container-ty .ant-table-small > .ant-table-content > .ant-table-fixed-right > .ant-table-body-outer > .ant-table-body-inner > table > .ant-table-thead > tr > th{
|
||||
border-bottom: 1px solid #90aeff;
|
||||
}
|
||||
|
||||
.index-container-ty .ant-table-small > .ant-table-content > .ant-table-scroll > .ant-table-body > table > .ant-table-thead > tr > th{
|
||||
border-bottom: 1px solid #90aeff;
|
||||
}
|
||||
|
||||
.index-container-ty .ant-table-small{
|
||||
border: 1px solid #90aeff;
|
||||
}
|
||||
|
||||
.index-container-ty .ant-table-placeholder {
|
||||
padding: 0
|
||||
}
|
||||
</style>
|
||||
15
jshERP-web/src/views/dashboard/Monitor.vue
Normal file
15
jshERP-web/src/views/dashboard/Monitor.vue
Normal file
@@ -0,0 +1,15 @@
|
||||
<template>
|
||||
<div>
|
||||
Monitor
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "Monitor"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
360
jshERP-web/src/views/dashboard/Workplace.vue
Normal file
360
jshERP-web/src/views/dashboard/Workplace.vue
Normal file
@@ -0,0 +1,360 @@
|
||||
<template>
|
||||
<page-layout :avatar="avatar">
|
||||
<div slot="headerContent">
|
||||
<div class="title">{{ timeFix }}，{{ nickname() }}<span class="welcome-text">，{{ welcome() }}</span></div>
|
||||
<div>前端工程师 | 蚂蚁金服 - 某某某事业群 - VUE平台</div>
|
||||
</div>
|
||||
<div slot="extra">
|
||||
<a-row class="more-info">
|
||||
<a-col :span="8">
|
||||
<head-info title="项目数" content="56" :center="false" :bordered="false"/>
|
||||
</a-col>
|
||||
<a-col :span="8">
|
||||
<head-info title="团队排名" content="8/24" :center="false" :bordered="false"/>
|
||||
</a-col>
|
||||
<a-col :span="8">
|
||||
<head-info title="项目访问" content="2,223" :center="false" />
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<a-row :gutter="24">
|
||||
<a-col :xl="16" :lg="24" :md="24" :sm="24" :xs="24">
|
||||
<a-card
|
||||
class="project-list"
|
||||
:loading="loading"
|
||||
style="margin-bottom: 24px;"
|
||||
:bordered="false"
|
||||
title="进行中的项目"
|
||||
:body-style="{ padding: 0 }">
|
||||
<a slot="extra">全部项目</a>
|
||||
<div>
|
||||
<a-card-grid class="project-card-grid" :key="i" v-for="(item, i) in projects">
|
||||
<a-card :bordered="false" :body-style="{ padding: 0 }">
|
||||
<a-card-meta>
|
||||
<div slot="title" class="card-title">
|
||||
<a-avatar size="small" :src="item.cover"/>
|
||||
<a>{{ item.title }}</a>
|
||||
</div>
|
||||
<div slot="description" class="card-description">
|
||||
{{ item.description }}
|
||||
</div>
|
||||
</a-card-meta>
|
||||
<div class="project-item">
|
||||
<a href="/#/">科学搬砖组</a>
|
||||
<span class="datetime">9小时前</span>
|
||||
</div>
|
||||
</a-card>
|
||||
</a-card-grid>
|
||||
</div>
|
||||
</a-card>
|
||||
|
||||
<a-card :loading="loading" title="动态" :bordered="false">
|
||||
<a-list>
|
||||
<a-list-item :key="index" v-for="(item, index) in activities">
|
||||
<a-list-item-meta>
|
||||
<a-avatar slot="avatar" :src="item.user.avatar" />
|
||||
<div slot="title">
|
||||
<span>{{ item.user.nickname }}</span>
|
||||
在 <a href="#">{{ item.project.name }}</a>
|
||||
<span>{{ item.project.action }}</span>
|
||||
<a href="#">{{ item.project.event }}</a>
|
||||
</div>
|
||||
<div slot="description">{{ item.time }}</div>
|
||||
</a-list-item-meta>
|
||||
</a-list-item>
|
||||
</a-list>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col
|
||||
style="padding: 0 12px"
|
||||
:xl="8"
|
||||
:lg="24"
|
||||
:md="24"
|
||||
:sm="24"
|
||||
:xs="24">
|
||||
<a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
|
||||
<div class="item-group">
|
||||
<a>操作一</a>
|
||||
<a>操作二</a>
|
||||
<a>操作三</a>
|
||||
<a>操作四</a>
|
||||
<a>操作五</a>
|
||||
<a>操作六</a>
|
||||
<a-button size="small" type="primary" ghost icon="plus">添加</a-button>
|
||||
</div>
|
||||
</a-card>
|
||||
<a-card title="XX 指数" style="margin-bottom: 24px" :loading="radarLoading" :bordered="false" :body-style="{ padding: 0 }">
|
||||
<div style="min-height: 400px;">
|
||||
<!-- :scale="scale" :axis1Opts="axis1Opts" :axis2Opts="axis2Opts" -->
|
||||
<radar :data="radarData" />
|
||||
</div>
|
||||
</a-card>
|
||||
<a-card :loading="loading" title="团队" :bordered="false">
|
||||
<div class="members">
|
||||
<a-row>
|
||||
<a-col :span="12" v-for="(item, index) in teams" :key="index">
|
||||
<a>
|
||||
<a-avatar size="small" :src="item.avatar" />
|
||||
<span class="member">{{ item.name }}</span>
|
||||
</a>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</page-layout>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { timeFix } from "@/utils/util"
|
||||
import {mapGetters} from "vuex"
|
||||
|
||||
import PageLayout from '@/components/page/PageLayout'
|
||||
import HeadInfo from '@/components/tools/HeadInfo'
|
||||
import Radar from '@/components/chart/Radar'
|
||||
import { getRoleList, getServiceList, getFileAccessHttpUrl } from "@/api/manage"
|
||||
|
||||
const DataSet = require('@antv/data-set')
|
||||
|
||||
export default {
|
||||
name: "Workplace",
|
||||
components: {
|
||||
PageLayout,
|
||||
HeadInfo,
|
||||
Radar
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
timeFix: timeFix(),
|
||||
avatar: '',
|
||||
user: {},
|
||||
|
||||
projects: [],
|
||||
loading: true,
|
||||
radarLoading: true,
|
||||
activities: [],
|
||||
teams: [],
|
||||
|
||||
// data
|
||||
axis1Opts: {
|
||||
dataKey: 'item',
|
||||
line: null,
|
||||
tickLine: null,
|
||||
grid: {
|
||||
lineStyle: {
|
||||
lineDash: null
|
||||
},
|
||||
hideFirstLine: false
|
||||
}
|
||||
},
|
||||
axis2Opts: {
|
||||
dataKey: 'score',
|
||||
line: null,
|
||||
tickLine: null,
|
||||
grid: {
|
||||
type: 'polygon',
|
||||
lineStyle: {
|
||||
lineDash: null
|
||||
}
|
||||
}
|
||||
},
|
||||
scale: [{
|
||||
dataKey: 'score',
|
||||
min: 0,
|
||||
max: 80
|
||||
}],
|
||||
axisData: [
|
||||
{ item: '引用', a: 70, b: 30, c: 40 },
|
||||
{ item: '口碑', a: 60, b: 70, c: 40 },
|
||||
{ item: '产量', a: 50, b: 60, c: 40 },
|
||||
{ item: '贡献', a: 40, b: 50, c: 40 },
|
||||
{ item: '热度', a: 60, b: 70, c: 40 },
|
||||
{ item: '引用', a: 70, b: 50, c: 40 }
|
||||
],
|
||||
radarData: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
userInfo() {
|
||||
return this.$store.getters.userInfo
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.user = this.userInfo
|
||||
this.avatar = getFileAccessHttpUrl(this.userInfo.avatar)
|
||||
console.log('this.avatar :'+ this.avatar)
|
||||
|
||||
getRoleList().then(res => {
|
||||
console.log('workplace -> call getRoleList()', res)
|
||||
})
|
||||
|
||||
getServiceList().then(res => {
|
||||
console.log('workplace -> call getServiceList()', res)
|
||||
})
|
||||
},
|
||||
mounted() {
|
||||
this.getProjects()
|
||||
this.getActivity()
|
||||
this.getTeams()
|
||||
this.initRadar()
|
||||
},
|
||||
methods: {
|
||||
...mapGetters(["nickname", "welcome"]),
|
||||
getProjects() {
|
||||
this.$http.get('/api/list/search/projects')
|
||||
.then(res => {
|
||||
this.projects = res.result && res.result.data
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
getActivity() {
|
||||
this.$http.get('/api/workplace/activity')
|
||||
.then(res => {
|
||||
this.activities = res.result
|
||||
})
|
||||
},
|
||||
getTeams() {
|
||||
this.$http.get('/api/workplace/teams')
|
||||
.then(res => {
|
||||
this.teams = res.result
|
||||
})
|
||||
},
|
||||
initRadar() {
|
||||
this.radarLoading = true
|
||||
|
||||
this.$http.get('/api/workplace/radar')
|
||||
.then(res => {
|
||||
|
||||
const dv = new DataSet.View().source(res.result)
|
||||
dv.transform({
|
||||
type: 'fold',
|
||||
fields: ['个人', '团队', '部门'],
|
||||
key: 'user',
|
||||
value: 'score'
|
||||
})
|
||||
|
||||
this.radarData = dv.rows
|
||||
this.radarLoading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.project-list {
|
||||
|
||||
.card-title {
|
||||
font-size: 0;
|
||||
|
||||
a {
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
margin-left: 12px;
|
||||
line-height: 24px;
|
||||
height: 24px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
font-size: 14px;
|
||||
|
||||
&:hover {
|
||||
color: #1890ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.card-description {
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
height: 44px;
|
||||
line-height: 22px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.project-item {
|
||||
display: flex;
|
||||
margin-top: 8px;
|
||||
overflow: hidden;
|
||||
font-size: 12px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
a {
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
display: inline-block;
|
||||
flex: 1 1 0;
|
||||
|
||||
&:hover {
|
||||
color: #1890ff;
|
||||
}
|
||||
}
|
||||
.datetime {
|
||||
color: rgba(0, 0, 0, 0.25);
|
||||
flex: 0 0 auto;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
.ant-card-meta-description {
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
height: 44px;
|
||||
line-height: 22px;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.item-group {
|
||||
padding: 20px 0 8px 24px;
|
||||
font-size: 0;
|
||||
a {
|
||||
color: rgba(0, 0, 0, 0.65);
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
margin-bottom: 13px;
|
||||
width: 25%;
|
||||
}
|
||||
}
|
||||
|
||||
.members {
|
||||
a {
|
||||
display: block;
|
||||
margin: 12px 0;
|
||||
line-height: 24px;
|
||||
height: 24px;
|
||||
.member {
|
||||
font-size: 14px;
|
||||
color: rgba(0, 0, 0, .65);
|
||||
line-height: 24px;
|
||||
max-width: 100px;
|
||||
vertical-align: top;
|
||||
margin-left: 12px;
|
||||
transition: all 0.3s;
|
||||
display: inline-block;
|
||||
}
|
||||
&:hover {
|
||||
span {
|
||||
color: #1890ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mobile {
|
||||
|
||||
.project-list {
|
||||
|
||||
.project-card-grid {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.more-info {
|
||||
border: 0;
|
||||
padding-top: 16px;
|
||||
margin: 16px 0 16px;
|
||||
}
|
||||
|
||||
.headerContent .title .welcome-text {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
17
jshERP-web/src/views/exception/403.vue
Normal file
17
jshERP-web/src/views/exception/403.vue
Normal file
@@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<exception-page type="403" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ExceptionPage from './ExceptionPage'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
ExceptionPage
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
17
jshERP-web/src/views/exception/404.vue
Normal file
17
jshERP-web/src/views/exception/404.vue
Normal file
@@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<exception-page type="404" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ExceptionPage from './ExceptionPage'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
ExceptionPage
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
17
jshERP-web/src/views/exception/500.vue
Normal file
17
jshERP-web/src/views/exception/500.vue
Normal file
@@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<exception-page type="500" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ExceptionPage from './ExceptionPage'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
ExceptionPage
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
88
jshERP-web/src/views/exception/ExceptionPage.vue
Normal file
88
jshERP-web/src/views/exception/ExceptionPage.vue
Normal file
@@ -0,0 +1,88 @@
|
||||
<template>
|
||||
<div class="exception">
|
||||
<div class="img">
|
||||
<img :src="config[type].img"/>
|
||||
</div>
|
||||
<div class="content">
|
||||
<h1>{{ config[type].title }}</h1>
|
||||
<div class="desc">{{ config[type].desc }}</div>
|
||||
<div class="action">
|
||||
<a-button type="primary" @click="handleToHome">返回首页</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import types from './type'
|
||||
|
||||
export default {
|
||||
name: "Exception",
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default: '404'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
config: types
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleToHome () {
|
||||
this.$router.push({ name: 'dashboard' })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.exception {
|
||||
min-height: 500px;
|
||||
height: 80%;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
margin-top: 150px;
|
||||
.img {
|
||||
display: inline-block;
|
||||
padding-right: 52px;
|
||||
zoom: 1;
|
||||
img {
|
||||
height: 360px;
|
||||
max-width: 430px;
|
||||
}
|
||||
}
|
||||
.content {
|
||||
display: inline-block;
|
||||
flex: auto;
|
||||
h1 {
|
||||
color: #434e59;
|
||||
font-size: 72px;
|
||||
font-weight: 600;
|
||||
line-height: 72px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.desc {
|
||||
color: rgba(0, 0, 0, .45);
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mobile {
|
||||
.exception {
|
||||
margin-top: 30px;
|
||||
.img {
|
||||
padding-right: unset;
|
||||
|
||||
img {
|
||||
height: 40%;
|
||||
max-width: 80%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
19
jshERP-web/src/views/exception/type.js
Normal file
19
jshERP-web/src/views/exception/type.js
Normal file
@@ -0,0 +1,19 @@
|
||||
const types = {
|
||||
403: {
|
||||
img: 'https://gw.alipayobjects.com/zos/rmsportal/wZcnGqRDyhPOEYFcZDnb.svg',
|
||||
title: '403',
|
||||
desc: '抱歉，你无权访问该页面'
|
||||
},
|
||||
404: {
|
||||
img: 'https://gw.alipayobjects.com/zos/rmsportal/KpnpchXsobRgLElEozzI.svg',
|
||||
title: '404',
|
||||
desc: '抱歉，你访问的页面不存在或仍在开发中'
|
||||
},
|
||||
500: {
|
||||
img: 'https://gw.alipayobjects.com/zos/rmsportal/RVRUAYdCGeYNBWoKiIwB.svg',
|
||||
title: '500',
|
||||
desc: '抱歉，服务器出错了'
|
||||
}
|
||||
}
|
||||
|
||||
export default types
|
||||
143
jshERP-web/src/views/financial/AdvanceInList.vue
Normal file
143
jshERP-web/src/views/financial/AdvanceInList.vue
Normal file
@@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号" v-model="queryParam.billNo"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<advance-in-modal ref="modalForm" @ok="modalFormOk"></advance-in-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import AdvanceInModal from './modules/AdvanceInModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { FinancialListMixin } from './mixins/FinancialListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "AdvanceInList",
|
||||
mixins:[JeecgListMixin, FinancialListMixin],
|
||||
components: {
|
||||
AdvanceInModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
billNo: "",
|
||||
searchMaterial: "",
|
||||
type: "收预付款"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '付款会员', dataIndex: 'organName',width:140},
|
||||
{ title: '单据编号', dataIndex: 'billNo',width:160},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '单据日期 ', dataIndex: 'billTimeStr',width:160},
|
||||
{ title: '合计', dataIndex: 'totalPrice',width:80},
|
||||
{ title: '备注', dataIndex: 'remark',width:200},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center",
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/accountHead/list",
|
||||
delete: "/accountHead/delete",
|
||||
deleteBatch: "/accountHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
142
jshERP-web/src/views/financial/GiroList.vue
Normal file
142
jshERP-web/src/views/financial/GiroList.vue
Normal file
@@ -0,0 +1,142 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号" v-model="queryParam.billNo"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<giro-modal ref="modalForm" @ok="modalFormOk"></giro-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import GiroModal from './modules/GiroModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { FinancialListMixin } from './mixins/FinancialListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "GiroList",
|
||||
mixins:[JeecgListMixin, FinancialListMixin],
|
||||
components: {
|
||||
GiroModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
billNo: "",
|
||||
searchMaterial: "",
|
||||
type: "转账"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '单据编号', dataIndex: 'billNo',width:160},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '单据日期 ', dataIndex: 'billTimeStr',width:160},
|
||||
{ title: '合计', dataIndex: 'totalPrice',width:80},
|
||||
{ title: '备注', dataIndex: 'remark',width:200},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center",
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/accountHead/list",
|
||||
delete: "/accountHead/delete",
|
||||
deleteBatch: "/accountHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
143
jshERP-web/src/views/financial/ItemInList.vue
Normal file
143
jshERP-web/src/views/financial/ItemInList.vue
Normal file
@@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号" v-model="queryParam.billNo"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<item-in-modal ref="modalForm" @ok="modalFormOk"></item-in-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import ItemInModal from './modules/ItemInModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { FinancialListMixin } from './mixins/FinancialListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "ItemInList",
|
||||
mixins:[JeecgListMixin, FinancialListMixin],
|
||||
components: {
|
||||
ItemInModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
billNo: "",
|
||||
searchMaterial: "",
|
||||
type: "收入"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '往来单位', dataIndex: 'organName',width:140},
|
||||
{ title: '单据编号', dataIndex: 'billNo',width:160},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '单据日期 ', dataIndex: 'billTimeStr',width:160},
|
||||
{ title: '合计', dataIndex: 'totalPrice',width:80},
|
||||
{ title: '备注', dataIndex: 'remark',width:200},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center",
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/accountHead/list",
|
||||
delete: "/accountHead/delete",
|
||||
deleteBatch: "/accountHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
143
jshERP-web/src/views/financial/ItemOutList.vue
Normal file
143
jshERP-web/src/views/financial/ItemOutList.vue
Normal file
@@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号" v-model="queryParam.billNo"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<item-out-modal ref="modalForm" @ok="modalFormOk"></item-out-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import ItemOutModal from './modules/ItemOutModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { FinancialListMixin } from './mixins/FinancialListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "ItemOutList",
|
||||
mixins:[JeecgListMixin, FinancialListMixin],
|
||||
components: {
|
||||
ItemOutModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
billNo: "",
|
||||
searchMaterial: "",
|
||||
type: "支出"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '往来单位', dataIndex: 'organName',width:140},
|
||||
{ title: '单据编号', dataIndex: 'billNo',width:160},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '单据日期 ', dataIndex: 'billTimeStr',width:160},
|
||||
{ title: '合计', dataIndex: 'totalPrice',width:80},
|
||||
{ title: '备注', dataIndex: 'remark',width:200},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center",
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/accountHead/list",
|
||||
delete: "/accountHead/delete",
|
||||
deleteBatch: "/accountHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
143
jshERP-web/src/views/financial/MoneyInList.vue
Normal file
143
jshERP-web/src/views/financial/MoneyInList.vue
Normal file
@@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号" v-model="queryParam.billNo"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<money-in-modal ref="modalForm" @ok="modalFormOk"></money-in-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import MoneyInModal from './modules/MoneyInModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { FinancialListMixin } from './mixins/FinancialListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "MoneyInList",
|
||||
mixins:[JeecgListMixin, FinancialListMixin],
|
||||
components: {
|
||||
MoneyInModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
billNo: "",
|
||||
searchMaterial: "",
|
||||
type: "收款"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '付款单位', dataIndex: 'organName',width:140},
|
||||
{ title: '单据编号', dataIndex: 'billNo',width:160},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '单据日期 ', dataIndex: 'billTimeStr',width:160},
|
||||
{ title: '合计', dataIndex: 'totalPrice',width:80},
|
||||
{ title: '备注', dataIndex: 'remark',width:200},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center",
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/accountHead/list",
|
||||
delete: "/accountHead/delete",
|
||||
deleteBatch: "/accountHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
143
jshERP-web/src/views/financial/MoneyOutList.vue
Normal file
143
jshERP-web/src/views/financial/MoneyOutList.vue
Normal file
@@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入单据编号" v-model="queryParam.billNo"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="10">
|
||||
<a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-range-picker
|
||||
style="width: 210px"
|
||||
v-model="queryParam.createTimeRange"
|
||||
format="YYYY-MM-DD"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
@change="onDateChange"
|
||||
@ok="onDateOk"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="myHandleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="myHandleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<money-out-modal ref="modalForm" @ok="modalFormOk"></money-out-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import MoneyOutModal from './modules/MoneyOutModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { FinancialListMixin } from './mixins/FinancialListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "MoneyOutList",
|
||||
mixins:[JeecgListMixin, FinancialListMixin],
|
||||
components: {
|
||||
MoneyOutModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
billNo: "",
|
||||
searchMaterial: "",
|
||||
type: "付款"
|
||||
},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{ title: '收款单位', dataIndex: 'organName',width:140},
|
||||
{ title: '单据编号', dataIndex: 'billNo',width:160},
|
||||
{ title: '操作员', dataIndex: 'userName',width:80},
|
||||
{ title: '单据日期 ', dataIndex: 'billTimeStr',width:160},
|
||||
{ title: '合计', dataIndex: 'totalPrice',width:80},
|
||||
{ title: '备注', dataIndex: 'remark',width:200},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center",
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/accountHead/list",
|
||||
delete: "/accountHead/delete",
|
||||
deleteBatch: "/accountHead/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
49
jshERP-web/src/views/financial/mixins/FinancialListMixin.js
Normal file
49
jshERP-web/src/views/financial/mixins/FinancialListMixin.js
Normal file
@@ -0,0 +1,49 @@
|
||||
export const FinancialListMixin = {
|
||||
computed: {
|
||||
importExcelUrl: function(){
|
||||
return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
|
||||
},
|
||||
|
||||
isBatchDelEnabled: function () {
|
||||
for (let i = 0; i < this.selectedRowKeys.length; i++) {
|
||||
if (!this.selectionRows[i].actionsEnabled.delete) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
myHandleAdd() {
|
||||
this.$refs.modalForm.action = "add";
|
||||
this.handleAdd();
|
||||
},
|
||||
myHandleEdit(record) {
|
||||
this.$refs.modalForm.action = "edit";
|
||||
this.handleEdit(record);
|
||||
},
|
||||
myHandleDetail(record) {
|
||||
this.$refs.modalForm.action = "detail";
|
||||
this.handleDetail(record);
|
||||
},
|
||||
handleApprove(record) {
|
||||
this.$refs.modalForm.action = "approve";
|
||||
this.$refs.modalForm.edit(record);
|
||||
this.$refs.modalForm.title = "审核";
|
||||
},
|
||||
searchReset() {
|
||||
this.queryParam = {
|
||||
type: this.queryParam.type
|
||||
}
|
||||
this.loadData(1);
|
||||
},
|
||||
onDateChange: function (value, dateString) {
|
||||
this.queryParam.beginTime=dateString[0];
|
||||
this.queryParam.endTime=dateString[1];
|
||||
},
|
||||
onDateOk(value) {
|
||||
console.log(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
174
jshERP-web/src/views/financial/mixins/FinancialModalMixin.js
Normal file
174
jshERP-web/src/views/financial/mixins/FinancialModalMixin.js
Normal file
@@ -0,0 +1,174 @@
|
||||
import { VALIDATE_NO_PASSED, validateFormAndTables } from '@/utils/JEditableTableUtil'
|
||||
import {findBySelectSup,findBySelectCus,findBySelectRetail,findStockByDepotAndBarCode,getAccount,getPersonByType,findInOutItemByParam} from '@/api/api'
|
||||
import { getAction,putAction } from '@/api/manage'
|
||||
import { getMpListShort, getNowFormatDateTime } from "@/utils/util"
|
||||
import Vue from 'vue'
|
||||
|
||||
export const FinancialModalMixin = {
|
||||
data() {
|
||||
return {
|
||||
action: '',
|
||||
supList: [],
|
||||
cusList: [],
|
||||
retailList: [],
|
||||
personList: [],
|
||||
accountList: [],
|
||||
spans: {
|
||||
labelCol1: {span: 2},
|
||||
wrapperCol1: {span: 22},
|
||||
//1_5: 分为1.5列（相当于占了2/3）
|
||||
labelCol1_5: { span: 3 },
|
||||
wrapperCol1_5: { span: 21 },
|
||||
labelCol2: {span: 4},
|
||||
wrapperCol2: {span: 20},
|
||||
labelCol3: {span: 6},
|
||||
wrapperCol3: {span: 18},
|
||||
labelCol6: {span: 12},
|
||||
wrapperCol6: {span: 12}
|
||||
},
|
||||
};
|
||||
},
|
||||
created () {
|
||||
this.initSupplier()
|
||||
this.initCustomer()
|
||||
this.initRetail()
|
||||
this.initPerson()
|
||||
},
|
||||
computed: {
|
||||
readOnly: function() {
|
||||
return this.action !== "add" && this.action !== "edit";
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addInit(amountNum) {
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'billTime':getNowFormatDateTime()})
|
||||
});
|
||||
getAction('/sequence/buildNumber').then((res) => {
|
||||
if (res && res.code === 200) {
|
||||
this.form.setFieldsValue({'billNo':amountNum + res.data.defaultNumber})
|
||||
}
|
||||
})
|
||||
},
|
||||
initSupplier() {
|
||||
let that = this;
|
||||
findBySelectSup({}).then((res)=>{
|
||||
if(res) {
|
||||
that.supList = res;
|
||||
}
|
||||
});
|
||||
},
|
||||
initCustomer() {
|
||||
let that = this;
|
||||
findBySelectCus({}).then((res)=>{
|
||||
if(res) {
|
||||
that.cusList = res;
|
||||
}
|
||||
});
|
||||
},
|
||||
initRetail() {
|
||||
let that = this;
|
||||
findBySelectRetail({}).then((res)=>{
|
||||
if(res) {
|
||||
that.retailList = res;
|
||||
}
|
||||
});
|
||||
},
|
||||
initPerson() {
|
||||
let that = this;
|
||||
getPersonByType({type:'财务员'}).then((res)=>{
|
||||
if(res && res.code === 200) {
|
||||
that.personList = res.data.personList;
|
||||
}
|
||||
})
|
||||
},
|
||||
initInOutItem(type) {
|
||||
let that = this;
|
||||
findInOutItemByParam({type:type}).then((res)=>{
|
||||
if(res) {
|
||||
for(let i=0; i<res.length; i++) {
|
||||
let inOutItemInfo = {};
|
||||
inOutItemInfo.value = res[i].id+'' //注意-此处value必须为字符串格式
|
||||
inOutItemInfo.text = res[i].name
|
||||
inOutItemInfo.title = res[i].name
|
||||
for(let item of that.accountTable.columns){
|
||||
if(item.key == 'inOutItemId') {
|
||||
item.options.push(inOutItemInfo)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
//账户-用于主表
|
||||
initAccount(){
|
||||
let that = this;
|
||||
getAccount({}).then((res)=>{
|
||||
if(res && res.code === 200) {
|
||||
that.accountList = res.data.accountList;
|
||||
}
|
||||
})
|
||||
},
|
||||
//账户-用于明细
|
||||
initDetailAccount(){
|
||||
let that = this;
|
||||
getAccount({}).then((res)=>{
|
||||
if(res && res.code === 200) {
|
||||
let list = res.data.accountList;
|
||||
for(let i=0; i<list.length; i++) {
|
||||
let accountInfo = {};
|
||||
accountInfo.value = list[i].id+'' //注意-此处value必须为字符串格式
|
||||
accountInfo.text = list[i].name
|
||||
accountInfo.title = list[i].name
|
||||
for(let item of that.accountTable.columns){
|
||||
if(item.key == 'accountId') {
|
||||
item.options.push(accountInfo)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
//单元值改变一个字符就触发一次
|
||||
onValueChange(event) {
|
||||
let that = this
|
||||
const { type, row, column, value, target } = event
|
||||
let param,operNumber,unitPrice,allPrice,taxRate,taxMoney,taxLastMoney
|
||||
switch(column.key) {
|
||||
case "operNumber":
|
||||
unitPrice = row.unitPrice
|
||||
taxRate = row.taxRate
|
||||
allPrice = unitPrice*value
|
||||
taxMoney =(taxRate/100)*allPrice
|
||||
taxLastMoney = allPrice + taxMoney
|
||||
target.setValues([{rowKey: row.id, values: {allPrice: allPrice, taxMoney: taxMoney, taxLastMoney: taxLastMoney}}])
|
||||
target.recalcAllStatisticsColumns()
|
||||
let allTaxLastMoney = target.statisticsColumns.taxLastMoney
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({'discount':0,'discountMoney':0,'discountLastMoney':allTaxLastMoney,
|
||||
'changeAmount':allTaxLastMoney,'debt':0})
|
||||
});
|
||||
break;
|
||||
case "unitPrice":
|
||||
operNumber = row.operNumber
|
||||
target.setValues([{rowKey: row.id, values: {allPrice: value*operNumber}}])
|
||||
target.recalcAllStatisticsColumns()
|
||||
break;
|
||||
case "allPrice":
|
||||
operNumber = row.operNumber
|
||||
target.setValues([{rowKey: row.id, values: {unitPrice: value/operNumber}}])
|
||||
target.recalcAllStatisticsColumns()
|
||||
break;
|
||||
}
|
||||
},
|
||||
//根据仓库和条码查询库存
|
||||
getStockByDepotBarCode(row, target){
|
||||
findStockByDepotAndBarCode({ depotId: row.depotId, barCode: row.barCode }).then((res) => {
|
||||
if (res && res.code === 200) {
|
||||
target.setValues([{rowKey: row.id, values: {stock: res.data.stock}}])
|
||||
target.recalcAllStatisticsColumns()
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
180
jshERP-web/src/views/financial/modules/AdvanceInModal.vue
Normal file
180
jshERP-web/src/views/financial/modules/AdvanceInModal.vue
Normal file
@@ -0,0 +1,180 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="付款会员">
|
||||
<a-select placeholder="选择付款会员" v-decorator="[ 'organId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in retailList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="经手人">
|
||||
<a-select placeholder="选择经手人" v-decorator="[ 'handsPersonId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in personList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['billTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'billNo' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="accountTable.loading"
|
||||
:columns="accountTable.columns"
|
||||
:dataSource="accountTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优惠金额">
|
||||
<a-input placeholder="请输入优惠金额" v-decorator.trim="[ 'changeAmount' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { FinancialModalMixin } from '../mixins/FinancialModalMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "MoneyInModal",
|
||||
mixins: [JEditableTableMixin, FinancialModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1200px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['accountDataTable', ],
|
||||
activeKey: 'accountDataTable',
|
||||
accountTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '账户名称',key: 'accountId',width: '20%', type: FormTypes.select, placeholder: '请选择${title}', options: []},
|
||||
{ title: '金额',key: 'eachAmount', width: '10%', type: FormTypes.inputNumber, statistics: true, placeholder: '请选择${title}' },
|
||||
{ title: '备注',key: 'remark', width: '30%', type: FormTypes.input, placeholder: '请选择${title}'}
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
billTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/accountHead/addAccountHeadAndDetail',
|
||||
edit: '/accountHead/updateAccountHeadAndDetail',
|
||||
detailList: '/accountItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.initDetailAccount()
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("SYF")
|
||||
} else {
|
||||
this.model.billTime = this.model.billTimeStr
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'handsPersonId', 'billTime', 'billNo', 'remark', 'changeAmount'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.accountTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '收预付款'
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.eachAmount-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
182
jshERP-web/src/views/financial/modules/GiroModal.vue
Normal file
182
jshERP-web/src/views/financial/modules/GiroModal.vue
Normal file
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="经手人">
|
||||
<a-select placeholder="选择经手人" v-decorator="[ 'handsPersonId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in personList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['billTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'billNo' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="accountTable.loading"
|
||||
:columns="accountTable.columns"
|
||||
:dataSource="accountTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="付款账户">
|
||||
<a-select placeholder="选择付款账户" v-decorator="[ 'accountId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="实付金额">
|
||||
<a-input placeholder="请输入实付金额" v-decorator.trim="[ 'changeAmount' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { FinancialModalMixin } from '../mixins/FinancialModalMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "MoneyInModal",
|
||||
mixins: [JEditableTableMixin, FinancialModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1200px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['accountDataTable', ],
|
||||
activeKey: 'accountDataTable',
|
||||
accountTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '账户名称',key: 'accountId',width: '20%', type: FormTypes.select, placeholder: '请选择${title}', options: []},
|
||||
{ title: '金额',key: 'eachAmount', width: '10%', type: FormTypes.inputNumber, statistics: true, placeholder: '请选择${title}' },
|
||||
{ title: '备注',key: 'remark', width: '30%', type: FormTypes.input, placeholder: '请选择${title}'}
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
billTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/accountHead/addAccountHeadAndDetail',
|
||||
edit: '/accountHead/updateAccountHeadAndDetail',
|
||||
detailList: '/accountItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.initAccount()
|
||||
this.initDetailAccount()
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("ZZ")
|
||||
} else {
|
||||
this.model.billTime = this.model.billTimeStr
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'handsPersonId', 'billTime', 'billNo', 'remark',
|
||||
'accountId', 'changeAmount'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.accountTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '转账'
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.eachAmount-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
189
jshERP-web/src/views/financial/modules/ItemInModal.vue
Normal file
189
jshERP-web/src/views/financial/modules/ItemInModal.vue
Normal file
@@ -0,0 +1,189 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="往来单位">
|
||||
<a-select placeholder="选择往来单位" v-decorator="[ 'organId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in cusList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="经手人">
|
||||
<a-select placeholder="选择经手人" v-decorator="[ 'handsPersonId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in personList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['billTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'billNo' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="accountTable.loading"
|
||||
:columns="accountTable.columns"
|
||||
:dataSource="accountTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="收款账户">
|
||||
<a-select placeholder="选择收款账户" v-decorator="[ 'accountId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="收款金额">
|
||||
<a-input placeholder="请输入收款金额" v-decorator.trim="[ 'changeAmount' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { FinancialModalMixin } from '../mixins/FinancialModalMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "ItemInModal",
|
||||
mixins: [JEditableTableMixin, FinancialModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1200px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['accountDataTable', ],
|
||||
activeKey: 'accountDataTable',
|
||||
accountTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '收入项目',key: 'inOutItemId',width: '20%', type: FormTypes.select, placeholder: '请选择${title}', options: []},
|
||||
{ title: '金额',key: 'eachAmount', width: '10%', type: FormTypes.inputNumber, statistics: true, placeholder: '请选择${title}' },
|
||||
{ title: '备注',key: 'remark', width: '30%', type: FormTypes.input, placeholder: '请选择${title}'}
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
billTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/accountHead/addAccountHeadAndDetail',
|
||||
edit: '/accountHead/updateAccountHeadAndDetail',
|
||||
detailList: '/accountItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.initInOutItem('in')
|
||||
this.initAccount()
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("SR")
|
||||
} else {
|
||||
this.model.billTime = this.model.billTimeStr
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'handsPersonId', 'billTime', 'billNo', 'remark',
|
||||
'accountId','changeAmount'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.accountTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '收入'
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.eachAmount-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
189
jshERP-web/src/views/financial/modules/ItemOutModal.vue
Normal file
189
jshERP-web/src/views/financial/modules/ItemOutModal.vue
Normal file
@@ -0,0 +1,189 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="往来单位">
|
||||
<a-select placeholder="选择往来单位" v-decorator="[ 'organId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in supList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="经手人">
|
||||
<a-select placeholder="选择经手人" v-decorator="[ 'handsPersonId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in personList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['billTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'billNo' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="accountTable.loading"
|
||||
:columns="accountTable.columns"
|
||||
:dataSource="accountTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="付款账户">
|
||||
<a-select placeholder="选择付款账户" v-decorator="[ 'accountId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="付款金额">
|
||||
<a-input placeholder="请输入付款金额" v-decorator.trim="[ 'changeAmount' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { FinancialModalMixin } from '../mixins/FinancialModalMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "ItemOutModal",
|
||||
mixins: [JEditableTableMixin, FinancialModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1200px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['accountDataTable', ],
|
||||
activeKey: 'accountDataTable',
|
||||
accountTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '支出项目',key: 'inOutItemId',width: '20%', type: FormTypes.select, placeholder: '请选择${title}', options: []},
|
||||
{ title: '金额',key: 'eachAmount', width: '10%', type: FormTypes.inputNumber, statistics: true, placeholder: '请选择${title}' },
|
||||
{ title: '备注',key: 'remark', width: '30%', type: FormTypes.input, placeholder: '请选择${title}'}
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
billTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/accountHead/addAccountHeadAndDetail',
|
||||
edit: '/accountHead/updateAccountHeadAndDetail',
|
||||
detailList: '/accountItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.initInOutItem('out')
|
||||
this.initAccount()
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("ZC")
|
||||
} else {
|
||||
this.model.billTime = this.model.billTimeStr
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'handsPersonId', 'billTime', 'billNo', 'remark',
|
||||
'accountId','changeAmount'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.accountTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '支出'
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.eachAmount-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
180
jshERP-web/src/views/financial/modules/MoneyInModal.vue
Normal file
180
jshERP-web/src/views/financial/modules/MoneyInModal.vue
Normal file
@@ -0,0 +1,180 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="付款单位">
|
||||
<a-select placeholder="选择付款单位" v-decorator="[ 'organId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in cusList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="经手人">
|
||||
<a-select placeholder="选择经手人" v-decorator="[ 'handsPersonId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in personList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['billTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'billNo' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="accountTable.loading"
|
||||
:columns="accountTable.columns"
|
||||
:dataSource="accountTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优惠金额">
|
||||
<a-input placeholder="请输入优惠金额" v-decorator.trim="[ 'changeAmount' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { FinancialModalMixin } from '../mixins/FinancialModalMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "MoneyInModal",
|
||||
mixins: [JEditableTableMixin, FinancialModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1200px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['accountDataTable', ],
|
||||
activeKey: 'accountDataTable',
|
||||
accountTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '账户名称',key: 'accountId',width: '20%', type: FormTypes.select, placeholder: '请选择${title}', options: []},
|
||||
{ title: '金额',key: 'eachAmount', width: '10%', type: FormTypes.inputNumber, statistics: true, placeholder: '请选择${title}' },
|
||||
{ title: '备注',key: 'remark', width: '30%', type: FormTypes.input, placeholder: '请选择${title}'}
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
billTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/accountHead/addAccountHeadAndDetail',
|
||||
edit: '/accountHead/updateAccountHeadAndDetail',
|
||||
detailList: '/accountItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.initDetailAccount()
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("SK")
|
||||
} else {
|
||||
this.model.billTime = this.model.billTimeStr
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'handsPersonId', 'billTime', 'billNo', 'remark', 'changeAmount'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.accountTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '收款'
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.eachAmount-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
180
jshERP-web/src/views/financial/modules/MoneyOutModal.vue
Normal file
180
jshERP-web/src/views/financial/modules/MoneyOutModal.vue
Normal file
@@ -0,0 +1,180 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
:forceRender="true"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="收款单位">
|
||||
<a-select placeholder="选择收款单位" v-decorator="[ 'organId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in supList" :key="index" :value="item.id">
|
||||
{{ item.supplier }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="经手人">
|
||||
<a-select placeholder="选择经手人" v-decorator="[ 'handsPersonId' ]" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in personList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据日期">
|
||||
<j-date v-decorator="['billTime']" :show-time="true"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据编号">
|
||||
<a-input placeholder="请输入单据编号" v-decorator.trim="[ 'billNo' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
:ref="refKeys[0]"
|
||||
:loading="accountTable.loading"
|
||||
:columns="accountTable.columns"
|
||||
:dataSource="accountTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="false"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"
|
||||
@valueChange="onValueChange" />
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优惠金额">
|
||||
<a-input placeholder="请输入优惠金额" v-decorator.trim="[ 'changeAmount' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { FormTypes } from '@/utils/JEditableTableUtil'
|
||||
import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
|
||||
import { FinancialModalMixin } from '../mixins/FinancialModalMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "MoneyInModal",
|
||||
mixins: [JEditableTableMixin, FinancialModalMixin],
|
||||
components: {
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
width: '1200px',
|
||||
moreStatus: false,
|
||||
// 新增时子表默认添加几行空数据
|
||||
addDefaultRowNum: 1,
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
refKeys: ['accountDataTable', ],
|
||||
activeKey: 'accountDataTable',
|
||||
accountTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '账户名称',key: 'accountId',width: '20%', type: FormTypes.select, placeholder: '请选择${title}', options: []},
|
||||
{ title: '金额',key: 'eachAmount', width: '10%', type: FormTypes.inputNumber, statistics: true, placeholder: '请选择${title}' },
|
||||
{ title: '备注',key: 'remark', width: '30%', type: FormTypes.input, placeholder: '请选择${title}'}
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules:{
|
||||
billTime:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入单据日期!' }
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/accountHead/addAccountHeadAndDetail',
|
||||
edit: '/accountHead/updateAccountHeadAndDetail',
|
||||
detailList: '/accountItem/getDetailList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.initDetailAccount()
|
||||
},
|
||||
methods: {
|
||||
//调用完edit()方法之后会自动调用此方法
|
||||
editAfter() {
|
||||
if (this.action === 'add') {
|
||||
this.addInit("FK")
|
||||
} else {
|
||||
this.model.billTime = this.model.billTimeStr
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'organId', 'handsPersonId', 'billTime', 'billNo', 'remark', 'changeAmount'))
|
||||
});
|
||||
// 加载子表数据
|
||||
let params = {
|
||||
headerId: this.model.id
|
||||
}
|
||||
let url = this.readOnly ? this.url.detailList : this.url.detailList;
|
||||
this.requestSubTableData(url, params, this.accountTable);
|
||||
}
|
||||
},
|
||||
//提交单据时整理成formData
|
||||
classifyIntoFormData(allValues) {
|
||||
let totalPrice = 0
|
||||
let billMain = Object.assign(this.model, allValues.formValue)
|
||||
let detailArr = allValues.tablesValue[0].values
|
||||
billMain.type = '付款'
|
||||
for(let item of detailArr){
|
||||
totalPrice += item.eachAmount-0
|
||||
}
|
||||
billMain.totalPrice = totalPrice
|
||||
if(this.model.id){
|
||||
billMain.id = this.model.id
|
||||
}
|
||||
return {
|
||||
info: JSON.stringify(billMain),
|
||||
rows: JSON.stringify(detailArr),
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
138
jshERP-web/src/views/form/BasicForm.vue
Normal file
138
jshERP-web/src/views/form/BasicForm.vue
Normal file
@@ -0,0 +1,138 @@
|
||||
<template>
|
||||
<a-card :body-style="{padding: '24px 32px'}" :bordered="false">
|
||||
<a-form @submit="handleSubmit" :form="form">
|
||||
<a-form-item
|
||||
label="标题"
|
||||
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
|
||||
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'name',
|
||||
{rules: [{ required: true, message: '请输入标题' }]}
|
||||
]"
|
||||
name="name"
|
||||
placeholder="给目标起个名字" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="起止日期"
|
||||
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
|
||||
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
|
||||
<a-range-picker
|
||||
name="buildTime"
|
||||
style="width: 100%"
|
||||
v-decorator="[
|
||||
'buildTime',
|
||||
{rules: [{ required: true, message: '请选择起止日期' }]}
|
||||
]" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="目标描述"
|
||||
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
|
||||
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
|
||||
<a-textarea
|
||||
rows="4"
|
||||
placeholder="请输入你阶段性工作目标"
|
||||
v-decorator="[
|
||||
'description',
|
||||
{rules: [{ required: true, message: '请输入目标描述' }]}
|
||||
]" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="衡量标准"
|
||||
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
|
||||
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
|
||||
<a-textarea
|
||||
rows="4"
|
||||
placeholder="请输入衡量标准"
|
||||
v-decorator="[
|
||||
'type',
|
||||
{rules: [{ required: true, message: '请输入衡量标准' }]}
|
||||
]" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="客户"
|
||||
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
|
||||
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
|
||||
<a-input
|
||||
placeholder="请描述你服务的客户，内部客户直接 @姓名／工号"
|
||||
v-decorator="[
|
||||
'customer',
|
||||
{rules: [{ required: true, message: '请描述你服务的客户' }]}
|
||||
]" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="邀评人"
|
||||
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
|
||||
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }"
|
||||
:required="false"
|
||||
>
|
||||
<a-input placeholder="请直接 @姓名／工号，最多可邀请 5 人" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="权重"
|
||||
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
|
||||
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }"
|
||||
:required="false"
|
||||
>
|
||||
<a-input-number :min="0" :max="100" />
|
||||
<span> %</span>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="目标公开"
|
||||
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
|
||||
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }"
|
||||
:required="false"
|
||||
help="客户、邀评人默认被分享"
|
||||
>
|
||||
<a-radio-group v-model="value">
|
||||
<a-radio :value="1">公开</a-radio>
|
||||
<a-radio :value="2">部分公开</a-radio>
|
||||
<a-radio :value="3">不公开</a-radio>
|
||||
</a-radio-group>
|
||||
<a-form-item>
|
||||
<a-select mode="multiple" v-if="value === 2">
|
||||
<a-select-option value="4">同事一</a-select-option>
|
||||
<a-select-option value="5">同事二</a-select-option>
|
||||
<a-select-option value="6">同事三</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:wrapperCol="{ span: 24 }"
|
||||
style="text-align: center"
|
||||
>
|
||||
<a-button htmlType="submit" type="primary">提交</a-button>
|
||||
<a-button style="margin-left: 8px">保存</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'BaseForm',
|
||||
data () {
|
||||
return {
|
||||
description: '表单页用于向用户收集或验证信息，基础表单常见于数据项较少的表单场景。',
|
||||
value: 1,
|
||||
|
||||
// form
|
||||
form: this.$form.createForm(this),
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
// handler
|
||||
handleSubmit (e) {
|
||||
e.preventDefault()
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log('Received values of form: ', values)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
206
jshERP-web/src/views/form/advancedForm/AdvancedForm.vue
Normal file
206
jshERP-web/src/views/form/advancedForm/AdvancedForm.vue
Normal file
@@ -0,0 +1,206 @@
|
||||
<template>
|
||||
<div>
|
||||
<a-card class="card" title="仓库管理" :bordered="false">
|
||||
<repository-form ref="repository" :showSubmit="false" />
|
||||
</a-card>
|
||||
<a-card class="card" title="任务管理" :bordered="false">
|
||||
<task-form ref="task" :showSubmit="false" />
|
||||
</a-card>
|
||||
|
||||
<!-- table -->
|
||||
<a-card>
|
||||
<form :autoFormCreate="(form) => this.form = form">
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:dataSource="data"
|
||||
:pagination="false"
|
||||
>
|
||||
<template v-for="(col, i) in ['name', 'workId', 'department']" :slot="col" slot-scope="text, record, index">
|
||||
<a-input
|
||||
:key="col"
|
||||
v-if="record.editable"
|
||||
style="margin: -5px 0"
|
||||
:value="text"
|
||||
:placeholder="columns[i].title"
|
||||
@change="e => handleChange(e.target.value, record.key, col)"
|
||||
/>
|
||||
<template v-else>{{ text }}</template>
|
||||
</template>
|
||||
<template slot="operation" slot-scope="text, record, index">
|
||||
<template v-if="record.editable">
|
||||
<span v-if="record.isNew">
|
||||
<a @click="saveRow(record.key)">添加</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="是否要删除此行？" @confirm="remove(record.key)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
<span v-else>
|
||||
<a @click="saveRow(record.key)">保存</a>
|
||||
<a-divider type="vertical" />
|
||||
<a @click="cancel(record.key)">取消</a>
|
||||
</span>
|
||||
</template>
|
||||
<span v-else>
|
||||
<a @click="toggle(record.key)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="是否要删除此行？" @confirm="remove(record.key)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</template>
|
||||
</a-table>
|
||||
<a-button style="width: 100%; margin-top: 16px; margin-bottom: 8px" type="dashed" icon="plus" @click="newMember">新增成员</a-button>
|
||||
</form>
|
||||
</a-card>
|
||||
|
||||
<!-- fixed footer toolbar -->
|
||||
<footer-tool-bar>
|
||||
<a-button type="primary" @click="validate" :loading="loading">提交</a-button>
|
||||
</footer-tool-bar>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import RepositoryForm from './RepositoryForm'
|
||||
import TaskForm from './TaskForm'
|
||||
import FooterToolBar from '@/components/tools/FooterToolBar'
|
||||
|
||||
export default {
|
||||
name: "AdvancedForm",
|
||||
components: {
|
||||
FooterToolBar,
|
||||
RepositoryForm,
|
||||
TaskForm
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
description: '高级表单常见于一次性输入和提交大批量数据的场景。',
|
||||
loading: false,
|
||||
|
||||
// table
|
||||
columns: [
|
||||
{
|
||||
title: '成员姓名',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
width: '20%',
|
||||
scopedSlots: { customRender: 'name' }
|
||||
},
|
||||
{
|
||||
title: '工号',
|
||||
dataIndex: 'workId',
|
||||
key: 'workId',
|
||||
width: '20%',
|
||||
scopedSlots: { customRender: 'workId' }
|
||||
},
|
||||
{
|
||||
title: '所属部门',
|
||||
dataIndex: 'department',
|
||||
key: 'department',
|
||||
width: '40%',
|
||||
scopedSlots: { customRender: 'department' }
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
scopedSlots: { customRender: 'operation' }
|
||||
}
|
||||
],
|
||||
data: [
|
||||
{
|
||||
key: '1',
|
||||
name: '小明',
|
||||
workId: '001',
|
||||
editable: false,
|
||||
department: '行政部'
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
name: '李莉',
|
||||
workId: '002',
|
||||
editable: false,
|
||||
department: 'IT部'
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
name: '王小帅',
|
||||
workId: '003',
|
||||
editable: false,
|
||||
department: '财务部'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSubmit (e) {
|
||||
e.preventDefault()
|
||||
},
|
||||
newMember () {
|
||||
this.data.push({
|
||||
key: '-1',
|
||||
name: '',
|
||||
workId: '',
|
||||
department: '',
|
||||
editable: true,
|
||||
isNew: true
|
||||
})
|
||||
},
|
||||
remove (key) {
|
||||
const newData = this.data.filter(item => item.key !== key)
|
||||
this.data = newData
|
||||
},
|
||||
saveRow (key) {
|
||||
let target = this.data.filter(item => item.key === key)[0]
|
||||
target.editable = false
|
||||
target.isNew = false
|
||||
},
|
||||
toggle (key) {
|
||||
let target = this.data.filter(item => item.key === key)[0]
|
||||
target.editable = !target.editable
|
||||
},
|
||||
getRowByKey (key, newData) {
|
||||
const data = this.data
|
||||
return (newData || data).filter(item => item.key === key)[0]
|
||||
},
|
||||
cancel (key) {
|
||||
let target = this.data.filter(item => item.key === key)[0]
|
||||
target.editable = false
|
||||
},
|
||||
handleChange (value, key, column) {
|
||||
const newData = [...this.data]
|
||||
const target = newData.filter(item => key === item.key)[0]
|
||||
if (target) {
|
||||
target[column] = value
|
||||
this.data = newData
|
||||
}
|
||||
},
|
||||
|
||||
// 最终全页面提交
|
||||
validate () {
|
||||
this.$refs.repository.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
this.$notification['error']({
|
||||
message: 'Received values of form:',
|
||||
description: values
|
||||
})
|
||||
}
|
||||
})
|
||||
this.$refs.task.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
this.$notification['error']({
|
||||
message: 'Received values of form:',
|
||||
description: values
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.card{
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
</style>
|
||||
119
jshERP-web/src/views/form/advancedForm/RepositoryForm.vue
Normal file
119
jshERP-web/src/views/form/advancedForm/RepositoryForm.vue
Normal file
@@ -0,0 +1,119 @@
|
||||
<template>
|
||||
<a-form @submit="handleSubmit" :form="form" class="form">
|
||||
<a-row class="form-row" :gutter="16">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item label="仓库名">
|
||||
<a-input
|
||||
placeholder="请输入仓库名称"
|
||||
v-decorator="[
|
||||
'repository.name',
|
||||
{rules: [{ required: true, message: '请输入仓库名称', whitespace: true}]}
|
||||
]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
|
||||
<a-form-item
|
||||
label="仓库域名">
|
||||
<a-input
|
||||
addonBefore="http://"
|
||||
addonAfter=".com"
|
||||
placeholder="请输入"
|
||||
v-decorator="[
|
||||
'repository.domain',
|
||||
{rules: [{ required: true, message: '请输入仓库域名', whitespace: true}, {validator: validate}]}
|
||||
]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
|
||||
<a-form-item
|
||||
label="仓库管理员">
|
||||
<a-select placeholder="请选择管理员" v-decorator="[ 'repository.manager', {rules: [{ required: true, message: '请选择管理员'}]} ]">
|
||||
<a-select-option value="王同学">王同学</a-select-option>
|
||||
<a-select-option value="李同学">李同学</a-select-option>
|
||||
<a-select-option value="黄同学">黄同学</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="16">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item
|
||||
label="审批人">
|
||||
<a-select placeholder="请选择审批员" v-decorator="[ 'repository.auditor', {rules: [{ required: true, message: '请选择审批员'}]} ]">
|
||||
<a-select-option value="王晓丽">王晓丽</a-select-option>
|
||||
<a-select-option value="李军">李军</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
|
||||
<a-form-item
|
||||
label="生效日期">
|
||||
<a-range-picker
|
||||
style="width: 100%"
|
||||
v-decorator="[
|
||||
'repository.effectiveDate',
|
||||
{rules: [{ required: true, message: '请选择生效日期'}]}
|
||||
]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
|
||||
<a-form-item
|
||||
label="仓库类型">
|
||||
<a-select
|
||||
placeholder="请选择仓库类型"
|
||||
v-decorator="[
|
||||
'repository.type',
|
||||
{rules: [{ required: true, message: '请选择仓库类型'}]}
|
||||
]" >
|
||||
<a-select-option value="公开">公开</a-select-option>
|
||||
<a-select-option value="私密">私密</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-form-item v-if="showSubmit">
|
||||
<a-button htmlType="submit" >Submit</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "RepositoryForm",
|
||||
props: {
|
||||
showSubmit: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
form: this.$form.createForm(this)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSubmit (e) {
|
||||
e.preventDefault()
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
this.$notification['error']({
|
||||
message: 'Received values of form:',
|
||||
description: values
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
validate (rule, value, callback) {
|
||||
const regex = /^user-(.*)$/
|
||||
if (!regex.test(value)) {
|
||||
callback('需要以 user- 开头')
|
||||
}
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
107
jshERP-web/src/views/form/advancedForm/TaskForm.vue
Normal file
107
jshERP-web/src/views/form/advancedForm/TaskForm.vue
Normal file
@@ -0,0 +1,107 @@
|
||||
<template>
|
||||
<a-form @submit="handleSubmit" :form="form" class="form">
|
||||
<a-row class="form-row" :gutter="16">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item
|
||||
label="任务名">
|
||||
<a-input placeholder="请输入任务名称" v-decorator="[ 'task.name', {rules: [{ required: true, message: '请输入任务名称', whitespace: true}]} ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
|
||||
<a-form-item
|
||||
label="任务描述">
|
||||
<a-input placeholder="请输入任务描述" v-decorator="[ 'task.description', {rules: [{ required: true, message: '请输入任务描述', whitespace: true}]} ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
|
||||
<a-form-item
|
||||
label="执行人">
|
||||
<a-select
|
||||
placeholder="请选择执行人"
|
||||
v-decorator="[
|
||||
'task.executor',
|
||||
{rules: [{ required: true, message: '请选择执行人'}]}
|
||||
]" >
|
||||
<a-select-option value="黄丽丽">黄丽丽</a-select-option>
|
||||
<a-select-option value="李大刀">李大刀</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="16">
|
||||
<a-col :lg="6" :md="12" :sm="24">
|
||||
<a-form-item
|
||||
label="责任人">
|
||||
<a-select
|
||||
placeholder="请选择责任人"
|
||||
v-decorator="[
|
||||
'task.manager',
|
||||
{rules: [{ required: true, message: '请选择责任人'}]}
|
||||
]" >
|
||||
<a-select-option value="王伟">王伟</a-select-option>
|
||||
<a-select-option value="李红军">李红军</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
|
||||
<a-form-item
|
||||
label="提醒时间">
|
||||
<a-time-picker
|
||||
style="width: 100%"
|
||||
v-decorator="[
|
||||
'task.time',
|
||||
{rules: [{ required: true, message: '请选择提醒时间'}]}
|
||||
]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
|
||||
<a-form-item
|
||||
label="任务类型">
|
||||
<a-select
|
||||
placeholder="请选择任务类型"
|
||||
v-decorator="[ 'task.type', {rules: [{ required: true, message: '请选择任务类型'}]} ]" >
|
||||
<a-select-option value="定时执行">定时执行</a-select-option>
|
||||
<a-select-option value="周期执行">周期执行</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-form-item v-if="showSubmit">
|
||||
<a-button htmlType="submit" >Submit</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "TaskForm",
|
||||
props: {
|
||||
showSubmit: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
form: this.$form.createForm(this)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSubmit (e) {
|
||||
e.preventDefault()
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
this.$notification['error']({
|
||||
message: 'Received values of form:',
|
||||
description: values
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
60
jshERP-web/src/views/form/stepForm/Step1.vue
Normal file
60
jshERP-web/src/views/form/stepForm/Step1.vue
Normal file
@@ -0,0 +1,60 @@
|
||||
<template>
|
||||
<div>
|
||||
<a-form style="max-width: 500px; margin: 40px auto 0;">
|
||||
<a-form-item
|
||||
label="付款账户"
|
||||
:labelCol="{span: 5}"
|
||||
:wrapperCol="{span: 19}"
|
||||
>
|
||||
<a-select value="1" placeholder="ant-design@alipay.com">
|
||||
<a-select-option value="1">ant-design@alipay.com</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="收款账户"
|
||||
:labelCol="{span: 5}"
|
||||
:wrapperCol="{span: 19}"
|
||||
>
|
||||
<a-input-group :compact="true" style="display: inline-block; vertical-align: middle">
|
||||
<a-select defaultValue="alipay" style="width: 100px">
|
||||
<a-select-option value="alipay">支付宝</a-select-option>
|
||||
<a-select-option value="wexinpay">微信</a-select-option>
|
||||
</a-select>
|
||||
<a-input :style="{width: 'calc(100% - 100px)'}" value="test@example.com"/>
|
||||
</a-input-group>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="收款人姓名"
|
||||
:labelCol="{span: 5}"
|
||||
:wrapperCol="{span: 19}"
|
||||
>
|
||||
<a-input value="Alex" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="转账金额"
|
||||
:labelCol="{span: 5}"
|
||||
:wrapperCol="{span: 19}"
|
||||
>
|
||||
<a-input prefix="￥" value="5000" />
|
||||
</a-form-item>
|
||||
<a-form-item :wrapperCol="{span: 19, offset: 5}">
|
||||
<a-button type="primary" @click="nextStep">下一步</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "Step1",
|
||||
methods: {
|
||||
nextStep () {
|
||||
this.$emit('nextStep')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
82
jshERP-web/src/views/form/stepForm/Step2.vue
Normal file
82
jshERP-web/src/views/form/stepForm/Step2.vue
Normal file
@@ -0,0 +1,82 @@
|
||||
<template>
|
||||
<div>
|
||||
<a-form style="max-width: 500px; margin: 40px auto 0;">
|
||||
<a-alert
|
||||
:closable="true"
|
||||
message="确认转账后，资金将直接打入对方账户，无法退回。"
|
||||
style="margin-bottom: 24px;"
|
||||
/>
|
||||
<a-form-item
|
||||
label="付款账户"
|
||||
:labelCol="{span: 5}"
|
||||
:wrapperCol="{span: 19}"
|
||||
class="stepFormText"
|
||||
>
|
||||
ant-design@alipay.com
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="收款账户"
|
||||
:labelCol="{span: 5}"
|
||||
:wrapperCol="{span: 19}"
|
||||
class="stepFormText"
|
||||
>
|
||||
test@example.com
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="收款人姓名"
|
||||
:labelCol="{span: 5}"
|
||||
:wrapperCol="{span: 19}"
|
||||
class="stepFormText"
|
||||
>
|
||||
Alex
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="转账金额"
|
||||
:labelCol="{span: 5}"
|
||||
:wrapperCol="{span: 19}"
|
||||
class="stepFormText"
|
||||
>
|
||||
￥ 5,000.00
|
||||
</a-form-item>
|
||||
<a-form-item :wrapperCol="{span: 19, offset: 5}">
|
||||
<a-button :loading="loading" type="primary" @click="nextStep">提交</a-button>
|
||||
<a-button style="margin-left: 8px" @click="prevStep">上一步</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "Step2",
|
||||
data () {
|
||||
return {
|
||||
loading: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
nextStep () {
|
||||
let that = this
|
||||
that.loading = true
|
||||
setTimeout(function () {
|
||||
that.$emit('nextStep')
|
||||
}, 1500)
|
||||
},
|
||||
prevStep () {
|
||||
this.$emit('prevStep')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.stepFormText {
|
||||
margin-bottom: 24px;
|
||||
|
||||
.ant-form-item-label,
|
||||
.ant-form-item-control {
|
||||
line-height: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
69
jshERP-web/src/views/form/stepForm/Step3.vue
Normal file
69
jshERP-web/src/views/form/stepForm/Step3.vue
Normal file
@@ -0,0 +1,69 @@
|
||||
<template>
|
||||
<div>
|
||||
<a-form style="margin: 40px auto 0;">
|
||||
<result title="操作成功" :is-success="true" description="预计两小时内到账">
|
||||
<div class="information">
|
||||
<a-row>
|
||||
<a-col :sm="8" :xs="24">付款账户：</a-col>
|
||||
<a-col :sm="16" :xs="24">ant-design@alipay.com</a-col>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<a-col :sm="8" :xs="24">收款账户：</a-col>
|
||||
<a-col :sm="16" :xs="24">test@example.com</a-col>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<a-col :sm="8" :xs="24">收款人姓名：</a-col>
|
||||
<a-col :sm="16" :xs="24">辉夜</a-col>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<a-col :sm="8" :xs="24">转账金额：</a-col>
|
||||
<a-col :sm="16" :xs="24"><span class="money">500</span> 元</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
<div slot="action">
|
||||
<a-button type="primary" @click="finish">再转一笔</a-button>
|
||||
<a-button style="margin-left: 8px" @click="toOrderList">查看账单</a-button>
|
||||
</div>
|
||||
</result>
|
||||
</a-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Result from '../../result/Result'
|
||||
|
||||
export default {
|
||||
name: "Step3",
|
||||
components: {
|
||||
Result
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
loading: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
finish () {
|
||||
this.$emit('finish')
|
||||
},
|
||||
toOrderList () {
|
||||
this.$router.push('/list/query-list')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.information {
|
||||
line-height: 22px;
|
||||
|
||||
.ant-row:not(:last-child) {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
}
|
||||
.money {
|
||||
font-family: "Helvetica Neue",sans-serif;
|
||||
font-weight: 500;
|
||||
font-size: 20px;
|
||||
line-height: 14px;
|
||||
}
|
||||
</style>
|
||||
62
jshERP-web/src/views/form/stepForm/StepForm.vue
Normal file
62
jshERP-web/src/views/form/stepForm/StepForm.vue
Normal file
@@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-steps class="steps" :current="currentTab">
|
||||
<a-step title="填写转账信息" />
|
||||
<a-step title="确认转账信息" />
|
||||
<a-step title="完成" />
|
||||
</a-steps>
|
||||
<div class="content">
|
||||
<step1 v-if="currentTab === 0" @nextStep="nextStep"/>
|
||||
<step2 v-if="currentTab === 1" @nextStep="nextStep" @prevStep="prevStep"/>
|
||||
<step3 v-if="currentTab === 2" @prevStep="prevStep" @finish="finish"/>
|
||||
</div>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Step1 from './Step1'
|
||||
import Step2 from './Step2'
|
||||
import Step3 from './Step3'
|
||||
|
||||
export default {
|
||||
name: "StepForm",
|
||||
components: {
|
||||
Step1,
|
||||
Step2,
|
||||
Step3
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
description: '将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。',
|
||||
currentTab: 0,
|
||||
|
||||
// form
|
||||
form: null,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
// handler
|
||||
nextStep () {
|
||||
if (this.currentTab < 2) {
|
||||
this.currentTab += 1
|
||||
}
|
||||
},
|
||||
prevStep () {
|
||||
if (this.currentTab > 0) {
|
||||
this.currentTab -= 1
|
||||
}
|
||||
},
|
||||
finish () {
|
||||
this.currentTab = 0
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.steps {
|
||||
max-width: 750px;
|
||||
margin: 16px auto;
|
||||
}
|
||||
</style>
|
||||
110
jshERP-web/src/views/list/CardList.vue
Normal file
110
jshERP-web/src/views/list/CardList.vue
Normal file
@@ -0,0 +1,110 @@
|
||||
<template>
|
||||
<div class="card-list" ref="content">
|
||||
<a-list
|
||||
:grid="{gutter: 24, lg: 3, md: 2, sm: 1, xs: 1}"
|
||||
:dataSource="dataSource"
|
||||
>
|
||||
<a-list-item slot="renderItem" slot-scope="item, index">
|
||||
<template v-if="item === null">
|
||||
<a-button class="new-btn" type="dashed">
|
||||
<a-icon type="plus"/>
|
||||
新增产品
|
||||
</a-button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<a-card :hoverable="true">
|
||||
<a-card-meta>
|
||||
<div style="margin-bottom: 3px" slot="title">{{ item.title }}</div>
|
||||
<a-avatar class="card-avatar" slot="avatar" :src="item.avatar" size="large"/>
|
||||
<div class="meta-content" slot="description">{{ item.content }}</div>
|
||||
</a-card-meta>
|
||||
<template class="ant-card-actions" slot="actions">
|
||||
<a>操作一</a>
|
||||
<a>操作二</a>
|
||||
</template>
|
||||
</a-card>
|
||||
</template>
|
||||
</a-list-item>
|
||||
</a-list>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
const dataSource = []
|
||||
dataSource.push(null)
|
||||
for (let i = 0; i < 11; i++) {
|
||||
dataSource.push({
|
||||
title: 'Alipay',
|
||||
avatar: 'https://gw.alipayobjects.com/zos/rmsportal/WdGqmHpayyMjiEhcKoVE.png',
|
||||
content: '在中台产品的研发过程中，会出现不同的设计规范和实现方式，但其中往往存在很多类似的页面和组件，这些类似的组件会被抽离成一套标准规范。'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export default {
|
||||
name: "CardList",
|
||||
data () {
|
||||
return {
|
||||
description: '段落示意：蚂蚁金服务设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态， 提供跨越设计与开发的体验解决方案。',
|
||||
linkList: [
|
||||
{ icon: 'rocket', href: '#', title: '快速开始' },
|
||||
{ icon: 'info-circle-o', href: '#', title: '产品简介' },
|
||||
{ icon: 'file-text', href: '#', title: '产品文档' }
|
||||
],
|
||||
extraImage: 'https://gw.alipayobjects.com/zos/rmsportal/RzwpdLnhmvDJToTdfDPe.png',
|
||||
dataSource
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.card-avatar {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border-radius: 48px;
|
||||
}
|
||||
|
||||
.ant-card-actions {
|
||||
background: #f7f9fa;
|
||||
li {
|
||||
float: left;
|
||||
text-align: center;
|
||||
margin: 12px 0;
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
width: 50%;
|
||||
|
||||
&:not(:last-child) {
|
||||
border-right: 1px solid #e8e8e8;
|
||||
}
|
||||
|
||||
a {
|
||||
color: rgba(0, 0, 0, .45);
|
||||
line-height: 22px;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
&:hover {
|
||||
color: #1890ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.new-btn {
|
||||
background-color: #fff;
|
||||
border-radius: 2px;
|
||||
width: 100%;
|
||||
height: 188px;
|
||||
}
|
||||
|
||||
.meta-content {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
height: 64px;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
</style>
|
||||
272
jshERP-web/src/views/list/PermissionList.vue
Normal file
272
jshERP-web/src/views/list/PermissionList.vue
Normal file
@@ -0,0 +1,272 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="48">
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="角色ID">
|
||||
<a-input placeholder="请输入"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="状态">
|
||||
<a-select placeholder="请选择" default-value="0">
|
||||
<a-select-option value="0">全部</a-select-option>
|
||||
<a-select-option value="1">关闭</a-select-option>
|
||||
<a-select-option value="2">运行中</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<span class="table-page-search-submitButtons">
|
||||
<a-button type="primary">查询</a-button>
|
||||
<a-button style="margin-left: 8px">重置</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<s-table :columns="columns" :data="loadData">
|
||||
|
||||
<span slot="actions" slot-scope="text, record">
|
||||
<a-tag v-for="(action, index) in record.actionList" :key="index">{{ action.describe }}</a-tag>
|
||||
</span>
|
||||
|
||||
<span slot="status" slot-scope="text">
|
||||
{{ text | statusFilter }}
|
||||
</span>
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">
|
||||
更多 <a-icon type="down" />
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">详情</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">禁用</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">删除</a>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
</s-table>
|
||||
|
||||
<a-modal
|
||||
title="操作"
|
||||
:width="800"
|
||||
v-model="visible"
|
||||
@ok="handleOk"
|
||||
>
|
||||
<a-form :autoFormCreate="(form)=>{this.form = form}">
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="唯一识别码"
|
||||
hasFeedback
|
||||
validateStatus="success"
|
||||
>
|
||||
<a-input placeholder="唯一识别码" v-model="mdl.id" id="no" disabled="disabled" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="权限名称"
|
||||
hasFeedback
|
||||
validateStatus="success"
|
||||
>
|
||||
<a-input placeholder="起一个名字" v-model="mdl.name" id="permission_name" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="状态"
|
||||
hasFeedback
|
||||
validateStatus="warning"
|
||||
>
|
||||
<a-select v-model="mdl.status">
|
||||
<a-select-option value="1">正常</a-select-option>
|
||||
<a-select-option value="2">禁用</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="描述"
|
||||
hasFeedback
|
||||
>
|
||||
<a-textarea :rows="5" v-model="mdl.describe" placeholder="..." id="describe"/>
|
||||
</a-form-item>
|
||||
|
||||
<a-divider />
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="赋予权限"
|
||||
hasFeedback
|
||||
>
|
||||
<a-select
|
||||
style="width: 100%"
|
||||
mode="multiple"
|
||||
v-model="mdl.actions"
|
||||
:allowClear="true"
|
||||
>
|
||||
<a-select-option v-for="(action, index) in permissionList" :key="index" :value="action.value">{{ action.label }}</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
</a-form>
|
||||
</a-modal>
|
||||
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import STable from '@/components/table/'
|
||||
|
||||
export default {
|
||||
name: "TableList",
|
||||
components: {
|
||||
STable
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
description: '列表使用场景：后台管理中的权限管理以及角色管理，可用于基于 RBAC 设计的角色权限控制，颗粒度细到每一个操作类型。',
|
||||
|
||||
visible: false,
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
form: null,
|
||||
mdl: {},
|
||||
|
||||
// 高级搜索 展开/关闭
|
||||
advanced: false,
|
||||
// 查询参数
|
||||
queryParam: {},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '唯一识别码',
|
||||
dataIndex: 'id'
|
||||
},
|
||||
{
|
||||
title: '权限名称',
|
||||
dataIndex: 'name',
|
||||
},
|
||||
{
|
||||
title: '可操作权限',
|
||||
dataIndex: 'actions',
|
||||
scopedSlots: { customRender: 'actions' },
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
scopedSlots: { customRender: 'status' },
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
width: '150px',
|
||||
dataIndex: 'action',
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
// 向后端拉取可以用的操作列表
|
||||
permissionList: null,
|
||||
// 加载数据方法 必须为 Promise 对象
|
||||
loadData: parameter => {
|
||||
return this.$http.get('/api/permission', {
|
||||
params: Object.assign(parameter, this.queryParam)
|
||||
}).then(res => {
|
||||
let result = res.result
|
||||
result.data.map(permission => {
|
||||
permission.actionList = JSON.parse(permission.actionData)
|
||||
return permission
|
||||
})
|
||||
return result
|
||||
})
|
||||
},
|
||||
|
||||
selectedRowKeys: [],
|
||||
selectedRows: []
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
1: '正常',
|
||||
2: '禁用'
|
||||
}
|
||||
return statusMap[status]
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.loadPermissionList()
|
||||
},
|
||||
methods: {
|
||||
loadPermissionList () {
|
||||
// permissionList
|
||||
new Promise((resolve => {
|
||||
const data = [
|
||||
{ label: '新增', value: 'add', defaultChecked: false },
|
||||
{ label: '查询', value: 'get', defaultChecked: false },
|
||||
{ label: '修改', value: 'update', defaultChecked: false },
|
||||
{ label: '列表', value: 'query', defaultChecked: false },
|
||||
{ label: '删除', value: 'delete', defaultChecked: false },
|
||||
{ label: '导入', value: 'import', defaultChecked: false },
|
||||
{ label: '导出', value: 'export', defaultChecked: false }
|
||||
]
|
||||
setTimeout(resolve(data), 1500)
|
||||
})).then(res => {
|
||||
this.permissionList = res
|
||||
})
|
||||
},
|
||||
handleEdit (record) {
|
||||
this.mdl = Object.assign({}, record)
|
||||
console.log(this.mdl)
|
||||
this.visible = true
|
||||
},
|
||||
handleOk () {
|
||||
|
||||
},
|
||||
onChange (selectedRowKeys, selectedRows) {
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
this.selectedRows = selectedRows
|
||||
},
|
||||
toggleAdvanced () {
|
||||
this.advanced = !this.advanced
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
/*
|
||||
'selectedRows': function (selectedRows) {
|
||||
this.needTotalList = this.needTotalList.map(item => {
|
||||
return {
|
||||
...item,
|
||||
total: selectedRows.reduce( (sum, val) => {
|
||||
return sum + val[item.dataIndex]
|
||||
}, 0)
|
||||
}
|
||||
})
|
||||
}
|
||||
*/
|
||||
}
|
||||
}
|
||||
</script>
|
||||
182
jshERP-web/src/views/list/RoleList.vue
Normal file
182
jshERP-web/src/views/list/RoleList.vue
Normal file
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="48">
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="角色ID">
|
||||
<a-input placeholder="请输入"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="状态">
|
||||
<a-select placeholder="请选择" default-value="0">
|
||||
<a-select-option value="0">全部</a-select-option>
|
||||
<a-select-option value="1">正常</a-select-option>
|
||||
<a-select-option value="2">禁用</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<span class="table-page-search-submitButtons">
|
||||
<a-button type="primary">查询</a-button>
|
||||
<a-button style="margin-left: 8px">重置</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<s-table
|
||||
ref="table"
|
||||
size="default"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
>
|
||||
<div
|
||||
slot="expandedRowRender"
|
||||
slot-scope="record"
|
||||
style="margin: 0">
|
||||
<a-row
|
||||
:gutter="24"
|
||||
:style="{ marginBottom: '12px' }">
|
||||
<a-col :span="12" v-for="(role, index) in record.permissions" :key="index" :style="{ marginBottom: '12px' }">
|
||||
<a-col :span="4">
|
||||
<span>{{ role.permissionName }}：</span>
|
||||
</a-col>
|
||||
<a-col :span="20" v-if="role.actionEntitySet.length > 0">
|
||||
<a-tag color="cyan" v-for="(action, k) in role.actionEntitySet" :key="k">{{ action.describe }}</a-tag>
|
||||
</a-col>
|
||||
<a-col :span="20" v-else>-</a-col>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="$refs.modal.edit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">
|
||||
更多 <a-icon type="down" />
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">详情</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">禁用</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">删除</a>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
</s-table>
|
||||
|
||||
<role-modal ref="modal" @ok="handleOk"></role-modal>
|
||||
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import STable from '@/components/table/'
|
||||
import RoleModal from './modules/RoleModal'
|
||||
|
||||
export default {
|
||||
name: "TableList",
|
||||
components: {
|
||||
STable,
|
||||
RoleModal
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
description: '列表使用场景：后台管理中的权限管理以及角色管理，可用于基于 RBAC 设计的角色权限控制，颗粒度细到每一个操作类型。',
|
||||
|
||||
visible: false,
|
||||
|
||||
form: null,
|
||||
mdl: {},
|
||||
|
||||
// 高级搜索 展开/关闭
|
||||
advanced: false,
|
||||
// 查询参数
|
||||
queryParam: {},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '唯一识别码',
|
||||
dataIndex: 'id'
|
||||
},
|
||||
{
|
||||
title: '角色名称',
|
||||
dataIndex: 'name',
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status'
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createTime',
|
||||
sorter: true
|
||||
}, {
|
||||
title: '操作',
|
||||
width: '150px',
|
||||
dataIndex: 'action',
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
// 加载数据方法 必须为 Promise 对象
|
||||
loadData: parameter => {
|
||||
return this.$http.get('/api/role', {
|
||||
params: Object.assign(parameter, this.queryParam)
|
||||
}).then(res => {
|
||||
return res.result
|
||||
})
|
||||
},
|
||||
|
||||
selectedRowKeys: [],
|
||||
selectedRows: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleEdit (record) {
|
||||
this.mdl = Object.assign({}, record)
|
||||
|
||||
this.mdl.permissions.forEach(permission => {
|
||||
permission.actionsOptions = permission.actionEntitySet.map(action => {
|
||||
return { label: action.describe, value: action.action, defaultCheck: action.defaultCheck }
|
||||
})
|
||||
})
|
||||
|
||||
console.log(this.mdl)
|
||||
this.visible = true
|
||||
},
|
||||
handleOk () {
|
||||
// 新增/修改 成功时，重载列表
|
||||
this.$refs.table.refresh()
|
||||
},
|
||||
onChange (selectedRowKeys, selectedRows) {
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
this.selectedRows = selectedRows
|
||||
},
|
||||
toggleAdvanced () {
|
||||
this.advanced = !this.advanced
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
/*
|
||||
'selectedRows': function (selectedRows) {
|
||||
this.needTotalList = this.needTotalList.map(item => {
|
||||
return {
|
||||
...item,
|
||||
total: selectedRows.reduce( (sum, val) => {
|
||||
return sum + val[item.dataIndex]
|
||||
}, 0)
|
||||
}
|
||||
})
|
||||
}
|
||||
*/
|
||||
}
|
||||
}
|
||||
</script>
|
||||
164
jshERP-web/src/views/list/StandardList.vue
Normal file
164
jshERP-web/src/views/list/StandardList.vue
Normal file
@@ -0,0 +1,164 @@
|
||||
<template>
|
||||
<div>
|
||||
<a-card :bordered="false">
|
||||
<a-row>
|
||||
<a-col :sm="8" :xs="24">
|
||||
<head-info title="我的待办" content="8个任务" :bordered="true"/>
|
||||
</a-col>
|
||||
<a-col :sm="8" :xs="24">
|
||||
<head-info title="本周任务平均处理时间" content="32分钟" :bordered="true"/>
|
||||
</a-col>
|
||||
<a-col :sm="8" :xs="24">
|
||||
<head-info title="本周完成任务数" content="24个"/>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-card>
|
||||
|
||||
<a-card
|
||||
style="margin-top: 24px"
|
||||
:bordered="false"
|
||||
title="标准列表">
|
||||
|
||||
<div slot="extra">
|
||||
<a-radio-group>
|
||||
<a-radio-button>全部</a-radio-button>
|
||||
<a-radio-button>进行中</a-radio-button>
|
||||
<a-radio-button>等待中</a-radio-button>
|
||||
</a-radio-group>
|
||||
<a-input-search style="margin-left: 16px; width: 272px;" />
|
||||
</div>
|
||||
|
||||
<div class="operate">
|
||||
<a-button type="dashed" style="width: 100%" icon="plus">添加</a-button>
|
||||
</div>
|
||||
|
||||
<a-list size="large" :pagination="{showSizeChanger: true, showQuickJumper: true, pageSize: 5, total: 50}">
|
||||
<a-list-item :key="index" v-for="(item, index) in data">
|
||||
<a-list-item-meta :description="item.description">
|
||||
<a-avatar slot="avatar" size="large" shape="square" :src="item.avatar"/>
|
||||
<a slot="title">{{ item.title }}</a>
|
||||
</a-list-item-meta>
|
||||
<div slot="actions">
|
||||
<a>编辑</a>
|
||||
</div>
|
||||
<div slot="actions">
|
||||
<a-dropdown>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item><a>编辑</a></a-menu-item>
|
||||
<a-menu-item><a>删除</a></a-menu-item>
|
||||
</a-menu>
|
||||
<a>更多<a-icon type="down"/></a>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<div class="list-content">
|
||||
<div class="list-content-item">
|
||||
<span>Owner</span>
|
||||
<p>{{ item.owner }}</p>
|
||||
</div>
|
||||
<div class="list-content-item">
|
||||
<span>开始时间</span>
|
||||
<p>{{ item.startAt }}</p>
|
||||
</div>
|
||||
<div class="list-content-item">
|
||||
<a-progress :percent="item.progress.value" :status="!item.progress.status ? null : item.progress.status" style="width: 180px" />
|
||||
</div>
|
||||
</div>
|
||||
</a-list-item>
|
||||
</a-list>
|
||||
|
||||
</a-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import HeadInfo from '@/components/tools/HeadInfo'
|
||||
|
||||
const data = []
|
||||
data.push({
|
||||
title: 'Alipay',
|
||||
avatar: 'https://gw.alipayobjects.com/zos/rmsportal/WdGqmHpayyMjiEhcKoVE.png',
|
||||
description: '那是一种内在的东西， 他们到达不了，也无法触及的',
|
||||
owner: '付晓晓',
|
||||
startAt: '2018-07-26 22:44',
|
||||
progress: {
|
||||
value: 90
|
||||
}
|
||||
})
|
||||
data.push({
|
||||
title: 'Angular',
|
||||
avatar: 'https://gw.alipayobjects.com/zos/rmsportal/zOsKZmFRdUtvpqCImOVY.png',
|
||||
description: '希望是一个好东西，也许是最好的，好东西是不会消亡的',
|
||||
owner: '曲丽丽',
|
||||
startAt: '2018-07-26 22:44',
|
||||
progress: {
|
||||
value: 54
|
||||
}
|
||||
})
|
||||
data.push({
|
||||
title: 'Ant Design',
|
||||
avatar: 'https://gw.alipayobjects.com/zos/rmsportal/dURIMkkrRFpPgTuzkwnB.png',
|
||||
description: '生命就像一盒巧克力，结果往往出人意料',
|
||||
owner: '林东东',
|
||||
startAt: '2018-07-26 22:44',
|
||||
progress: {
|
||||
value: 66
|
||||
}
|
||||
})
|
||||
data.push({
|
||||
title: 'Ant Design Pro',
|
||||
avatar: 'https://gw.alipayobjects.com/zos/rmsportal/sfjbOqnsXXJgNCjCzDBL.png',
|
||||
description: '城镇中有那么多的酒馆，她却偏偏走进了我的酒馆',
|
||||
owner: '周星星',
|
||||
startAt: '2018-07-26 22:44',
|
||||
progress: {
|
||||
value: 30
|
||||
}
|
||||
})
|
||||
data.push({
|
||||
title: 'Bootstrap',
|
||||
avatar: 'https://gw.alipayobjects.com/zos/rmsportal/siCrBXXhmvTQGWPNLBow.png',
|
||||
description: '那时候我只会想自己想要什么，从不想自己拥有什么',
|
||||
owner: '吴加好',
|
||||
startAt: '2018-07-26 22:44',
|
||||
progress: {
|
||||
status: 'exception',
|
||||
value: 100
|
||||
}
|
||||
})
|
||||
|
||||
export default {
|
||||
name: "StandardList",
|
||||
components: {
|
||||
HeadInfo
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
data
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.ant-avatar-lg {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
}
|
||||
|
||||
.list-content-item {
|
||||
color: rgba(0, 0, 0, .45);
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
font-size: 14px;
|
||||
margin-left: 40px;
|
||||
span {
|
||||
line-height: 20px;
|
||||
}
|
||||
p {
|
||||
margin-top: 4px;
|
||||
margin-bottom: 0;
|
||||
line-height: 22px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
270
jshERP-web/src/views/list/TableInnerEditList.vue
Normal file
270
jshERP-web/src/views/list/TableInnerEditList.vue
Normal file
@@ -0,0 +1,270 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="48">
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="规则编号">
|
||||
<a-input placeholder=""/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="使用状态">
|
||||
<a-select placeholder="请选择" default-value="0">
|
||||
<a-select-option value="0">全部</a-select-option>
|
||||
<a-select-option value="1">关闭</a-select-option>
|
||||
<a-select-option value="2">运行中</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<template v-if="advanced">
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="调用次数">
|
||||
<a-input-number style="width: 100%"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="更新日期">
|
||||
<a-date-picker style="width: 100%" placeholder="请输入更新日期"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="使用状态">
|
||||
<a-select placeholder="请选择" default-value="0">
|
||||
<a-select-option value="0">全部</a-select-option>
|
||||
<a-select-option value="1">关闭</a-select-option>
|
||||
<a-select-option value="2">运行中</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="使用状态">
|
||||
<a-select placeholder="请选择" default-value="0">
|
||||
<a-select-option value="0">全部</a-select-option>
|
||||
<a-select-option value="1">关闭</a-select-option>
|
||||
<a-select-option value="2">运行中</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</template>
|
||||
<a-col :md="!advanced && 8 || 24" :sm="24">
|
||||
<span class="table-page-search-submitButtons" :style="advanced && { float: 'right', overflow: 'hidden' } || {} ">
|
||||
<a-button type="primary">查询</a-button>
|
||||
<a-button style="margin-left: 8px">重置</a-button>
|
||||
<a @click="toggleAdvanced" style="margin-left: 8px">
|
||||
{{ advanced ? '收起' : '展开' }}
|
||||
<a-icon :type="advanced ? 'up' : 'down'"/>
|
||||
</a>
|
||||
</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<div class="table-operator">
|
||||
<a-button type="primary" icon="plus" @click="() => $router.push({name: 'anime-add'})">新建</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1"><a-icon type="delete" />删除</a-menu-item>
|
||||
<!-- lock | unlock -->
|
||||
<a-menu-item key="2"><a-icon type="lock" />锁定</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
|
||||
<s-table
|
||||
ref="table"
|
||||
size="default"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
:showAlertInfo="true"
|
||||
@onSelect="onChange"
|
||||
>
|
||||
<template v-for="(col, index) in columns" v-if="col.scopedSlots" :slot="col.dataIndex" slot-scope="text, record, index">
|
||||
<div :key="index">
|
||||
<a-input
|
||||
v-if="record.editable"
|
||||
style="margin: -5px 0"
|
||||
:value="text"
|
||||
@change="e => handleChange(e.target.value, record.key, col)"
|
||||
/>
|
||||
<template v-else>{{ text }}</template>
|
||||
</div>
|
||||
</template>
|
||||
<template slot="action" slot-scope="text, record, index">
|
||||
<div class="editable-row-operations">
|
||||
<span v-if="record.editable">
|
||||
<a @click="() => save(record)">保存</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="真的放弃编辑吗?" @confirm="() => cancel(record)">
|
||||
<a>取消</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
<span v-else>
|
||||
<a class="edit" @click="() => edit(record)">修改</a>
|
||||
<a-divider type="vertical" />
|
||||
<a class="delete" @click="() => del(record)">删除</a>
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
</s-table>
|
||||
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import STable from '@/components/table/'
|
||||
|
||||
export default {
|
||||
name: "TableList",
|
||||
components: {
|
||||
STable
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 高级搜索 展开/关闭
|
||||
advanced: false,
|
||||
// 查询参数
|
||||
queryParam: {},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '规则编号',
|
||||
dataIndex: 'no',
|
||||
width: 90
|
||||
},
|
||||
{
|
||||
title: '描述',
|
||||
dataIndex: 'description',
|
||||
scopedSlots: { customRender: 'description' },
|
||||
},
|
||||
{
|
||||
title: '服务调用次数',
|
||||
dataIndex: 'callNo',
|
||||
width: '150px',
|
||||
sorter: true,
|
||||
needTotal: true,
|
||||
scopedSlots: { customRender: 'callNo' },
|
||||
// customRender: (text) => text + ' 次'
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
width: '100px',
|
||||
needTotal: true,
|
||||
scopedSlots: { customRender: 'status' },
|
||||
},
|
||||
{
|
||||
title: '更新时间',
|
||||
dataIndex: 'updatedAt',
|
||||
width: '150px',
|
||||
sorter: true,
|
||||
scopedSlots: { customRender: 'updatedAt' },
|
||||
},
|
||||
{
|
||||
table: '操作',
|
||||
dataIndex: 'action',
|
||||
width: '120px',
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
// 加载数据方法 必须为 Promise 对象
|
||||
loadData: parameter => {
|
||||
return this.$http.get('/api/service', {
|
||||
params: Object.assign(parameter, this.queryParam)
|
||||
}).then(res => {
|
||||
return res.result
|
||||
})
|
||||
},
|
||||
|
||||
selectedRowKeys: [],
|
||||
selectedRows: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
handleChange (value, key, column) {
|
||||
console.log(value, key, column)
|
||||
},
|
||||
edit (row) {
|
||||
row.editable = true
|
||||
// row = Object.assign({}, row)
|
||||
this.$refs.table.updateEdit()
|
||||
},
|
||||
// eslint-disable-next-line
|
||||
del (row) {
|
||||
this.$confirm({
|
||||
title: '警告',
|
||||
content: '真的要删除吗?',
|
||||
okText: '删除',
|
||||
okType: 'danger',
|
||||
cancelText: '取消',
|
||||
onOk() {
|
||||
console.log('OK');
|
||||
// 在这里调用删除接口
|
||||
return new Promise((resolve, reject) => {
|
||||
setTimeout(Math.random() > 0.5 ? resolve : reject, 1000);
|
||||
}).catch(() => console.log('Oops errors!'));
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
});
|
||||
},
|
||||
save (row) {
|
||||
delete row.editable
|
||||
this.$refs.table.updateEdit()
|
||||
},
|
||||
cancel (row) {
|
||||
delete row.editable
|
||||
this.$refs.table.updateEdit()
|
||||
},
|
||||
|
||||
onChange (row) {
|
||||
this.selectedRowKeys = row.selectedRowKeys
|
||||
this.selectedRows = row.selectedRows
|
||||
},
|
||||
toggleAdvanced () {
|
||||
this.advanced = !this.advanced
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
/*
|
||||
'selectedRows': function (selectedRows) {
|
||||
this.needTotalList = this.needTotalList.map(item => {
|
||||
return {
|
||||
...item,
|
||||
total: selectedRows.reduce( (sum, val) => {
|
||||
return sum + val[item.dataIndex]
|
||||
}, 0)
|
||||
}
|
||||
})
|
||||
}
|
||||
*/
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.search {
|
||||
margin-bottom: 54px;
|
||||
}
|
||||
|
||||
.fold {
|
||||
width: calc(100% - 216px);
|
||||
display: inline-block
|
||||
}
|
||||
|
||||
.operator {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
.fold {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
337
jshERP-web/src/views/list/TableList.vue
Normal file
337
jshERP-web/src/views/list/TableList.vue
Normal file
@@ -0,0 +1,337 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="48">
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="规则编号">
|
||||
<a-input v-model="queryParam.id" placeholder=""/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="使用状态">
|
||||
<a-select v-model="queryParam.status" placeholder="请选择" default-value="0">
|
||||
<a-select-option value="0">全部</a-select-option>
|
||||
<a-select-option value="1">关闭</a-select-option>
|
||||
<a-select-option value="2">运行中</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<template v-if="advanced">
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="调用次数">
|
||||
<a-input-number v-model="queryParam.callNo" style="width: 100%"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="更新日期">
|
||||
<a-date-picker v-model="queryParam.date" style="width: 100%" placeholder="请输入更新日期"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="使用状态">
|
||||
<a-select v-model="queryParam.useStatus" placeholder="请选择" default-value="0">
|
||||
<a-select-option value="0">全部</a-select-option>
|
||||
<a-select-option value="1">关闭</a-select-option>
|
||||
<a-select-option value="2">运行中</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="使用状态">
|
||||
<a-select placeholder="请选择" default-value="0">
|
||||
<a-select-option value="0">全部</a-select-option>
|
||||
<a-select-option value="1">关闭</a-select-option>
|
||||
<a-select-option value="2">运行中</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</template>
|
||||
<a-col :md="!advanced && 8 || 24" :sm="24">
|
||||
<span class="table-page-search-submitButtons" :style="advanced && { float: 'right', overflow: 'hidden' } || {} ">
|
||||
<a-button type="primary">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="resetSearchForm">重置</a-button>
|
||||
<a @click="toggleAdvanced" style="margin-left: 8px">
|
||||
{{ advanced ? '收起' : '展开' }}
|
||||
<a-icon :type="advanced ? 'up' : 'down'"/>
|
||||
</a>
|
||||
</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<div class="table-operator">
|
||||
<a-button type="primary" icon="plus" @click="() => this.handleModalVisible(true)">新建</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1"><a-icon type="delete" />删除</a-menu-item>
|
||||
<!-- lock | unlock -->
|
||||
<a-menu-item key="2"><a-icon type="lock" />锁定</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
|
||||
<s-table
|
||||
ref="table"
|
||||
size="default"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
:showAlertInfo="true"
|
||||
@onSelect="onChange"
|
||||
>
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">
|
||||
更多 <a-icon type="down" />
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">详情</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">禁用</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">删除</a>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
</s-table>
|
||||
|
||||
<a-modal
|
||||
title="操作"
|
||||
:width="800"
|
||||
v-model="visible"
|
||||
@ok="handleOk"
|
||||
>
|
||||
<a-form :autoFormCreate="(form)=>{this.form = form}">
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="规则编号"
|
||||
hasFeedback
|
||||
validateStatus="success"
|
||||
>
|
||||
<a-input placeholder="规则编号" v-model="mdl.no" id="no" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="服务调用次数"
|
||||
hasFeedback
|
||||
validateStatus="success"
|
||||
>
|
||||
<a-input-number :min="1" id="callNo" v-model="mdl.callNo" style="width: 100%" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="状态"
|
||||
hasFeedback
|
||||
validateStatus="warning"
|
||||
>
|
||||
<a-select defaultValue="1" v-model="mdl.status">
|
||||
<a-select-option value="1">Option 1</a-select-option>
|
||||
<a-select-option value="2">Option 2</a-select-option>
|
||||
<a-select-option value="3">Option 3</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="描述"
|
||||
hasFeedback
|
||||
help="请填写一段描述"
|
||||
>
|
||||
<a-textarea :rows="5" v-model="mdl.description" placeholder="..." id="description"/>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="更新时间"
|
||||
hasFeedback
|
||||
validateStatus="error"
|
||||
>
|
||||
<a-date-picker
|
||||
style="width: 100%"
|
||||
showTime
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
placeholder="Select Time"
|
||||
/>
|
||||
</a-form-item>
|
||||
|
||||
</a-form>
|
||||
</a-modal>
|
||||
|
||||
<a-modal title="新建规则" destroyOnClose :visible="visibleCreateModal" @ok="handleCreateModalOk" @cancel="handleCreateModalCancel">
|
||||
<!---->
|
||||
<a-form style="margin-top: 8px" :autoFormCreate="(form)=>{this.createForm = form}">
|
||||
<a-form-item :labelCol="{ span: 5 }" :wrapperCol="{ span: 15 }" label="描述" fieldDecoratorId="description" :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入至少五个字符的规则描述！', min: 5 }]}">
|
||||
<a-input placeholder="请输入" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-modal>
|
||||
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import STable from '@/components/table/'
|
||||
import ATextarea from "ant-design-vue/es/input/TextArea"
|
||||
import AInput from "ant-design-vue/es/input/Input"
|
||||
import moment from "moment"
|
||||
import axios from 'axios';
|
||||
import { getRoleList, getServiceList } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: "TableList",
|
||||
components: {
|
||||
AInput,
|
||||
ATextarea,
|
||||
STable
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
visibleCreateModal:false,
|
||||
visible: false,
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 12 },
|
||||
},
|
||||
form: null,
|
||||
mdl: {},
|
||||
|
||||
// 高级搜索 展开/关闭
|
||||
advanced: true,
|
||||
// 查询参数
|
||||
queryParam: {},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '规则编号',
|
||||
dataIndex: 'no'
|
||||
},
|
||||
{
|
||||
title: '描述',
|
||||
dataIndex: 'description'
|
||||
},
|
||||
{
|
||||
title: '服务调用次数',
|
||||
dataIndex: 'callNo',
|
||||
sorter: true,
|
||||
needTotal: true,
|
||||
customRender: (text) => text + ' 次'
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
needTotal: true
|
||||
},
|
||||
{
|
||||
title: '更新时间',
|
||||
dataIndex: 'updatedAt',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
table: '操作',
|
||||
dataIndex: 'action',
|
||||
width: '150px',
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
// 加载数据方法 必须为 Promise 对象
|
||||
loadData: parameter => {
|
||||
return getServiceList(Object.assign(parameter, this.queryParam))
|
||||
.then(res => {
|
||||
return res.result
|
||||
})
|
||||
},
|
||||
|
||||
selectedRowKeys: [],
|
||||
selectedRows: []
|
||||
}
|
||||
},
|
||||
created () {
|
||||
getRoleList({ t: new Date()})
|
||||
},
|
||||
methods: {
|
||||
handleEdit (record) {
|
||||
this.mdl = Object.assign({}, record)
|
||||
console.log(this.mdl)
|
||||
this.visible = true
|
||||
},
|
||||
handleOk () {
|
||||
|
||||
},
|
||||
|
||||
//添加逻辑
|
||||
handleModalVisible(isVisible) {
|
||||
this.visibleCreateModal = isVisible;
|
||||
},
|
||||
handleCreateModalOk() {
|
||||
this.createForm.validateFields((err, fieldsValue) => {
|
||||
if (err) {
|
||||
return;
|
||||
}
|
||||
const description = this.createForm.getFieldValue('description');
|
||||
axios.post('/saveRule', {
|
||||
desc: description,
|
||||
}).then((res) => {
|
||||
this.createForm.resetFields();
|
||||
this.visibleCreateModal = false;
|
||||
this.loadRuleData();
|
||||
});
|
||||
});
|
||||
},
|
||||
handleCreateModalCancel() {
|
||||
this.visibleCreateModal = false;
|
||||
},
|
||||
|
||||
onChange (row) {
|
||||
this.selectedRowKeys = row.selectedRowKeys
|
||||
this.selectedRows = row.selectedRows
|
||||
|
||||
console.log(this.$refs.table)
|
||||
},
|
||||
toggleAdvanced () {
|
||||
this.advanced = !this.advanced
|
||||
},
|
||||
|
||||
resetSearchForm () {
|
||||
this.queryParam = {
|
||||
date: moment(new Date())
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
/*
|
||||
'selectedRows': function (selectedRows) {
|
||||
this.needTotalList = this.needTotalList.map(item => {
|
||||
return {
|
||||
...item,
|
||||
total: selectedRows.reduce( (sum, val) => {
|
||||
return sum + val[item.dataIndex]
|
||||
}, 0)
|
||||
}
|
||||
})
|
||||
}
|
||||
*/
|
||||
}
|
||||
}
|
||||
</script>
|
||||
264
jshERP-web/src/views/list/UserList.vue
Normal file
264
jshERP-web/src/views/list/UserList.vue
Normal file
@@ -0,0 +1,264 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="48">
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="角色ID">
|
||||
<a-input placeholder="请输入"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<a-form-item label="状态">
|
||||
<a-select placeholder="请选择" default-value="0">
|
||||
<a-select-option value="0">全部</a-select-option>
|
||||
<a-select-option value="1">关闭</a-select-option>
|
||||
<a-select-option value="2">运行中</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="24">
|
||||
<span class="table-page-search-submitButtons">
|
||||
<a-button type="primary">查询</a-button>
|
||||
<a-button style="margin-left: 8px">重置</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<s-table
|
||||
size="default"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
>
|
||||
<div
|
||||
slot="expandedRowRender"
|
||||
slot-scope="record"
|
||||
style="margin: 0">
|
||||
<a-row
|
||||
:gutter="24"
|
||||
:style="{ marginBottom: '12px' }">
|
||||
<a-col :span="12" v-for="(role, index) in record.permissions" :key="index" :style="{ marginBottom: '12px' }">
|
||||
<a-col :lg="4" :md="24">
|
||||
<span>{{ role.permissionName }}：</span>
|
||||
</a-col>
|
||||
<a-col :lg="20" :md="24" v-if="role.actionEntitySet.length > 0">
|
||||
<a-tag color="cyan" v-for="(action, k) in role.actionEntitySet" :key="k">{{ action.describe }}</a-tag>
|
||||
</a-col>
|
||||
<a-col :span="20" v-else>-</a-col>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">
|
||||
更多 <a-icon type="down" />
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">详情</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">禁用</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:;">删除</a>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
</s-table>
|
||||
|
||||
<a-modal
|
||||
title="操作"
|
||||
style="top: 20px;"
|
||||
:width="800"
|
||||
v-model="visible"
|
||||
@ok="handleOk"
|
||||
>
|
||||
<a-form :autoFormCreate="(form)=>{this.form = form}">
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="唯一识别码"
|
||||
hasFeedback
|
||||
validateStatus="success"
|
||||
>
|
||||
<a-input placeholder="唯一识别码" v-model="mdl.id" id="no" disabled="disabled" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="角色名称"
|
||||
hasFeedback
|
||||
validateStatus="success"
|
||||
>
|
||||
<a-input placeholder="起一个名字" v-model="mdl.name" id="role_name" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="状态"
|
||||
hasFeedback
|
||||
validateStatus="warning"
|
||||
>
|
||||
<a-select v-model="mdl.status">
|
||||
<a-select-option value="1">正常</a-select-option>
|
||||
<a-select-option value="2">禁用</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="描述"
|
||||
hasFeedback
|
||||
>
|
||||
<a-textarea :rows="5" v-model="mdl.describe" placeholder="..." id="describe"/>
|
||||
</a-form-item>
|
||||
|
||||
<a-divider />
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="拥有权限"
|
||||
hasFeedback
|
||||
>
|
||||
<a-row :gutter="16" v-for="(permission, index) in mdl.permissions" :key="index">
|
||||
<a-col :span="4">
|
||||
{{ permission.permissionName }}：
|
||||
</a-col>
|
||||
<a-col :span="20">
|
||||
<a-checkbox-group :options="permission.actionsOptions"/>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
</a-form-item>
|
||||
|
||||
</a-form>
|
||||
</a-modal>
|
||||
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import STable from '@/components/table/'
|
||||
import { getRoleList, getServiceList } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: "TableList",
|
||||
components: {
|
||||
STable
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
description: '列表使用场景：后台管理中的权限管理以及角色管理，可用于基于 RBAC 设计的角色权限控制，颗粒度细到每一个操作类型。',
|
||||
|
||||
visible: false,
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
form: null,
|
||||
mdl: {},
|
||||
|
||||
// 高级搜索 展开/关闭
|
||||
advanced: false,
|
||||
// 查询参数
|
||||
queryParam: {},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '唯一识别码',
|
||||
dataIndex: 'id'
|
||||
},
|
||||
{
|
||||
title: '角色名称',
|
||||
dataIndex: 'name',
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status'
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createTime',
|
||||
sorter: true
|
||||
}, {
|
||||
title: '操作',
|
||||
width: '150px',
|
||||
dataIndex: 'action',
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
// 加载数据方法 必须为 Promise 对象
|
||||
loadData: parameter => {
|
||||
return getRoleList(parameter)
|
||||
.then(res => {
|
||||
return res.result
|
||||
})
|
||||
},
|
||||
|
||||
selectedRowKeys: [],
|
||||
selectedRows: []
|
||||
}
|
||||
},
|
||||
created () {
|
||||
getServiceList().then(res => {
|
||||
console.log('getServiceList.call()', res)
|
||||
})
|
||||
|
||||
getRoleList().then(res => {
|
||||
console.log('getRoleList.call()', res)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
handleEdit (record) {
|
||||
this.mdl = Object.assign({}, record)
|
||||
|
||||
this.mdl.permissions.forEach(permission => {
|
||||
permission.actionsOptions = permission.actionEntitySet.map(action => {
|
||||
return { label: action.describe, value: action.action, defaultCheck: action.defaultCheck }
|
||||
})
|
||||
})
|
||||
|
||||
this.visible = true
|
||||
},
|
||||
handleOk () {
|
||||
|
||||
},
|
||||
onChange (selectedRowKeys, selectedRows) {
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
this.selectedRows = selectedRows
|
||||
},
|
||||
toggleAdvanced () {
|
||||
this.advanced = !this.advanced
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
/*
|
||||
'selectedRows': function (selectedRows) {
|
||||
this.needTotalList = this.needTotalList.map(item => {
|
||||
return {
|
||||
...item,
|
||||
total: selectedRows.reduce( (sum, val) => {
|
||||
return sum + val[item.dataIndex]
|
||||
}, 0)
|
||||
}
|
||||
})
|
||||
}
|
||||
*/
|
||||
}
|
||||
}
|
||||
</script>
|
||||
203
jshERP-web/src/views/list/modules/RoleModal.vue
Normal file
203
jshERP-web/src/views/list/modules/RoleModal.vue
Normal file
@@ -0,0 +1,203 @@
|
||||
<template>
|
||||
<a-modal
|
||||
title="操作"
|
||||
:width="800"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="唯一识别码"
|
||||
hasFeedback
|
||||
>
|
||||
<a-input placeholder="唯一识别码" disabled="disabled" v-decorator="[ 'id', {rules: []} ]" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="角色名称"
|
||||
hasFeedback >
|
||||
<a-input placeholder="起一个名字" v-decorator="[ 'name', {rules: [{ required: true, message: '不起一个名字吗？' }] }]" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="状态"
|
||||
hasFeedback >
|
||||
<a-select v-decorator="[ 'status', {rules: []} ]">
|
||||
<a-select-option :value="1">正常</a-select-option>
|
||||
<a-select-option :value="2">禁用</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="描述"
|
||||
hasFeedback
|
||||
>
|
||||
<a-textarea :rows="5" placeholder="..." v-decorator="[ 'describe', { rules: [] } ]" />
|
||||
</a-form-item>
|
||||
|
||||
<a-divider/>
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="拥有权限"
|
||||
hasFeedback
|
||||
>
|
||||
<a-row :gutter="16" v-for="(permission, index) in permissions" :key="index">
|
||||
<a-col :span="4">
|
||||
{{ permission.name }}：
|
||||
</a-col>
|
||||
<a-col :span="20">
|
||||
<a-checkbox
|
||||
v-if="permission.actionsOptions.length > 0"
|
||||
:indeterminate="permission.indeterminate"
|
||||
:checked="permission.checkedAll"
|
||||
@change="onChangeCheckAll($event, permission)">
|
||||
全选
|
||||
</a-checkbox>
|
||||
<a-checkbox-group :options="permission.actionsOptions" v-model="permission.selected" @change="onChangeCheck(permission)" />
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getPermissions } from '@/api/manage'
|
||||
import { actionToObject } from '@/utils/permissions'
|
||||
import pick from 'lodash.pick'
|
||||
|
||||
export default {
|
||||
name: "RoleModal",
|
||||
data () {
|
||||
return {
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
mdl: {},
|
||||
|
||||
form: this.$form.createForm(this),
|
||||
permissions: []
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.loadPermissions()
|
||||
},
|
||||
methods: {
|
||||
add () {
|
||||
this.edit({ id: 0 })
|
||||
},
|
||||
edit (record) {
|
||||
this.mdl = Object.assign({}, record)
|
||||
this.visible = true
|
||||
|
||||
// 有权限表，处理勾选
|
||||
if (this.mdl.permissions && this.permissions) {
|
||||
// 先处理要勾选的权限结构
|
||||
const permissionsAction = {}
|
||||
this.mdl.permissions.forEach(permission => {
|
||||
permissionsAction[permission.permissionId] = permission.actionEntitySet.map(entity => entity.action)
|
||||
})
|
||||
// 把权限表遍历一遍，设定要勾选的权限 action
|
||||
this.permissions.forEach(permission => {
|
||||
permission.selected = permissionsAction[permission.id]
|
||||
})
|
||||
}
|
||||
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.mdl, 'id', 'name', 'status', 'describe'))
|
||||
})
|
||||
console.log('this.mdl', this.mdl)
|
||||
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
},
|
||||
handleOk () {
|
||||
const _this = this
|
||||
// 触发表单验证
|
||||
this.form.validateFields((err, values) => {
|
||||
// 验证表单没错误
|
||||
if (!err) {
|
||||
console.log('form values', values)
|
||||
|
||||
_this.confirmLoading = true
|
||||
// 模拟后端请求 2000 毫秒延迟
|
||||
new Promise((resolve) => {
|
||||
setTimeout(() => resolve(), 2000)
|
||||
}).then(() => {
|
||||
// Do something
|
||||
_this.$message.success('保存成功')
|
||||
_this.$emit('ok')
|
||||
}).catch(() => {
|
||||
// Do something
|
||||
}).finally(() => {
|
||||
_this.confirmLoading = false
|
||||
_this.close()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
onChangeCheck (permission) {
|
||||
permission.indeterminate = !!permission.selected.length && (permission.selected.length < permission.actionsOptions.length)
|
||||
permission.checkedAll = permission.selected.length === permission.actionsOptions.length
|
||||
},
|
||||
onChangeCheckAll (e, permission) {
|
||||
Object.assign(permission, {
|
||||
selected: e.target.checked ? permission.actionsOptions.map(obj => obj.value) : [],
|
||||
indeterminate: false,
|
||||
checkedAll: e.target.checked
|
||||
})
|
||||
},
|
||||
loadPermissions () {
|
||||
getPermissions().then(res => {
|
||||
let result = res.result
|
||||
this.permissions = result.map(permission => {
|
||||
const options = actionToObject(permission.actionData)
|
||||
permission.checkedAll = false
|
||||
permission.selected = []
|
||||
permission.indeterminate = false
|
||||
permission.actionsOptions = options.map(option => {
|
||||
return {
|
||||
label: option.describe,
|
||||
value: option.action
|
||||
}
|
||||
})
|
||||
return permission
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
78
jshERP-web/src/views/list/search/SearchLayout.vue
Normal file
78
jshERP-web/src/views/list/search/SearchLayout.vue
Normal file
@@ -0,0 +1,78 @@
|
||||
<template>
|
||||
<div class="search-content">
|
||||
<router-view />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "SearchLayout",
|
||||
data () {
|
||||
return {
|
||||
tabs: {
|
||||
items: [
|
||||
{
|
||||
key: '1',
|
||||
title: '文章'
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
title: '项目'
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
title: '应用'
|
||||
},
|
||||
],
|
||||
active: () => {
|
||||
switch (this.$route.path) {
|
||||
case '/list/search/article':
|
||||
return '1'
|
||||
case '/list/search/project':
|
||||
return '2'
|
||||
case '/list/search/application':
|
||||
return '3'
|
||||
default:
|
||||
return '1'
|
||||
}
|
||||
},
|
||||
callback: (key) => {
|
||||
switch (key) {
|
||||
case '1':
|
||||
this.$router.push('/list/search/article')
|
||||
break
|
||||
case '2':
|
||||
this.$router.push('/list/search/project')
|
||||
break
|
||||
case '3':
|
||||
this.$router.push('/list/search/application')
|
||||
break
|
||||
default:
|
||||
this.$router.push('/workplace')
|
||||
}
|
||||
}
|
||||
},
|
||||
search: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.search-head{
|
||||
background-color: #fff;
|
||||
margin: -25px -24px -24px;
|
||||
.search-input{
|
||||
text-align: center;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
}
|
||||
.search-content{
|
||||
margin-top: 48px;
|
||||
}
|
||||
</style>
|
||||
487
jshERP-web/src/views/material/MaterialCategoryList.vue
Normal file
487
jshERP-web/src/views/material/MaterialCategoryList.vue
Normal file
@@ -0,0 +1,487 @@
|
||||
<template>
|
||||
<a-row :gutter="10">
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-card :bordered="false">
|
||||
|
||||
<!-- 按钮操作区域 -->
|
||||
<a-row style="margin-left: 14px">
|
||||
<a-button @click="handleAdd()" type="primary">添加类别</a-button>
|
||||
<a-button title="删除多条数据" @click="batchDel" type="default">批量删除</a-button>
|
||||
<a-button @click="refresh" type="default" icon="reload">刷新</a-button>
|
||||
</a-row>
|
||||
<div style="background: #fff;padding-left:16px;height: 100%; margin-top: 5px">
|
||||
<a-alert type="info" :showIcon="true">
|
||||
<div slot="message">
|
||||
当前选择：<span v-if="this.currSelected.title">{{ getCurrSelectedTitle() }}</span>
|
||||
<a v-if="this.currSelected.title" style="margin-left: 10px" @click="onClearSelected">取消选择</a>
|
||||
</div>
|
||||
</a-alert>
|
||||
<!-- 树-->
|
||||
<a-col :md="10" :sm="24">
|
||||
<template>
|
||||
<a-dropdown :trigger="[this.dropTrigger]" @visibleChange="dropStatus">
|
||||
<span style="user-select: none">
|
||||
<a-tree
|
||||
checkable
|
||||
multiple
|
||||
@select="onSelect"
|
||||
@check="onCheck"
|
||||
@rightClick="rightHandle"
|
||||
:selectedKeys="selectedKeys"
|
||||
:checkedKeys="checkedKeys"
|
||||
:treeData="categoryTree"
|
||||
:checkStrictly="checkStrictly"
|
||||
:expandedKeys="iExpandedKeys"
|
||||
:autoExpandParent="true"
|
||||
@expand="onExpand"/>
|
||||
</span>
|
||||
</a-dropdown>
|
||||
</template>
|
||||
</a-col>
|
||||
</div>
|
||||
</a-card>
|
||||
<!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
|
||||
<div class="drawer-bootom-button">
|
||||
<a-dropdown :trigger="['click']" placement="topCenter">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="switchCheckStrictly(1)">父子关联</a-menu-item>
|
||||
<a-menu-item key="2" @click="switchCheckStrictly(2)">取消关联</a-menu-item>
|
||||
<a-menu-item key="3" @click="checkALL">全部勾选</a-menu-item>
|
||||
<a-menu-item key="4" @click="cancelCheckALL">取消全选</a-menu-item>
|
||||
<a-menu-item key="5" @click="expandAll">展开所有</a-menu-item>
|
||||
<a-menu-item key="6" @click="closeAll">合并所有</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button>
|
||||
树操作 <a-icon type="up" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-card :bordered="false" v-if="selectedKeys.length>0">
|
||||
<a-form :form="form">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="名称">
|
||||
<a-input placeholder="请输入名称" v-decorator="['name', validatorRules.name ]"/>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="编号">
|
||||
<a-input placeholder="请输入编号" v-decorator="['serialNo', validatorRules.serialNo ]"/>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="上级目录">
|
||||
<a-tree-select style="width:100%" :dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
|
||||
allow-clear treeDefaultExpandAll="true"
|
||||
:treeData="treeData" v-model="model.parentId" placeholder="请选择上级目录">
|
||||
</a-tree-select>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="排序">
|
||||
<a-input-number v-decorator="[ 'sort' ]"/>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="备注">
|
||||
<a-textarea placeholder="请输入备注":rows="2" v-decorator.trim="[ 'remark' ]" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<div class="anty-form-btn">
|
||||
<a-button @click="emptyCurrForm" type="default" htmlType="button" icon="sync">重置</a-button>
|
||||
<a-button @click="submitCurrForm" type="primary" htmlType="button" icon="form">保存</a-button>
|
||||
</div>
|
||||
</a-card>
|
||||
<a-card v-else >
|
||||
<a-empty>
|
||||
<span slot="description"> 请先选择一个类别! </span>
|
||||
</a-empty>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<material-category-modal ref="materialCategoryModal" @ok="loadTree"></material-category-modal>
|
||||
</a-row>
|
||||
</template>
|
||||
<script>
|
||||
import MaterialCategoryModal from '../material/modules/MaterialCategoryModal'
|
||||
import pick from 'lodash.pick'
|
||||
import {queryMaterialCategoryTreeList,queryMaterialCategoryById} from '@/api/api'
|
||||
import {httpAction, deleteAction} from '@/api/manage'
|
||||
import {JeecgListMixin} from '@/mixins/JeecgListMixin'
|
||||
export default {
|
||||
name: 'MaterialCategoryList',
|
||||
mixins: [JeecgListMixin],
|
||||
components: {
|
||||
MaterialCategoryModal
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
iExpandedKeys: [],
|
||||
loading: false,
|
||||
currFlowId: '',
|
||||
currFlowName: '',
|
||||
disable: true,
|
||||
treeData: [],
|
||||
visible: false,
|
||||
categoryTree: [],
|
||||
rightClickSelectedKey: '',
|
||||
rightClickSelectedOrgCode: '',
|
||||
hiding: true,
|
||||
model: {},
|
||||
dropTrigger: '',
|
||||
category: {},
|
||||
disableSubmit: false,
|
||||
checkedKeys: [],
|
||||
selectedKeys: [],
|
||||
autoIncr: 1,
|
||||
currSelected: {},
|
||||
allTreeKeys:[],
|
||||
checkStrictly: true,
|
||||
form: this.$form.createForm(this),
|
||||
labelCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 5}
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 16}
|
||||
},
|
||||
graphDatasource: {
|
||||
nodes: [],
|
||||
edges: []
|
||||
},
|
||||
validatorRules:{
|
||||
name: {rules: [{required: true, message: '请输入名称!'}]},
|
||||
serialNo: {rules: [{required: true, message: '请输入编号!'}]}
|
||||
},
|
||||
url: {
|
||||
delete: '/materialCategory/delete',
|
||||
edit: '/materialCategory/update',
|
||||
deleteBatch: '/materialCategory/deleteBatch'
|
||||
},
|
||||
orgCategoryDisabled:false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
importExcelUrl: function () {
|
||||
return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadData() {
|
||||
this.refresh();
|
||||
},
|
||||
loadTree() {
|
||||
var that = this
|
||||
that.treeData = []
|
||||
that.categoryTree = []
|
||||
let params = {};
|
||||
params.id='';
|
||||
queryMaterialCategoryTreeList(params).then((res) => {
|
||||
if (res) {
|
||||
//类别全选后，再添加类别，选中数量增多
|
||||
this.allTreeKeys = [];
|
||||
for (let i = 0; i < res.length; i++) {
|
||||
let temp = res[i]
|
||||
that.treeData.push(temp)
|
||||
that.categoryTree.push(temp)
|
||||
that.setThisExpandedKeys(temp)
|
||||
that.getAllKeys(temp);
|
||||
// console.log(temp.id)
|
||||
}
|
||||
this.loading = false
|
||||
}
|
||||
})
|
||||
},
|
||||
setThisExpandedKeys(node) {
|
||||
if (node.children && node.children.length > 0) {
|
||||
this.iExpandedKeys.push(node.key)
|
||||
for (let a = 0; a < node.children.length; a++) {
|
||||
this.setThisExpandedKeys(node.children[a])
|
||||
}
|
||||
}
|
||||
},
|
||||
refresh() {
|
||||
this.loading = true
|
||||
this.loadTree()
|
||||
},
|
||||
// 右键操作方法
|
||||
rightHandle(node) {
|
||||
this.dropTrigger = 'contextmenu'
|
||||
console.log(node.node.eventKey)
|
||||
this.rightClickSelectedKey = node.node.eventKey
|
||||
this.rightClickSelectedOrgCode = node.node.dataRef.orgCode
|
||||
},
|
||||
onExpand(expandedKeys) {
|
||||
console.log('onExpand', expandedKeys)
|
||||
// if not set autoExpandParent to false, if children expanded, parent can not collapse.
|
||||
// or, you can remove all expanded children keys.
|
||||
this.iExpandedKeys = expandedKeys
|
||||
},
|
||||
backFlowList() {
|
||||
this.$router.back(-1)
|
||||
},
|
||||
// 右键点击下拉框改变事件
|
||||
dropStatus(visible) {
|
||||
if (visible == false) {
|
||||
this.dropTrigger = ''
|
||||
}
|
||||
},
|
||||
// 右键店家下拉关闭下拉框
|
||||
closeDrop() {
|
||||
this.dropTrigger = ''
|
||||
},
|
||||
addRootNode() {
|
||||
this.$refs.nodeModal.add(this.currFlowId, '')
|
||||
},
|
||||
batchDel: function () {
|
||||
console.log(this.checkedKeys)
|
||||
if (this.checkedKeys.length <= 0) {
|
||||
this.$message.warning('请选择一条记录！')
|
||||
} else {
|
||||
var ids = ''
|
||||
for (var a = 0; a < this.checkedKeys.length; a++) {
|
||||
ids += this.checkedKeys[a] + ','
|
||||
}
|
||||
var that = this
|
||||
this.$confirm({
|
||||
title: '确认删除',
|
||||
content: '确定要删除所选中的 ' + this.checkedKeys.length + ' 条数据，以及子节点数据吗?',
|
||||
onOk: function () {
|
||||
deleteAction(that.url.deleteBatch, {ids: ids}).then((res) => {
|
||||
if (res.code == 200) {
|
||||
that.$message.success(res.data.message)
|
||||
that.loadTree()
|
||||
that.onClearSelected()
|
||||
} else {
|
||||
that.$message.warning(res.data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
nodeModalOk() {
|
||||
this.loadTree()
|
||||
},
|
||||
nodeModalClose() {
|
||||
},
|
||||
hide() {
|
||||
console.log(111)
|
||||
this.visible = false
|
||||
},
|
||||
onCheck(checkedKeys, info) {
|
||||
console.log('onCheck', checkedKeys, info)
|
||||
this.hiding = false
|
||||
//this.checkedKeys = checkedKeys.checked
|
||||
// <!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
|
||||
if(this.checkStrictly){
|
||||
this.checkedKeys = checkedKeys.checked;
|
||||
}else{
|
||||
this.checkedKeys = checkedKeys
|
||||
}
|
||||
// <!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
|
||||
},
|
||||
onSelect(selectedKeys, e) {
|
||||
console.log('selected', selectedKeys, e)
|
||||
this.hiding = false
|
||||
let record = e.node.dataRef
|
||||
let params = {};
|
||||
params.id=record.id;
|
||||
queryMaterialCategoryById(params).then((res) => {
|
||||
if (res && res.code == 200) {
|
||||
if(res.data){
|
||||
record.name = res.data.name;
|
||||
record.serialNo = res.data.serialNo;
|
||||
record.parentId = res.data.parentId;
|
||||
record.sort = res.data.sort;
|
||||
record.remark = res.data.remark;
|
||||
console.log('onSelect-record', record)
|
||||
this.currSelected = Object.assign({}, record)
|
||||
this.model = this.currSelected
|
||||
this.selectedKeys = [record.key]
|
||||
this.model.parentId = record.parentId
|
||||
this.setValuesToForm(record)
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
// 触发onSelect事件时,为类别树右侧的form表单赋值
|
||||
setValuesToForm(record) {
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(record, 'name','serialNo', 'parentId', 'sort', 'remark'))
|
||||
})
|
||||
},
|
||||
getCurrSelectedTitle() {
|
||||
return !this.currSelected.title ? '' : this.currSelected.title
|
||||
},
|
||||
onClearSelected() {
|
||||
this.hiding = true
|
||||
this.checkedKeys = []
|
||||
this.currSelected = {}
|
||||
this.form.resetFields()
|
||||
this.selectedKeys = []
|
||||
},
|
||||
handleNodeTypeChange(val) {
|
||||
this.currSelected.nodeType = val
|
||||
},
|
||||
notifyTriggerTypeChange(value) {
|
||||
this.currSelected.notifyTriggerType = value
|
||||
},
|
||||
receiptTriggerTypeChange(value) {
|
||||
this.currSelected.receiptTriggerType = value
|
||||
},
|
||||
submitCurrForm() {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
if (!this.currSelected.id) {
|
||||
this.$message.warning('请点击选择要修改类别!')
|
||||
return
|
||||
}
|
||||
|
||||
let formData = Object.assign(this.currSelected, values)
|
||||
console.log('Received values of form: ', formData)
|
||||
httpAction(this.url.edit, formData, 'put').then((res) => {
|
||||
if (res.code == 200) {
|
||||
this.$message.success('保存成功!')
|
||||
this.loadTree()
|
||||
} else {
|
||||
this.$message.error(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
emptyCurrForm() {
|
||||
this.form.resetFields()
|
||||
},
|
||||
nodeSettingFormSubmit() {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
console.log('Received values of form: ', values)
|
||||
}
|
||||
})
|
||||
},
|
||||
openSelect() {
|
||||
this.$refs.sysDirectiveModal.show()
|
||||
},
|
||||
handleAdd() {
|
||||
this.$refs.materialCategoryModal.add()
|
||||
this.$refs.materialCategoryModal.title = '新增'
|
||||
},
|
||||
selectDirectiveOk(record) {
|
||||
console.log('选中指令数据', record)
|
||||
this.nodeSettingForm.setFieldsValue({directiveCode: record.directiveCode})
|
||||
this.currSelected.sysCode = record.sysCode
|
||||
},
|
||||
getFlowGraphData(node) {
|
||||
this.graphDatasource.nodes.push({
|
||||
id: node.id,
|
||||
text: node.flowNodeName
|
||||
})
|
||||
if (node.children.length > 0) {
|
||||
for (let a = 0; a < node.children.length; a++) {
|
||||
let temp = node.children[a]
|
||||
this.graphDatasource.edges.push({
|
||||
source: node.id,
|
||||
target: temp.id
|
||||
})
|
||||
this.getFlowGraphData(temp)
|
||||
}
|
||||
}
|
||||
},
|
||||
// <!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
|
||||
expandAll () {
|
||||
this.iExpandedKeys = this.allTreeKeys
|
||||
},
|
||||
closeAll () {
|
||||
this.iExpandedKeys = []
|
||||
},
|
||||
checkALL () {
|
||||
this.checkStriccheckStrictlytly = false
|
||||
this.checkedKeys = this.allTreeKeys
|
||||
},
|
||||
cancelCheckALL () {
|
||||
//this.checkedKeys = this.defaultCheckedKeys
|
||||
this.checkedKeys = []
|
||||
},
|
||||
switchCheckStrictly (v) {
|
||||
if(v==1){
|
||||
this.checkStrictly = false
|
||||
}else if(v==2){
|
||||
this.checkStrictly = true
|
||||
}
|
||||
},
|
||||
getAllKeys(node) {
|
||||
// console.log('node',node);
|
||||
this.allTreeKeys.push(node.key)
|
||||
if (node.children && node.children.length > 0) {
|
||||
for (let a = 0; a < node.children.length; a++) {
|
||||
this.getAllKeys(node.children[a])
|
||||
}
|
||||
}
|
||||
}
|
||||
// <!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
|
||||
|
||||
},
|
||||
created() {
|
||||
this.currFlowId = this.$route.params.id
|
||||
this.currFlowName = this.$route.params.name
|
||||
// this.loadTree()
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.ant-card-body .table-operator {
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
.anty-form-btn {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.anty-form-btn button {
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.anty-node-layout .ant-layout-header {
|
||||
padding-right: 0
|
||||
}
|
||||
|
||||
.header {
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.header button {
|
||||
margin: 0 3px
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-body {
|
||||
height: calc(100% - 110px) !important;
|
||||
overflow-y: auto
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-content {
|
||||
height: 90% !important;
|
||||
overflow-y: hidden
|
||||
}
|
||||
|
||||
#app .desktop {
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
/** Button按钮间距 */
|
||||
.ant-btn {
|
||||
margin-left: 3px
|
||||
}
|
||||
|
||||
.drawer-bootom-button {
|
||||
/*position: absolute;*/
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
border-top: 1px solid #e8e8e8;
|
||||
padding: 10px 16px;
|
||||
text-align: left;
|
||||
left: 0;
|
||||
background: #fff;
|
||||
border-radius: 0 0 2px 2px;
|
||||
}
|
||||
</style>
|
||||
235
jshERP-web/src/views/material/MaterialList.vue
Normal file
235
jshERP-web/src/views/material/MaterialList.vue
Normal file
@@ -0,0 +1,235 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="类别">
|
||||
<a-tree-select style="width:100%" :dropdownStyle="{maxHeight:'200px',overflow:'auto'}" allow-clear
|
||||
:treeData="categoryTree" v-model="queryParam.categoryId" placeholder="请选择类别">
|
||||
</a-tree-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="条码" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入条码查询" v-model="queryParam.barCode"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="名称" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称查询" v-model="queryParam.name"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<template v-if="toggleSearchStatus">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="规格" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入规格查询" v-model="queryParam.standard"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="型号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入型号查询" v-model="queryParam.model"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</template>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
<a @click="handleToggleSearch" style="margin-left: 8px">
|
||||
{{ toggleSearchStatus ? '收起' : '展开' }}
|
||||
<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
|
||||
</a>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin-top: 5px">
|
||||
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
|
||||
<a-popover title="表格模板">
|
||||
<template slot="content">
|
||||
<p><a target="_blank" href="/doc/goods_template.xls"><b>商品Excel模板下载</b></a></p>
|
||||
</template>
|
||||
<a-button type="primary" icon="import">导入</a-button>
|
||||
</a-popover>
|
||||
</a-upload>
|
||||
<a-button type="primary" icon="download" @click="handleExportXls('商品信息')">导出</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
<a-menu-item key="2" @click="batchSetStatus(true)"><a-icon type="check-square"/>启用</a-menu-item>
|
||||
<a-menu-item key="3" @click="batchSetStatus(false)"><a-icon type="close-square"/>禁用</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
批量操作 <a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:scroll="{ x: 1500, y: 500 }"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
<template slot="customRenderEnabled" slot-scope="enabled">
|
||||
<a-tag v-if="enabled" color="green">启用</a-tag>
|
||||
<a-tag v-if="!enabled" color="orange">禁用</a-tag>
|
||||
</template>
|
||||
<template slot="customRenderEnableSerialNumber" slot-scope="enableSerialNumber">
|
||||
<a-tag v-if="enableSerialNumber==1" color="green">有</a-tag>
|
||||
<a-tag v-if="enableSerialNumber==0" color="orange">无</a-tag>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<material-modal ref="modalForm" @ok="modalFormOk"></material-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import MaterialModal from './modules/MaterialModal'
|
||||
import {queryMaterialCategoryTreeList,queryMaterialCategoryById} from '@/api/api'
|
||||
import { getAction } from '@/api/manage'
|
||||
import { getMpListShort } from "@/utils/util"
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "MaterialList",
|
||||
mixins:[JeecgListMixin],
|
||||
components: {
|
||||
MaterialModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
categoryTree:[],
|
||||
mPropertyListShort: '',
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
// 查询条件
|
||||
queryParam: {
|
||||
categoryId:'',
|
||||
barCode:'',
|
||||
name:'',
|
||||
standard:'',
|
||||
model:'',
|
||||
mpList: getMpListShort(Vue.ls.get('materialPropertyList')) //扩展属性
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
fixed: 'left',
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{title: '条码', dataIndex: 'mBarCode', width: 120,fixed: 'left'},
|
||||
{title: '名称', dataIndex: 'name', width: 120},
|
||||
{title: '规格', dataIndex: 'standard', width: 80},
|
||||
{title: '型号', dataIndex: 'model', width: 80},
|
||||
{title: '颜色', dataIndex: 'color', width: 50},
|
||||
{title: '类别', dataIndex: 'categoryName', width: 80},
|
||||
{title: '扩展信息', dataIndex: 'materialOther', width: 100},
|
||||
{
|
||||
title: '单位', dataIndex: 'unit', width: 100, customRender: function (text, record, index) {
|
||||
if(text) {
|
||||
return text;
|
||||
} else {
|
||||
return record.unitName;
|
||||
}
|
||||
}
|
||||
},
|
||||
{title: '安全存量', dataIndex: 'safetyStock', width: 80},
|
||||
{title: '库存', dataIndex: 'stock', width: 70},
|
||||
{title: '采购价', dataIndex: 'purchaseDecimal', width: 70},
|
||||
{title: '零售价', dataIndex: 'commodityDecimal', width: 70},
|
||||
{title: '销售价', dataIndex: 'wholesaleDecimal', width: 70},
|
||||
{title: '最低售价', dataIndex: 'lowDecimal', width: 80},
|
||||
{title: '状态', dataIndex: 'enabled', width: 60, align: "center",
|
||||
scopedSlots: { customRender: 'customRenderEnabled' }
|
||||
},
|
||||
{title: '序列号', dataIndex: 'enableSerialNumber', width: 60, align: "center",
|
||||
scopedSlots: { customRender: 'customRenderEnableSerialNumber' }
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center",
|
||||
width: 100,
|
||||
fixed: 'right',
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/material/list",
|
||||
delete: "/material/delete",
|
||||
deleteBatch: "/material/deleteBatch",
|
||||
importExcelUrl: "/material/importExcel",
|
||||
exportXlsUrl: "/material/exportExcel",
|
||||
batchSetStatusUrl: "/material/batchSetStatus"
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.model = Object.assign({}, {});
|
||||
this.loadTreeData();
|
||||
},
|
||||
computed: {
|
||||
importExcelUrl: function () {
|
||||
return `${window._CONFIG['domianURL']}${this.url.importExcelUrl}`;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadTreeData(){
|
||||
let that = this;
|
||||
let params = {};
|
||||
params.id='';
|
||||
queryMaterialCategoryTreeList(params).then((res)=>{
|
||||
if(res){
|
||||
that.categoryTree = [];
|
||||
for (let i = 0; i < res.length; i++) {
|
||||
let temp = res[i];
|
||||
that.categoryTree.push(temp);
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
107
jshERP-web/src/views/material/MaterialPropertyList.vue
Normal file
107
jshERP-web/src/views/material/MaterialPropertyList.vue
Normal file
@@ -0,0 +1,107 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="card-area">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="名称" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<a-input placeholder="请输入名称查询" v-model="queryParam.name"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">查询</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
</span>
|
||||
<!-- 状态渲染模板 -->
|
||||
<template slot="customRenderFlag" slot-scope="enabled">
|
||||
<a-tag v-if="enabled==1" color="green">启用</a-tag>
|
||||
<a-tag v-if="enabled==0" color="orange">禁用</a-tag>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
<!-- 表单区域 -->
|
||||
<material-property-modal ref="modalForm" @ok="modalFormOk"></material-property-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
import MaterialPropertyModal from './modules/MaterialPropertyModal'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
export default {
|
||||
name: "MaterialPropertyList",
|
||||
mixins:[JeecgListMixin],
|
||||
components: {
|
||||
MaterialPropertyModal,
|
||||
JDate
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 查询条件
|
||||
queryParam: {name:'',type:''},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key:'rowIndex',
|
||||
width:40,
|
||||
align:"center",
|
||||
customRender:function (t,r,index) {
|
||||
return parseInt(index)+1;
|
||||
}
|
||||
},
|
||||
{title: '名称', dataIndex: 'nativeName', width: 100},
|
||||
{
|
||||
title: '是否启用', dataIndex: 'enabled', width: 100, align: "center",
|
||||
scopedSlots: { customRender: 'customRenderFlag' }
|
||||
},
|
||||
{title: '排序', dataIndex: 'sort', width: 100},
|
||||
{title: '别名', dataIndex: 'anotherName', width: 100},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center",
|
||||
scopedSlots: { customRender: 'action' },
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/materialProperty/list",
|
||||
delete: "/materialProperty/delete",
|
||||
deleteBatch: "/materialProperty/deleteBatch"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less'
|
||||
</style>
|
||||
145
jshERP-web/src/views/material/modules/MaterialCategoryModal.vue
Normal file
145
jshERP-web/src/views/material/modules/MaterialCategoryModal.vue
Normal file
@@ -0,0 +1,145 @@
|
||||
<template>
|
||||
<a-modal
|
||||
:title="title"
|
||||
:width="800"
|
||||
:ok=false
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
:okButtonProps="{ props: {disabled: disableSubmit} }"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="名称">
|
||||
<a-input placeholder="请输入名称" v-decorator="['name', validatorRules.name ]"/>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="编号">
|
||||
<a-input placeholder="请输入编号" v-decorator="['serialNo', validatorRules.serialNo ]"/>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="上级目录">
|
||||
<a-tree-select style="width:100%" :dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
|
||||
allow-clear treeDefaultExpandAll="true"
|
||||
:treeData="categoryTree" v-model="model.parentId" placeholder="请选择上级目录">
|
||||
</a-tree-select>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="排序">
|
||||
<a-input-number v-decorator="[ 'sort' ]"/>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="备注">
|
||||
<a-textarea placeholder="请输入备注":rows="2" v-decorator.trim="[ 'remark' ]" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { httpAction } from '@/api/manage'
|
||||
import { queryMaterialCategoryTreeList } from '@/api/api'
|
||||
import pick from 'lodash.pick'
|
||||
import ATextarea from 'ant-design-vue/es/input/TextArea'
|
||||
export default {
|
||||
name: "MaterialCategoryModal",
|
||||
components: { ATextarea },
|
||||
data () {
|
||||
return {
|
||||
categoryTree:[],
|
||||
orgTypeData:[],
|
||||
phoneWarning:'',
|
||||
departName:"",
|
||||
title:"操作",
|
||||
visible: false,
|
||||
disableSubmit:false,
|
||||
model: {},
|
||||
menuhidden:false,
|
||||
menuusing:true,
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules:{
|
||||
name: {rules: [{required: true, message: '请输入名称!'}]},
|
||||
serialNo: {rules: [{required: true, message: '请输入编号!'}]}
|
||||
},
|
||||
url: {
|
||||
add: "/materialCategory/add",
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
loadTreeData(){
|
||||
var that = this;
|
||||
let params = {};
|
||||
params.id='';
|
||||
queryMaterialCategoryTreeList(params).then((res)=>{
|
||||
if(res){
|
||||
that.categoryTree = [];
|
||||
for (let i = 0; i < res.length; i++) {
|
||||
let temp = res[i];
|
||||
that.categoryTree.push(temp);
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
add () {
|
||||
this.edit();
|
||||
},
|
||||
edit (record) {
|
||||
this.form.resetFields();
|
||||
this.model = Object.assign({}, {});
|
||||
this.visible = true;
|
||||
this.loadTreeData();
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(record, 'orgFullName','orgAbr', 'orgNo', 'parentId', 'sort', 'remark'))
|
||||
});
|
||||
},
|
||||
close () {
|
||||
this.$emit('close');
|
||||
this.disableSubmit = false;
|
||||
this.visible = false;
|
||||
},
|
||||
handleOk () {
|
||||
const that = this;
|
||||
// 触发表单验证
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
that.confirmLoading = true;
|
||||
let formData = Object.assign(this.model, values);
|
||||
//时间格式化
|
||||
console.log(formData)
|
||||
httpAction(this.url.add,formData,"post").then((res)=>{
|
||||
if(res.code == 200){
|
||||
that.$message.success(res.data.message);
|
||||
that.loadTreeData();
|
||||
that.$emit('ok');
|
||||
}else{
|
||||
that.$message.warning(res.data.message);
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false;
|
||||
that.close();
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
490
jshERP-web/src/views/material/modules/MaterialModal.vue
Normal file
490
jshERP-web/src/views/material/modules/MaterialModal.vue
Normal file
@@ -0,0 +1,490 @@
|
||||
<template>
|
||||
<a-modal
|
||||
:title="title"
|
||||
:width="1000"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;height: 100%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-tabs default-active-key="1">
|
||||
<a-tab-pane key="1" tab="基本信息" forceRender>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="8" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="名称">
|
||||
<a-input placeholder="请输入名称" v-decorator.trim="[ 'name', validatorRules.name]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="8" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="规格">
|
||||
<a-input placeholder="请输入规格" v-decorator.trim="[ 'standard' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="8" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单位">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="13" :md="13" :sm="24">
|
||||
<a-input placeholder="输入单位" :hidden="unitStatus" v-decorator.trim="[ 'unit' ]" />
|
||||
<a-select :value="unitList" placeholder="选择单位" v-decorator="[ 'unitId' ]"
|
||||
:hidden="manyUnitStatus" :dropdownMatchSelectWidth="false">
|
||||
<a-select-option v-for="(item,index) in unitList"
|
||||
:key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-col>
|
||||
<a-col :lg="11" :md="11" :sm="24">
|
||||
<a-checkbox :checked="unitChecked" @change="unitOnChange">多单位</a-checkbox>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="8" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="型号">
|
||||
<a-input placeholder="请输入型号" v-decorator.trim="[ 'model' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="8" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="颜色">
|
||||
<a-input placeholder="请输入颜色" v-decorator.trim="[ 'color' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="8" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="类别">
|
||||
<a-tree-select style="width:100%" :dropdownStyle="{maxHeight:'200px',overflow:'auto'}" allow-clear
|
||||
:treeData="categoryTree" v-decorator="[ 'categoryId' ]" placeholder="请选择类别">
|
||||
</a-tree-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="8" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="序列号">
|
||||
<a-select placeholder="请选择序列号" v-decorator="[ 'enableSerialNumber' ]">
|
||||
<a-select-option value="1">有</a-select-option>
|
||||
<a-select-option value="0">无</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="8" :md="12" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="安全存量">
|
||||
<a-input placeholder="请输入安全存量" v-decorator.trim="[ 'safetyStock' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="8" :md="12" :sm="24">
|
||||
</a-col>
|
||||
</a-row>
|
||||
<j-editable-table
|
||||
ref="editableMeTable"
|
||||
:loading="meTable.loading"
|
||||
:columns="meTable.columns"
|
||||
:dataSource="meTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="true"
|
||||
:rowSelection="true"
|
||||
:actionButton="true"/>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :lg="24" :md="24" :sm="24">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
|
||||
<a-textarea :rows="2" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="扩展信息" forceRender>
|
||||
<a-row v-if="mpShort.mfrs.enabled" class="form-row" :gutter="24">
|
||||
<a-col :lg="8" :md="8" :sm="8">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="mpShort.mfrs.name">
|
||||
<a-input v-decorator.trim="[ 'mfrs' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row v-if="mpShort.otherField1.enabled" class="form-row" :gutter="24">
|
||||
<a-col :lg="8" :md="8" :sm="8">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="mpShort.otherField1.name">
|
||||
<a-input v-decorator.trim="[ 'otherField1' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row v-if="mpShort.otherField2.enabled" class="form-row" :gutter="24">
|
||||
<a-col :lg="8" :md="8" :sm="8">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="mpShort.otherField2.name">
|
||||
<a-input v-decorator.trim="[ 'otherField2' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row v-if="mpShort.otherField3.enabled" class="form-row" :gutter="24">
|
||||
<a-col :lg="8" :md="8" :sm="8">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="mpShort.otherField3.name">
|
||||
<a-input v-decorator.trim="[ 'otherField3' ]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="初始库存" forceRender>
|
||||
<j-editable-table
|
||||
ref="editableDepotTable"
|
||||
:loading="depotTable.loading"
|
||||
:columns="depotTable.columns"
|
||||
:dataSource="depotTable.dataSource"
|
||||
:maxHeight="300"
|
||||
:rowNumber="true"
|
||||
:rowSelection="false"
|
||||
:actionButton="false"/>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import JEditableTable from '@/components/jeecg/JEditableTable'
|
||||
import { FormTypes, VALIDATE_NO_PASSED, getRefPromise, validateFormAndTables } from '@/utils/JEditableTableUtil'
|
||||
import {queryMaterialCategoryTreeList,addMaterial,editMaterial,checkMaterial} from '@/api/api'
|
||||
import { httpAction, getAction } from '@/api/manage'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import Vue from 'vue'
|
||||
export default {
|
||||
name: "MaterialModal",
|
||||
components: {
|
||||
JDate, JEditableTable
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
visible: false,
|
||||
categoryTree: [],
|
||||
unitList: [],
|
||||
depotList: [],
|
||||
unitStatus: false,
|
||||
manyUnitStatus: true,
|
||||
unitChecked: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
mpShort: {
|
||||
mfrs: {},
|
||||
otherField1: {},
|
||||
otherField2: {},
|
||||
otherField3: {}
|
||||
},
|
||||
meTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{
|
||||
title: '条码',
|
||||
key: 'barCode',
|
||||
width: '30%',
|
||||
type: FormTypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}',
|
||||
validateRules: [{ required: true, message: '${title}不能为空' }]
|
||||
},
|
||||
{
|
||||
title: '单位',
|
||||
key: 'commodityUnit',
|
||||
width: '12%',
|
||||
type: FormTypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}'
|
||||
},
|
||||
{
|
||||
title: '采购价',
|
||||
key: 'purchaseDecimal',
|
||||
width: '12%',
|
||||
type: FormTypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}'
|
||||
},
|
||||
{
|
||||
title: '零售价',
|
||||
key: 'commodityDecimal',
|
||||
width: '12%',
|
||||
type: FormTypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}'
|
||||
},
|
||||
{
|
||||
title: '销售价',
|
||||
key: 'wholesaleDecimal',
|
||||
width: '12%',
|
||||
type: FormTypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}'
|
||||
},
|
||||
{
|
||||
title: '最低售价',
|
||||
key: 'lowDecimal',
|
||||
width: '12%',
|
||||
type: FormTypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}'
|
||||
}
|
||||
]
|
||||
},
|
||||
depotTable: {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{
|
||||
title: '仓库',
|
||||
key: 'name',
|
||||
width: '15%',
|
||||
type: FormTypes.normal
|
||||
},
|
||||
{
|
||||
title: '库存数量',
|
||||
key: 'initStock',
|
||||
width: '15%',
|
||||
type: FormTypes.input,
|
||||
defaultValue: '',
|
||||
placeholder: '请输入${title}'
|
||||
}
|
||||
]
|
||||
},
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules:{
|
||||
name:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入名称!' },
|
||||
{ min: 2, max: 30, message: '长度在 2 到 30 个字符', trigger: 'blur' },
|
||||
{ validator: this.validateMaterialName}
|
||||
]
|
||||
}
|
||||
},
|
||||
url: {
|
||||
add: '/material/add',
|
||||
edit: '/material/update',
|
||||
materialsExtendList: '/materialsExtend/getDetailList',
|
||||
depotWithStock: '/depot/getAllListWithStock'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.loadTreeData();
|
||||
this.loadUnitListData();
|
||||
this.loadParseMaterialProperty();
|
||||
},
|
||||
methods: {
|
||||
// 获取所有的editableTable实例
|
||||
getAllTable() {
|
||||
return Promise.all([
|
||||
getRefPromise(this, 'editableMeTable'),
|
||||
getRefPromise(this, 'editableDepotTable')
|
||||
])
|
||||
},
|
||||
add () {
|
||||
// 默认新增一条数据
|
||||
this.getAllTable().then(editableTables => {
|
||||
editableTables[0].add()
|
||||
})
|
||||
this.edit({});
|
||||
},
|
||||
edit (record) {
|
||||
this.form.resetFields();
|
||||
this.model = Object.assign({}, record);
|
||||
this.activeKey = '1'
|
||||
this.visible = true;
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model, 'name', 'standard', 'unit', 'unitId', 'model', 'color',
|
||||
'categoryId','enableSerialNumber','safetyStock','remark','mfrs','otherField1','otherField2','otherField3'))
|
||||
});
|
||||
// 加载子表数据
|
||||
if (this.model.id) {
|
||||
// 判断是否是多单位
|
||||
if(this.model.unit){
|
||||
this.unitChecked = false
|
||||
this.unitStatus = false
|
||||
this.manyUnitStatus = true
|
||||
} else {
|
||||
this.unitChecked = true
|
||||
this.unitStatus = true
|
||||
this.manyUnitStatus = false
|
||||
}
|
||||
let params = { materialId: this.model.id }
|
||||
this.requestMeTableData(this.url.materialsExtendList, params, this.meTable)
|
||||
this.requestDepotTableData(this.url.depotWithStock, { mId: this.model.id }, this.depotTable)
|
||||
} else {
|
||||
this.requestDepotTableData(this.url.depotWithStock, { mId: 0 }, this.depotTable)
|
||||
}
|
||||
},
|
||||
/** 查询条码tab的数据 */
|
||||
requestMeTableData(url, params, tab) {
|
||||
tab.loading = true
|
||||
getAction(url, params).then(res => {
|
||||
tab.dataSource = res.data.rows || []
|
||||
}).finally(() => {
|
||||
tab.loading = false
|
||||
})
|
||||
},
|
||||
/** 查询仓库tab的数据 */
|
||||
requestDepotTableData(url, params, tab) {
|
||||
tab.loading = true
|
||||
getAction(url, params).then(res => {
|
||||
tab.dataSource = res.data || []
|
||||
}).finally(() => {
|
||||
tab.loading = false
|
||||
})
|
||||
},
|
||||
close () {
|
||||
this.$emit('close');
|
||||
this.visible = false
|
||||
this.unitStatus = false
|
||||
this.manyUnitStatus = true
|
||||
this.unitChecked = false
|
||||
this.getAllTable().then(editableTables => {
|
||||
editableTables[0].initialize()
|
||||
editableTables[1].initialize()
|
||||
})
|
||||
},
|
||||
handleOk () {
|
||||
this.validateFields()
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
/** 触发表单验证 */
|
||||
validateFields() {
|
||||
this.getAllTable().then(tables => {
|
||||
/** 一次性验证主表和所有的次表 */
|
||||
return validateFormAndTables(this.form, tables)
|
||||
}).then(allValues => {
|
||||
let formData = this.classifyIntoFormData(allValues)
|
||||
formData.sortList = [];
|
||||
if(this.unitChecked){
|
||||
formData.unit = ''
|
||||
} else {
|
||||
formData.unitId = ''
|
||||
}
|
||||
// 发起请求
|
||||
return this.requestAddOrEdit(formData)
|
||||
}).catch(e => {
|
||||
if (e.error === VALIDATE_NO_PASSED) {
|
||||
// 如果有未通过表单验证的子表，就自动跳转到它所在的tab
|
||||
this.activeKey = e.index == null ? this.activeKey : (e.index + 1).toString()
|
||||
} else {
|
||||
console.error(e)
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 整理成formData */
|
||||
classifyIntoFormData(allValues) {
|
||||
let materialMain = Object.assign(this.model, allValues.formValue)
|
||||
return {
|
||||
...materialMain, // 展开
|
||||
meList: allValues.tablesValue[0].values,
|
||||
stock: allValues.tablesValue[1].values,
|
||||
}
|
||||
},
|
||||
/** 发起新增或修改的请求 */
|
||||
requestAddOrEdit(formData) {
|
||||
let url = this.url.add, method = 'post'
|
||||
if (this.model.id) {
|
||||
url = this.url.edit
|
||||
method = 'put'
|
||||
}
|
||||
const that = this;
|
||||
this.confirmLoading = true
|
||||
httpAction(url, formData, method).then((res) => {
|
||||
if(res.code === 200){
|
||||
that.$emit('ok');
|
||||
}else{
|
||||
that.$message.warning(res.data.message);
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false
|
||||
that.close();
|
||||
})
|
||||
},
|
||||
validateMaterialName(rule, value, callback){
|
||||
let params = {
|
||||
name: value,
|
||||
id: this.model.id?this.model.id:0
|
||||
};
|
||||
checkMaterial(params).then((res)=>{
|
||||
if(res && res.code===200) {
|
||||
if(!res.data.status){
|
||||
callback();
|
||||
} else {
|
||||
callback("名称已经存在");
|
||||
}
|
||||
} else {
|
||||
callback(res.data);
|
||||
}
|
||||
});
|
||||
},
|
||||
loadTreeData(){
|
||||
let that = this;
|
||||
let params = {};
|
||||
params.id='';
|
||||
queryMaterialCategoryTreeList(params).then((res)=>{
|
||||
if(res){
|
||||
that.categoryTree = [];
|
||||
for (let i = 0; i < res.length; i++) {
|
||||
let temp = res[i];
|
||||
that.categoryTree.push(temp);
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
loadUnitListData(){
|
||||
let that = this;
|
||||
let params = {};
|
||||
params.currentPage = 1;
|
||||
params.pageSize = 100;
|
||||
getAction('/unit/list', params).then((res) => {
|
||||
if(res){
|
||||
that.unitList = res.data.rows;
|
||||
}
|
||||
})
|
||||
},
|
||||
loadParseMaterialProperty() {
|
||||
let mpList = Vue.ls.get('materialPropertyList')
|
||||
for (let i = 0; i < mpList.length; i++) {
|
||||
if (mpList[i].nativeName === "制造商") {
|
||||
this.mpShort.mfrs.name = mpList[i].anotherName
|
||||
this.mpShort.mfrs.enabled = mpList[i].enabled
|
||||
}
|
||||
if (mpList[i].nativeName === "自定义1") {
|
||||
this.mpShort.otherField1.name = mpList[i].anotherName
|
||||
this.mpShort.otherField1.enabled = mpList[i].enabled
|
||||
}
|
||||
if (mpList[i].nativeName === "自定义2") {
|
||||
this.mpShort.otherField2.name = mpList[i].anotherName
|
||||
this.mpShort.otherField2.enabled = mpList[i].enabled
|
||||
}
|
||||
if (mpList[i].nativeName === "自定义3") {
|
||||
this.mpShort.otherField3.name = mpList[i].anotherName
|
||||
this.mpShort.otherField3.enabled = mpList[i].enabled
|
||||
}
|
||||
}
|
||||
},
|
||||
unitOnChange (e) {
|
||||
let isChecked = e.target.checked;
|
||||
if(isChecked) {
|
||||
this.unitStatus = true;
|
||||
this.manyUnitStatus = false;
|
||||
this.unitChecked = true;
|
||||
} else {
|
||||
this.unitStatus = false;
|
||||
this.manyUnitStatus = true;
|
||||
this.unitChecked = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
117
jshERP-web/src/views/material/modules/MaterialPropertyModal.vue
Normal file
117
jshERP-web/src/views/material/modules/MaterialPropertyModal.vue
Normal file
@@ -0,0 +1,117 @@
|
||||
<template>
|
||||
<a-modal
|
||||
:title="title"
|
||||
:width="800"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:20%;height: 70%;overflow-y: hidden">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="名称">
|
||||
<a-input placeholder="请输入名称" v-decorator.trim="[ 'nativeName' ]" :readOnly="model.id"/>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="是否启用">
|
||||
<a-switch checked-children="启用" un-checked-children="禁用" v-model="enabledSwitch" @change="onChange"></a-switch>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="排序">
|
||||
<a-input placeholder="请输入排序" v-decorator.trim="[ 'sort', validatorRules.sort]" />
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="别名">
|
||||
<a-input placeholder="请输入别名" v-decorator.trim="[ 'anotherName' ]" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import {editMaterialProperty } from '@/api/api'
|
||||
export default {
|
||||
name: "MaterialPropertyModal",
|
||||
data () {
|
||||
return {
|
||||
title:"操作",
|
||||
visible: false,
|
||||
model: {},
|
||||
enabledSwitch: true, //是否启用
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules:{
|
||||
name:{
|
||||
rules: [
|
||||
{ required: true, message: '请输入名称!' },
|
||||
{ min: 2, max: 30, message: '长度在 2 到 30 个字符', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
},
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
onChange(checked) {
|
||||
this.model.enabled = checked
|
||||
},
|
||||
add () {
|
||||
this.edit({});
|
||||
},
|
||||
edit (record) {
|
||||
this.form.resetFields();
|
||||
this.model = Object.assign({}, record);
|
||||
this.visible = true;
|
||||
if(record.enabled!=null){
|
||||
this.enabledSwitch = record.enabled?true:false;
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'nativeName', 'enabled', 'sort', 'anotherName'))
|
||||
});
|
||||
},
|
||||
close () {
|
||||
this.$emit('close');
|
||||
this.visible = false;
|
||||
},
|
||||
handleOk () {
|
||||
const that = this;
|
||||
// 触发表单验证
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
that.confirmLoading = true;
|
||||
let formData = Object.assign(this.model, values);
|
||||
let obj;
|
||||
if(this.model.id){
|
||||
obj=editMaterialProperty(formData);
|
||||
}
|
||||
obj.then((res)=>{
|
||||
if(res.code === 200){
|
||||
that.$emit('ok');
|
||||
}else{
|
||||
that.$message.warning(res.data.message);
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false;
|
||||
that.close();
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
238
jshERP-web/src/views/modules/message/SysMessageList.vue
Normal file
238
jshERP-web/src/views/modules/message/SysMessageList.vue
Normal file
@@ -0,0 +1,238 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="消息标题">
|
||||
<a-input placeholder="请输入消息标题" v-model="queryParam.esTitle"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="发送内容">
|
||||
<a-input placeholder="请输入发送内容" v-model="queryParam.esContent"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<template v-if="toggleSearchStatus">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="接收人">
|
||||
<a-input placeholder="请输入接收人" v-model="queryParam.esReceiver"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</template>
|
||||
<a-col :md="6" :sm="8">
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
||||
<a @click="handleToggleSearch" style="margin-left: 8px">
|
||||
{{ toggleSearchStatus ? '收起' : '展开' }}
|
||||
<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
|
||||
</a>
|
||||
</span>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<a-button @click="handleAdd" v-show="show" type="primary" icon="plus">新增</a-button>
|
||||
<a-button type="primary" v-show="show" icon="download" @click="handleExportXls('消息')">导出</a-button>
|
||||
<a-upload v-show="show" name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl"
|
||||
@change="handleImportExcel">
|
||||
<a-button type="primary" icon="import">导入</a-button>
|
||||
</a-upload>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel">
|
||||
<a-icon type="delete"/>
|
||||
删除
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px"> 批量操作
|
||||
<a-icon type="down"/>
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
||||
<i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{
|
||||
selectedRowKeys.length }}</a>项
|
||||
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
||||
</div>
|
||||
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
|
||||
<!-- 字符串超长截取省略号显示-->
|
||||
<span slot="esContent" slot-scope="text">
|
||||
<j-ellipsis :value="text" :length="10" />
|
||||
</span>
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a href="javascript:;" @click="handleDetail(record)">详情</a>
|
||||
<a-divider type="vertical"/>
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">更多<a-icon type="down"/></a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item v-show="show">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
|
||||
<!-- 表单区域 -->
|
||||
<sysMessage-modal ref="modalForm" @ok="modalFormOk"></sysMessage-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SysMessageModal from './modules/SysMessageModal'
|
||||
import {JeecgListMixin} from '@/mixins/JeecgListMixin'
|
||||
import JEllipsis from "@/components/jeecg/JEllipsis";
|
||||
|
||||
export default {
|
||||
name: "SysMessageList",
|
||||
mixins: [JeecgListMixin],
|
||||
components: {
|
||||
JEllipsis,
|
||||
SysMessageModal
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
description: '消息管理页面',
|
||||
// 新增修改按钮是否显示
|
||||
show: false,
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key: 'rowIndex',
|
||||
width: 60,
|
||||
align: "center",
|
||||
customRender: function (t, r, index) {
|
||||
return parseInt(index) + 1;
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '消息标题',
|
||||
align: "center",
|
||||
dataIndex: 'esTitle'
|
||||
},
|
||||
{
|
||||
title: '发送内容',
|
||||
align: "center",
|
||||
dataIndex: 'esContent',
|
||||
scopedSlots: {customRender: 'esContent'},
|
||||
},
|
||||
{
|
||||
title: '接收人',
|
||||
align: "center",
|
||||
dataIndex: 'esReceiver'
|
||||
},
|
||||
{
|
||||
title: '发送次数',
|
||||
align: "center",
|
||||
dataIndex: 'esSendNum'
|
||||
},
|
||||
{
|
||||
title: '发送状态',
|
||||
align: 'center',
|
||||
dataIndex: 'esSendStatus_dictText'
|
||||
},
|
||||
{
|
||||
title: '发送时间',
|
||||
align: "center",
|
||||
dataIndex: 'esSendTime'
|
||||
},
|
||||
{
|
||||
title: '发送方式',
|
||||
align: 'center',
|
||||
dataIndex: 'esType_dictText'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align: "center",
|
||||
scopedSlots: {customRender: 'action'},
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/message/sysMessage/list",
|
||||
delete: "/message/sysMessage/delete",
|
||||
deleteBatch: "/message/sysMessage/deleteBatch",
|
||||
exportXlsUrl: "message/sysMessage/exportXls",
|
||||
importExcelUrl: "message/sysMessage/importExcel",
|
||||
},
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
importExcelUrl: function () {
|
||||
return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
|
||||
}
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
/** Button按钮间距 */
|
||||
.ant-btn {
|
||||
margin-left: 3px
|
||||
}
|
||||
|
||||
.ant-card-body .table-operator {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.ant-table-tbody .ant-table-row td {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.anty-row-operator button {
|
||||
margin: 0 5px
|
||||
}
|
||||
|
||||
.ant-btn-danger {
|
||||
background-color: #ffffff
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-body {
|
||||
height: calc(100% - 110px) !important;
|
||||
overflow-y: auto
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-content {
|
||||
height: 90% !important;
|
||||
overflow-y: hidden
|
||||
}
|
||||
</style>
|
||||
253
jshERP-web/src/views/modules/message/SysMessageTemplateList.vue
Normal file
253
jshERP-web/src/views/modules/message/SysMessageTemplateList.vue
Normal file
@@ -0,0 +1,253 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="模板CODE">
|
||||
<a-input placeholder="请输入模板CODE" v-model="queryParam.templateCode"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="模板内容">
|
||||
<a-input placeholder="请输入模板内容" v-model="queryParam.templateContent"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<template v-if="toggleSearchStatus">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="模板标题">
|
||||
<a-input placeholder="请输入模板标题" v-model="queryParam.templateName"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item label="模板类型">
|
||||
<a-input placeholder="请输入模板类型" v-model="queryParam.templateType"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</template>
|
||||
<a-col :md="6" :sm="8">
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
||||
<a @click="handleToggleSearch" style="margin-left: 8px">
|
||||
{{ toggleSearchStatus ? '收起' : '展开' }}
|
||||
<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
|
||||
</a>
|
||||
</span>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-button type="primary" icon="download" @click="handleExportXls('消息模板')">导出</a-button>
|
||||
<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl"
|
||||
@change="handleImportExcel">
|
||||
<a-button type="primary" icon="import">导入</a-button>
|
||||
</a-upload>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel">
|
||||
<a-icon type="delete"/>
|
||||
删除
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px"> 批量操作
|
||||
<a-icon type="down"/>
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
||||
<i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{
|
||||
selectedRowKeys.length }}</a>项
|
||||
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
||||
</div>
|
||||
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
|
||||
<!-- 字符串超长截取省略号显示-->
|
||||
<span slot="templateContent" slot-scope="text">
|
||||
<j-ellipsis :value="text" :length="25" />
|
||||
</span>
|
||||
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
|
||||
<a-divider type="vertical"/>
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item>
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a @click="handleTest(record)">发送测试</a>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
|
||||
<!-- 表单区域 -->
|
||||
<sysMessageTemplate-modal ref="modalForm" @ok="modalFormOk"></sysMessageTemplate-modal>
|
||||
|
||||
<sysMessageTest-modal ref="testModal"></sysMessageTest-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SysMessageTemplateModal from './modules/SysMessageTemplateModal'
|
||||
import SysMessageTestModal from './modules/SysMessageTestModal'
|
||||
import {JeecgListMixin} from '@/mixins/JeecgListMixin'
|
||||
import JEllipsis from "@/components/jeecg/JEllipsis";
|
||||
|
||||
export default {
|
||||
name: "SysMessageTemplateList",
|
||||
mixins: [JeecgListMixin],
|
||||
components: {
|
||||
JEllipsis,
|
||||
SysMessageTemplateModal,
|
||||
SysMessageTestModal
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
description: '消息模板管理页面',
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key: 'rowIndex',
|
||||
width: 60,
|
||||
align: "center",
|
||||
customRender: function (t, r, index) {
|
||||
return parseInt(index) + 1;
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '模板CODE',
|
||||
align: "center",
|
||||
dataIndex: 'templateCode'
|
||||
},
|
||||
{
|
||||
title: '模板标题',
|
||||
align: "center",
|
||||
dataIndex: 'templateName'
|
||||
},
|
||||
{
|
||||
title: '模板内容',
|
||||
align: "center",
|
||||
dataIndex: 'templateContent',
|
||||
scopedSlots: {customRender: 'templateContent'},
|
||||
},
|
||||
{
|
||||
title: '模板类型',
|
||||
align: "center",
|
||||
dataIndex: 'templateType',
|
||||
customRender: function (text) {
|
||||
if(text=='1') {
|
||||
return "短信";
|
||||
}
|
||||
if(text=='2') {
|
||||
return "邮件";
|
||||
}
|
||||
if(text=='3') {
|
||||
return "微信";
|
||||
}
|
||||
if(text=='4') {
|
||||
return "系统";
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align: "center",
|
||||
scopedSlots: {customRender: 'action'},
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/message/sysMessageTemplate/list",
|
||||
delete: "/message/sysMessageTemplate/delete",
|
||||
deleteBatch: "/message/sysMessageTemplate/deleteBatch",
|
||||
exportXlsUrl: "message/sysMessageTemplate/exportXls",
|
||||
importExcelUrl: "message/sysMessageTemplate/importExcel",
|
||||
},
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
importExcelUrl: function () {
|
||||
return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleTest(record){
|
||||
this.$refs.testModal.open(record);
|
||||
this.$refs.testModal.title = "发送测试";
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
/** Button按钮间距 */
|
||||
.ant-btn {
|
||||
margin-left: 3px
|
||||
}
|
||||
|
||||
.ant-card-body .table-operator {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.ant-table-tbody .ant-table-row td {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.anty-row-operator button {
|
||||
margin: 0 5px
|
||||
}
|
||||
|
||||
.ant-btn-danger {
|
||||
background-color: #ffffff
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-body {
|
||||
height: calc(100% - 110px) !important;
|
||||
overflow-y: auto
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-content {
|
||||
height: 90% !important;
|
||||
overflow-y: hidden
|
||||
}
|
||||
</style>
|
||||
185
jshERP-web/src/views/modules/message/modules/SysMessageModal.vue
Normal file
185
jshERP-web/src/views/modules/message/modules/SysMessageModal.vue
Normal file
@@ -0,0 +1,185 @@
|
||||
<template>
|
||||
<a-drawer
|
||||
:title="title"
|
||||
:maskClosable="true"
|
||||
width=650
|
||||
placement="right"
|
||||
:closable="true"
|
||||
@close="close"
|
||||
:visible="visible"
|
||||
style="height: calc(100% - 55px);overflow: auto;padding-bottom: 53px;">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="消息标题">
|
||||
<a-input placeholder="请输入消息标题" v-decorator="['esTitle', {}]"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="发送内容">
|
||||
<a-input placeholder="请输入发送内容" v-decorator="['esContent', {}]"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="发送所需参数">
|
||||
<a-input placeholder="请输入发送所需参数Json格式" v-decorator="['esParam', {}]"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="接收人">
|
||||
<a-input placeholder="请输入接收人" v-decorator="['esReceiver', {}]"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="发送方式">
|
||||
<j-dict-select-tag :triggerChange="true" dictCode="msgType" v-decorator="[ 'esType', {}]" placeholder="请选择发送方式">
|
||||
</j-dict-select-tag>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="发送时间">
|
||||
<a-date-picker showTime format='YYYY-MM-DD HH:mm:ss' v-decorator="[ 'esSendTime', {}]"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="发送状态">
|
||||
<j-dict-select-tag :triggerChange="true" dictCode="msgSendStatus" v-decorator="[ 'esSendStatus', {}]" placeholder="请选择发送状态">
|
||||
</j-dict-select-tag>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="发送次数">
|
||||
<a-input-number v-decorator="[ 'esSendNum', {}]"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="发送失败原因">
|
||||
<a-input v-decorator="['esResult', {}]"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="备注">
|
||||
<a-input v-decorator="['remark', {}]"/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
<div v-show="!disableSubmit">
|
||||
<a-button style="margin-right: .8rem" @confirm="handleCancel">取消</a-button>
|
||||
<a-button @click="handleOk" type="primary" :loading="confirmLoading">提交</a-button>
|
||||
</div>
|
||||
</a-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {httpAction} from '@/api/manage'
|
||||
import pick from 'lodash.pick'
|
||||
import moment from "moment"
|
||||
|
||||
export default {
|
||||
name: "SysMessageModal",
|
||||
data() {
|
||||
return {
|
||||
title: "操作",
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 5},
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 16},
|
||||
},
|
||||
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules: {},
|
||||
disableSubmit: true,
|
||||
url: {
|
||||
add: "/message/sysMessage/add",
|
||||
edit: "/message/sysMessage/edit",
|
||||
},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
add() {
|
||||
this.edit({});
|
||||
},
|
||||
edit(record) {
|
||||
this.form.resetFields();
|
||||
this.model = Object.assign({}, record);
|
||||
this.visible = true;
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model, 'esContent', 'esParam', 'esReceiver', 'esResult', 'esSendNum', 'esSendStatus', 'esTitle', 'esType', 'remark'))
|
||||
//时间格式化
|
||||
this.form.setFieldsValue({esSendTime: this.model.esSendTime ? moment(this.model.esSendTime) : null})
|
||||
});
|
||||
|
||||
},
|
||||
close() {
|
||||
this.$emit('close');
|
||||
this.visible = false;
|
||||
},
|
||||
handleOk() {
|
||||
const that = this;
|
||||
// 触发表单验证
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
that.confirmLoading = true;
|
||||
let httpurl = '';
|
||||
let method = '';
|
||||
if (!this.model.id) {
|
||||
httpurl += this.url.add;
|
||||
method = 'post';
|
||||
} else {
|
||||
httpurl += this.url.edit;
|
||||
method = 'put';
|
||||
}
|
||||
let formData = Object.assign(this.model, values);
|
||||
//时间格式化
|
||||
formData.esSendTime = formData.esSendTime ? formData.esSendTime.format('YYYY-MM-DD HH:mm:ss') : null;
|
||||
|
||||
console.log(formData)
|
||||
httpAction(httpurl, formData, method).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message);
|
||||
that.$emit('ok');
|
||||
} else {
|
||||
that.$message.warning(res.message);
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false;
|
||||
that.close();
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel() {
|
||||
this.close()
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,223 @@
|
||||
<template>
|
||||
<a-modal
|
||||
:title="title"
|
||||
:width="800"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
<a-row :gutter="{ xs: 8, sm: 16, md: 24, lg: 32 }">
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="模板CODE"
|
||||
style="margin-right: -35px"
|
||||
>
|
||||
<a-input
|
||||
:disabled="disable"
|
||||
placeholder="请输入模板编码"
|
||||
v-decorator="['templateCode', validatorRules.templateCode ]"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="模板类型">
|
||||
<j-dict-select-tag @change="handleChangeTemplateType" :triggerChange="true" dictCode="msgType" v-decorator="['templateType', validatorRules.templateType ]" placeholder="请选择模板类型">
|
||||
</j-dict-select-tag>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24" >
|
||||
<a-col :span="24" pull="2">
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="模板标题"
|
||||
style="margin-left: -15px">
|
||||
<a-input
|
||||
placeholder="请输入模板标题"
|
||||
v-decorator="['templateName', validatorRules.templateName]"
|
||||
style="width: 122%"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :span="24" pull="4">
|
||||
<a-form-item
|
||||
v-show="!useEditor"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="模板内容"
|
||||
style="margin-left: 4px;width: 126%">
|
||||
<a-textarea placeholder="请输入模板内容" v-decorator="['templateContent', validatorRules.templateContent ]" :autosize="{ minRows: 8, maxRows: 8 }"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :span="24" pull="4">
|
||||
<a-form-item
|
||||
v-show="useEditor"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="模板内容"
|
||||
style="margin-left: 4px;width: 126%">
|
||||
<j-editor v-model="templateEditorContent"></j-editor>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {httpAction} from '@/api/manage'
|
||||
import pick from 'lodash.pick'
|
||||
import { duplicateCheck } from '@/api/api'
|
||||
import JEditor from '@/components/jeecg/JEditor'
|
||||
|
||||
export default {
|
||||
name: "SysMessageTemplateModal",
|
||||
components:{
|
||||
JEditor
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: "操作",
|
||||
visible: false,
|
||||
disable: true,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 5},
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 16},
|
||||
},
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules: {
|
||||
templateCode: {rules: [{required: true, message: '请输入模板CODE!' },{validator: this.validateTemplateCode}]},
|
||||
templateName: {rules: [{required: true, message: '请输入模板标题!'}]},
|
||||
templateContent: {rules: []},
|
||||
templateType: {rules: [{required: true, message: '请输入模板类型!'}]},
|
||||
},
|
||||
url: {
|
||||
add: "/message/sysMessageTemplate/add",
|
||||
edit: "/message/sysMessageTemplate/edit",
|
||||
},
|
||||
useEditor:false,
|
||||
templateEditorContent:""
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
add() {
|
||||
this.disable = false;
|
||||
this.edit({});
|
||||
},
|
||||
edit(record) {
|
||||
this.form.resetFields();
|
||||
this.model = Object.assign({}, record);
|
||||
this.useEditor = (record.templateType==2 || record.templateType==4)
|
||||
if(this.useEditor){
|
||||
this.templateEditorContent=record.templateContent
|
||||
}else{
|
||||
this.templateEditorContent=''
|
||||
}
|
||||
this.visible = true;
|
||||
this.$nextTick(() => {
|
||||
if(this.useEditor){
|
||||
this.form.setFieldsValue(pick(this.model, 'templateCode', 'templateName', 'templateTestJson', 'templateType'))
|
||||
}else{
|
||||
this.form.setFieldsValue(pick(this.model, 'templateCode', 'templateContent', 'templateName', 'templateTestJson', 'templateType'))
|
||||
}
|
||||
});
|
||||
},
|
||||
close() {
|
||||
this.$emit('close');
|
||||
this.visible = false;
|
||||
this.disable = true;
|
||||
},
|
||||
handleOk() {
|
||||
this.model.templateType = this.templateType;
|
||||
const that = this;
|
||||
// 触发表单验证
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
that.confirmLoading = true;
|
||||
let httpurl = '';
|
||||
let method = '';
|
||||
if (!this.model.id) {
|
||||
httpurl += this.url.add;
|
||||
method = 'post';
|
||||
} else {
|
||||
httpurl += this.url.edit;
|
||||
method = 'put';
|
||||
}
|
||||
let formData = Object.assign(this.model, values);
|
||||
//时间格式化
|
||||
|
||||
if(this.useEditor){
|
||||
formData.templateContent=this.templateEditorContent
|
||||
}
|
||||
console.log(formData)
|
||||
httpAction(httpurl, formData, method).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message);
|
||||
that.$emit('ok');
|
||||
} else {
|
||||
that.$message.warning(res.message);
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false;
|
||||
that.close();
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
validateTemplateCode(rule, value, callback){
|
||||
var params = {
|
||||
tableName: "sys_sms_template",
|
||||
fieldName: "template_code",
|
||||
fieldVal: value,
|
||||
dataId: this.model.id
|
||||
}
|
||||
duplicateCheck(params).then((res)=>{
|
||||
if(res.success){
|
||||
callback();
|
||||
}else{
|
||||
callback(res.message);
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
handleCancel() {
|
||||
this.close()
|
||||
},
|
||||
handleChangeTemplateType(value){
|
||||
//如果是邮件类型那么则改变模板内容是富文本编辑器
|
||||
this.useEditor = (value==2 || value==4)
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,122 @@
|
||||
<template>
|
||||
<a-modal
|
||||
:title="title"
|
||||
:width="800"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="模板标题">
|
||||
<a-input disabled v-model="templateName"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="模板内容">
|
||||
<a-textarea disabled v-model="templateContent" :autosize="{ minRows: 5, maxRows: 8 }"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="测试数据">
|
||||
<a-textarea placeholder="请输入json格式测试数据" v-model="testData" :autosize="{ minRows: 5, maxRows: 8 }"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="消息类型">
|
||||
<j-dict-select-tag
|
||||
v-model="msgType"
|
||||
placeholder="请选择消息类型"
|
||||
dictCode="msgType"/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="消息接收方">
|
||||
<a-input placeholder="请输入消息接收方" v-model="receiver"/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {httpAction} from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: "SysMessageTestModal",
|
||||
data() {
|
||||
return {
|
||||
title: "操作",
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 5},
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 16},
|
||||
},
|
||||
|
||||
confirmLoading: false,
|
||||
url: {
|
||||
send: "/message/sysMessageTemplate/sendMsg",
|
||||
},
|
||||
templateName: "",
|
||||
templateContent: "",
|
||||
receiver: "",
|
||||
msgType: "",
|
||||
testData: "",
|
||||
sendParams: {}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(record) {
|
||||
this.sendParams.templateCode = record.templateCode;
|
||||
this.templateName = record.templateName;
|
||||
this.templateContent = record.templateContent;
|
||||
this.testData = record.templateTestJson;
|
||||
this.visible = true;
|
||||
},
|
||||
close() {
|
||||
this.receiver = "";
|
||||
this.msgType = "";
|
||||
this.sendParams = {};
|
||||
this.visible = false;
|
||||
},
|
||||
handleOk() {
|
||||
let httpurl = this.url.send;
|
||||
let method = 'post';
|
||||
this.sendParams.testData = this.testData;
|
||||
this.sendParams.receiver = this.receiver;
|
||||
this.sendParams.msgType = this.msgType;
|
||||
httpAction(httpurl, this.sendParams, method).then((res) => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message);
|
||||
} else {
|
||||
this.$message.warning(res.message);
|
||||
}
|
||||
}).finally(() => {
|
||||
this.confirmLoading = false;
|
||||
this.close();
|
||||
})
|
||||
},
|
||||
handleCancel() {
|
||||
this.close()
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
49
jshERP-web/src/views/modules/monitor/DiskMonitoring.vue
Normal file
49
jshERP-web/src/views/modules/monitor/DiskMonitoring.vue
Normal file
@@ -0,0 +1,49 @@
|
||||
<template>
|
||||
<a-card title="磁盘监控">
|
||||
<a-row>
|
||||
<template v-if="diskInfo && diskInfo.length>0">
|
||||
<a-col :span="8" v-for="(item,index) in diskInfo" :key=" 'diskInfo'+index ">
|
||||
<dash-chart-demo :title="item.name" :datasource="item.restPPT"></dash-chart-demo>
|
||||
</a-col>
|
||||
</template>
|
||||
</a-row>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getAction } from '@/api/manage'
|
||||
import DashChartDemo from '@/components/chart/DashChartDemo'
|
||||
import ARow from 'ant-design-vue/es/grid/Row'
|
||||
|
||||
export default {
|
||||
name: 'DiskMonitoring',
|
||||
components:{
|
||||
ARow,
|
||||
DashChartDemo,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
description: '磁盘监控',
|
||||
//数据集
|
||||
diskInfo:[],
|
||||
url:{
|
||||
queryDiskInfo:'actuator/redis/queryDiskInfo',
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
getAction(this.url.queryDiskInfo).then((res)=>{
|
||||
if(res.success){
|
||||
for(var i=0;i<res.result.length;i++){
|
||||
res.result[i].restPPT = res.result[i].restPPT/10;
|
||||
}
|
||||
this.diskInfo = res.result;
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
148
jshERP-web/src/views/modules/monitor/HttpTrace.vue
Normal file
148
jshERP-web/src/views/modules/monitor/HttpTrace.vue
Normal file
@@ -0,0 +1,148 @@
|
||||
<template>
|
||||
<a-skeleton active :loading="loading" :paragraph="{rows: 17}">
|
||||
<a-card :bordered="false" class="card-area">
|
||||
|
||||
<a-alert type="info" :showIcon="true">
|
||||
<div slot="message">
|
||||
共追踪到 {{ dataSource.length }} 条近期HTTP请求记录
|
||||
<a-divider type="vertical"/>
|
||||
<a @click="handleClickUpdate">立即刷新</a>
|
||||
</div>
|
||||
</a-alert>
|
||||
|
||||
<!-- 表格区域 -->
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="pagination"
|
||||
:loading="tableLoading"
|
||||
:scroll="{ x: 900 }"
|
||||
style="margin-top: 20px;"
|
||||
@change="handleTableChange">
|
||||
|
||||
<template slot="timeTaken" slot-scope="text">
|
||||
<a-tag v-if="text < 500" color="green">{{ text }} ms</a-tag>
|
||||
<a-tag v-else-if="text < 1000" color="cyan">{{ text }} ms</a-tag>
|
||||
<a-tag v-else-if="text < 1500" color="orange">{{ text }} ms</a-tag>
|
||||
<a-tag v-else color="red">{{ text }} ms</a-tag>
|
||||
</template>
|
||||
|
||||
<template slot="responseStatus" slot-scope="text">
|
||||
<a-tag v-if="text < 200" color="pink">{{ text }} </a-tag>
|
||||
<a-tag v-else-if="text < 201" color="green">{{ text }} </a-tag>
|
||||
<a-tag v-else-if="text < 399" color="cyan">{{ text }} </a-tag>
|
||||
<a-tag v-else-if="text < 403" color="orange">{{ text }} </a-tag>
|
||||
<a-tag v-else-if="text < 501" color="red">{{ text }} </a-tag>
|
||||
<span v-else>{{ text }}</span>
|
||||
</template>
|
||||
|
||||
<template slot="requestMethod" slot-scope="text">
|
||||
<a-tag v-if="text === 'GET'" color="#87d068">{{ text }}</a-tag>
|
||||
<a-tag v-else-if="text === 'POST'" color="#2db7f5">{{ text }}</a-tag>
|
||||
<a-tag v-else-if="text === 'PUT'" color="#ffba5a">{{ text }}</a-tag>
|
||||
<a-tag v-else-if="text === 'DELETE'" color="#f50">{{ text }}</a-tag>
|
||||
<span v-else>{{ text }} ms</span>
|
||||
</template>
|
||||
|
||||
</a-table>
|
||||
|
||||
</a-card>
|
||||
</a-skeleton>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
import { getAction } from '@/api/manage'
|
||||
|
||||
moment.locale('zh-cn')
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
advanced: false,
|
||||
dataSource: [],
|
||||
pagination: {
|
||||
defaultPageSize: 10,
|
||||
defaultCurrent: 1,
|
||||
pageSizeOptions: ['10', '20', '30', '40', '100'],
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
showTotal: (total, range) => `显示 ${range[0]} ~ ${range[1]} 条记录，共 ${total} 条记录`
|
||||
},
|
||||
loading: true,
|
||||
tableLoading: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
columns() {
|
||||
return [{
|
||||
title: '请求时间',
|
||||
dataIndex: 'timestamp',
|
||||
customRender(text) {
|
||||
return moment(text).format('YYYY-MM-DD HH:mm:ss')
|
||||
}
|
||||
}, {
|
||||
title: '请求方法',
|
||||
dataIndex: 'request.method',
|
||||
scopedSlots: { customRender: 'requestMethod' },
|
||||
filters: [
|
||||
{ text: 'GET', value: 'GET' },
|
||||
{ text: 'POST', value: 'POST' },
|
||||
{ text: 'PUT', value: 'PUT' },
|
||||
{ text: 'DELETE', value: 'DELETE' }
|
||||
],
|
||||
filterMultiple: true,
|
||||
onFilter: (value, record) => record.request.method.includes(value)
|
||||
}, {
|
||||
title: '请求URL',
|
||||
dataIndex: 'request.uri',
|
||||
customRender(text) {
|
||||
return text.split('?')[0]
|
||||
}
|
||||
}, {
|
||||
title: '响应状态',
|
||||
dataIndex: 'response.status',
|
||||
scopedSlots: { customRender: 'responseStatus' }
|
||||
}, {
|
||||
title: '请求耗时',
|
||||
dataIndex: 'timeTaken',
|
||||
scopedSlots: { customRender: 'timeTaken' }
|
||||
}]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.fetch()
|
||||
},
|
||||
methods: {
|
||||
|
||||
handleClickUpdate() {
|
||||
this.fetch()
|
||||
},
|
||||
|
||||
handleTableChange() {
|
||||
this.fetch()
|
||||
},
|
||||
|
||||
fetch() {
|
||||
this.tableLoading = true
|
||||
getAction('actuator/httptrace').then((data) => {
|
||||
let filterData = []
|
||||
for (let d of data.traces) {
|
||||
if (d.request.method !== 'OPTIONS' && d.request.uri.indexOf('httptrace') === -1) {
|
||||
filterData.push(d)
|
||||
}
|
||||
}
|
||||
this.dataSource = filterData
|
||||
}).catch((e) => {
|
||||
console.error(e)
|
||||
this.$message.error('获取HTTP信息失败')
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
this.tableLoading = false
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style></style>
|
||||
169
jshERP-web/src/views/modules/monitor/JvmInfo.vue
Normal file
169
jshERP-web/src/views/modules/monitor/JvmInfo.vue
Normal file
@@ -0,0 +1,169 @@
|
||||
<template>
|
||||
<a-skeleton active :loading="loading" :paragraph="{rows: 17}">
|
||||
<a-card :bordered="false">
|
||||
|
||||
<a-alert type="info" :showIcon="true">
|
||||
<div slot="message">
|
||||
上次更新时间：{{ this.time }}
|
||||
<a-divider type="vertical"/>
|
||||
<a @click="handleClickUpdate">立即更新</a>
|
||||
</div>
|
||||
</a-alert>
|
||||
|
||||
<a-table
|
||||
rowKey="id"
|
||||
size="middle"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="false"
|
||||
:loading="tableLoading"
|
||||
style="margin-top: 20px;">
|
||||
|
||||
<template slot="param" slot-scope="text, record">
|
||||
<a-tag :color="textInfo[record.param].color">{{ text }}</a-tag>
|
||||
</template>
|
||||
|
||||
<template slot="text" slot-scope="text, record">
|
||||
{{ textInfo[record.param].text }}
|
||||
</template>
|
||||
|
||||
<template slot="value" slot-scope="text, record">
|
||||
{{ text }} {{ textInfo[record.param].unit }}
|
||||
</template>
|
||||
|
||||
</a-table>
|
||||
</a-card>
|
||||
</a-skeleton>
|
||||
</template>
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
import { getAction } from '@/api/manage'
|
||||
|
||||
moment.locale('zh-cn')
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
time: '',
|
||||
loading: true,
|
||||
tableLoading: true,
|
||||
columns: [{
|
||||
title: '参数',
|
||||
width: '30%',
|
||||
dataIndex: 'param',
|
||||
scopedSlots: { customRender: 'param' }
|
||||
}, {
|
||||
title: '描述',
|
||||
width: '40%',
|
||||
dataIndex: 'text',
|
||||
scopedSlots: { customRender: 'text' }
|
||||
}, {
|
||||
title: '当前值',
|
||||
width: '30%',
|
||||
dataIndex: 'value',
|
||||
scopedSlots: { customRender: 'value' }
|
||||
}],
|
||||
dataSource: [],
|
||||
// 列表通过 textInfo 渲染出颜色、描述和单位
|
||||
textInfo: {
|
||||
'jvm.memory.max': { color: 'purple', text: 'JVM 最大内存', unit: 'MB' },
|
||||
'jvm.memory.committed': { color: 'purple', text: 'JVM 可用内存', unit: 'MB' },
|
||||
'jvm.memory.used': { color: 'purple', text: 'JVM 已用内存', unit: 'MB' },
|
||||
'jvm.buffer.memory.used': { color: 'cyan', text: 'JVM 缓冲区已用内存', unit: 'MB' },
|
||||
'jvm.buffer.count': { color: 'cyan', text: '当前缓冲区数量', unit: '个' },
|
||||
'jvm.threads.daemon': { color: 'green', text: 'JVM 守护线程数量', unit: '个' },
|
||||
'jvm.threads.live': { color: 'green', text: 'JVM 当前活跃线程数量', unit: '个' },
|
||||
'jvm.threads.peak': { color: 'green', text: 'JVM 峰值线程数量', unit: '个' },
|
||||
'jvm.classes.loaded': { color: 'orange', text: 'JVM 已加载 Class 数量', unit: '个' },
|
||||
'jvm.classes.unloaded': { color: 'orange', text: 'JVM 未加载 Class 数量', unit: '个' },
|
||||
'jvm.gc.memory.allocated': { color: 'pink', text: 'GC 时, 年轻代分配的内存空间', unit: 'MB' },
|
||||
'jvm.gc.memory.promoted': { color: 'pink', text: 'GC 时, 老年代分配的内存空间', unit: 'MB' },
|
||||
'jvm.gc.max.data.size': { color: 'pink', text: 'GC 时, 老年代的最大内存空间', unit: 'MB' },
|
||||
'jvm.gc.live.data.size': { color: 'pink', text: 'FullGC 时, 老年代的内存空间', unit: 'MB' },
|
||||
'jvm.gc.pause.count': { color: 'blue', text: '系统启动以来GC 次数', unit: '次' },
|
||||
'jvm.gc.pause.totalTime': { color: 'blue', text: '系统启动以来GC 总耗时', unit: '秒' }
|
||||
},
|
||||
// 当一条记录中需要取出多条数据的时候需要配置该字段
|
||||
moreInfo: {
|
||||
'jvm.gc.pause': ['.count', '.totalTime']
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loadTomcatInfo()
|
||||
},
|
||||
methods: {
|
||||
|
||||
handleClickUpdate() {
|
||||
this.loadTomcatInfo()
|
||||
},
|
||||
|
||||
loadTomcatInfo() {
|
||||
this.tableLoading = true
|
||||
this.time = moment().format('YYYY年MM月DD日 HH时mm分ss秒')
|
||||
Promise.all([
|
||||
getAction('actuator/metrics/jvm.memory.max'),
|
||||
getAction('actuator/metrics/jvm.memory.committed'),
|
||||
getAction('actuator/metrics/jvm.memory.used'),
|
||||
getAction('actuator/metrics/jvm.buffer.memory.used'),
|
||||
getAction('actuator/metrics/jvm.buffer.count'),
|
||||
getAction('actuator/metrics/jvm.threads.daemon'),
|
||||
getAction('actuator/metrics/jvm.threads.live'),
|
||||
getAction('actuator/metrics/jvm.threads.peak'),
|
||||
getAction('actuator/metrics/jvm.classes.loaded'),
|
||||
getAction('actuator/metrics/jvm.classes.unloaded'),
|
||||
getAction('actuator/metrics/jvm.gc.memory.allocated'),
|
||||
getAction('actuator/metrics/jvm.gc.memory.promoted'),
|
||||
getAction('actuator/metrics/jvm.gc.max.data.size'),
|
||||
getAction('actuator/metrics/jvm.gc.live.data.size'),
|
||||
getAction('actuator/metrics/jvm.gc.pause')
|
||||
]).then((res) => {
|
||||
|
||||
let info = []
|
||||
res.forEach((value, id) => {
|
||||
let more = this.moreInfo[value.name]
|
||||
if (!(more instanceof Array)) {
|
||||
more = ['']
|
||||
}
|
||||
more.forEach((item, idx) => {
|
||||
let param = value.name + item
|
||||
let val = value.measurements[idx].value
|
||||
|
||||
if (param === 'jvm.memory.max'
|
||||
|| param === 'jvm.memory.committed'
|
||||
|| param === 'jvm.memory.used'
|
||||
|| param === 'jvm.buffer.memory.used'
|
||||
|| param === 'jvm.gc.memory.allocated'
|
||||
|| param === 'jvm.gc.memory.promoted'
|
||||
|| param === 'jvm.gc.max.data.size'
|
||||
|| param === 'jvm.gc.live.data.size'
|
||||
) {
|
||||
val = this.convert(val, Number)
|
||||
}
|
||||
info.push({ id: param + id, param, text: 'false value', value: val })
|
||||
})
|
||||
})
|
||||
this.dataSource = info
|
||||
|
||||
|
||||
}).catch((e) => {
|
||||
console.error(e)
|
||||
this.$message.error('获取JVM信息失败')
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
this.tableLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
convert(value, type) {
|
||||
if (type === Number) {
|
||||
return Number(value / 1048576).toFixed(3)
|
||||
} else if (type === Date) {
|
||||
return moment(value * 1000).format('YYYY-MM-DD HH:mm:ss')
|
||||
}
|
||||
return value
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style></style>
|
||||
189
jshERP-web/src/views/modules/monitor/RedisInfo.vue
Normal file
189
jshERP-web/src/views/modules/monitor/RedisInfo.vue
Normal file
@@ -0,0 +1,189 @@
|
||||
<template>
|
||||
<a-skeleton active :loading="loading" :paragraph="{rows: 17}">
|
||||
<a-card>
|
||||
<!-- Radis 信息实时监控 -->
|
||||
<a-row :gutter="8">
|
||||
<a-col :sm="24" :xl="12">
|
||||
<area-chart-ty v-bind="memory"/>
|
||||
</a-col>
|
||||
<a-col :sm="24" :xl="12">
|
||||
<area-chart-ty v-bind="key"/>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<h3>Redis 详细信息</h3>
|
||||
<a-table
|
||||
:loading="tableLoading"
|
||||
:columns="columns"
|
||||
:dataSource="redisInfo"
|
||||
:pagination="false"/>
|
||||
|
||||
</a-card>
|
||||
</a-skeleton>
|
||||
</template>
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
import { getAction } from '@/api/manage'
|
||||
import AreaChartTy from '@/components/chart/AreaChartTy'
|
||||
|
||||
export default {
|
||||
name: 'RedisInfo',
|
||||
components: {
|
||||
AreaChartTy
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: true,
|
||||
tableLoading: true,
|
||||
// 定时器ID
|
||||
timer: null,
|
||||
// 定时器周期
|
||||
millisec: 3000,
|
||||
// Key 实时数量
|
||||
key: {
|
||||
title: 'Radis Key 实时数量（个）',
|
||||
dataSource: [],
|
||||
y: '数量（个）',
|
||||
height: 340,
|
||||
min: 0,
|
||||
max: 100,
|
||||
color: '#FF6987',
|
||||
lineSize: 8,
|
||||
lineColor: '#DC143C'
|
||||
},
|
||||
// 内存实时占用情况
|
||||
memory: {
|
||||
title: 'Radis 内存实时占用情况（KB）',
|
||||
dataSource: [],
|
||||
y: '内存（KB）',
|
||||
min: 0,
|
||||
max: 3000,
|
||||
height: 340,
|
||||
lineSize: 8
|
||||
},
|
||||
redisInfo: [],
|
||||
columns: [{
|
||||
title: 'Key',
|
||||
align: 'center',
|
||||
dataIndex: 'key'
|
||||
}, {
|
||||
title: 'Description',
|
||||
align: 'left',
|
||||
dataIndex: 'description'
|
||||
}, {
|
||||
title: 'Value',
|
||||
align: 'center',
|
||||
dataIndex: 'value'
|
||||
}],
|
||||
url: {
|
||||
keysSize: '/actuator/redis/keysSize',
|
||||
memoryInfo: '/actuator/redis/memoryInfo',
|
||||
info: '/actuator/redis/info'
|
||||
},
|
||||
path: '/monitor/redis/info'
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.openTimer()
|
||||
this.loadRedisInfo()
|
||||
setTimeout(() => {
|
||||
this.loadData()
|
||||
}, 1000)
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.closeTimer()
|
||||
},
|
||||
methods: {
|
||||
|
||||
/** 开启定时器 */
|
||||
openTimer() {
|
||||
this.loadData()
|
||||
this.closeTimer()
|
||||
this.timer = setInterval(() => {
|
||||
if (this.$route.path === this.path) {
|
||||
this.loadData()
|
||||
}
|
||||
}, this.millisec)
|
||||
},
|
||||
|
||||
/** 关闭定时器 */
|
||||
closeTimer() {
|
||||
if (this.timer) clearInterval(this.timer)
|
||||
},
|
||||
|
||||
/** 查询数据 */
|
||||
loadData() {
|
||||
Promise.all([
|
||||
getAction(this.url.keysSize),
|
||||
getAction(this.url.memoryInfo)
|
||||
]).then((res) => {
|
||||
let time = moment().format('hh:mm:ss')
|
||||
|
||||
let [{ dbSize: currentSize }, memoryInfo] = res
|
||||
let currentMemory = memoryInfo.used_memory / 1000
|
||||
|
||||
// push 数据
|
||||
this.key.dataSource.push({ x: time, y: currentSize })
|
||||
this.memory.dataSource.push({ x: time, y: currentMemory })
|
||||
// 最大长度为6
|
||||
if (this.key.dataSource.length > 6) {
|
||||
this.key.dataSource.splice(0, 1)
|
||||
this.memory.dataSource.splice(0, 1)
|
||||
}
|
||||
|
||||
// 计算 Key 最大最小值
|
||||
let keyPole = this.getMaxAndMin(this.key.dataSource, 'y')
|
||||
this.key.max = Math.floor(keyPole[0]) + 10
|
||||
this.key.min = Math.floor(keyPole[1]) - 10
|
||||
if (this.key.min < 0) this.key.min = 0
|
||||
|
||||
// 计算 Memory 最大最小值
|
||||
let memoryPole = this.getMaxAndMin(this.memory.dataSource, 'y')
|
||||
this.memory.max = Math.floor(memoryPole[0]) + 100
|
||||
this.memory.min = Math.floor(memoryPole[1]) - 100
|
||||
if (this.memory.min < 0) this.memory.min = 0
|
||||
|
||||
}).catch((e) => {
|
||||
console.error(e)
|
||||
this.closeTimer()
|
||||
this.$message.error('获取 Redis 信息失败')
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
// 获取一组数据中最大和最小的值
|
||||
getMaxAndMin(dataSource, field) {
|
||||
let maxValue = null, minValue = null
|
||||
dataSource.forEach(item => {
|
||||
let value = Number.parseInt(item[field])
|
||||
// max
|
||||
if (maxValue == null) {
|
||||
maxValue = value
|
||||
} else if (value > maxValue) {
|
||||
maxValue = value
|
||||
}
|
||||
// min
|
||||
if (minValue == null) {
|
||||
minValue = value
|
||||
} else if (value < minValue) {
|
||||
minValue = value
|
||||
}
|
||||
})
|
||||
return [maxValue, minValue]
|
||||
},
|
||||
|
||||
loadRedisInfo() {
|
||||
this.tableLoading = true
|
||||
getAction(this.url.info).then((res) => {
|
||||
this.redisInfo = res.result
|
||||
}).finally(() => {
|
||||
this.tableLoading = false
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style></style>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user