yanghao
/
yunshengtai-admin
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

yshop2.1.4,订单新增批量打印，图片修改为批量上传等

master
hupeng 5 years ago
parent
8c32b8a1d2
commit
9021519fe3
3 changed files with 1267 additions and 839 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 579
      src/components/material/index.vue
  2. 1338
      src/views/shop/order/index.vue
  3. 189
      src/views/shop/order/print.vue

579
src/components/material/index.vue
Unescape View File

@ -79,8 +79,9 @@
:on-progress="handleProgress" :on-progress="handleProgress"
:before-upload="beforeUpload" :before-upload="beforeUpload"
:on-success="handleSuccess" :on-success="handleSuccess"
multiple
> >
<el-button size="small" type="primary">点击上传</el-button> <el-button size="small" type="primary">批量上传</el-button>
</el-upload> </el-upload>
</el-col> </el-col>
</el-row> </el-row>
@ -103,7 +104,7 @@
:src="item.url" :src="item.url"
fit="contain" fit="contain"
:preview-src-list="[item.url]" :preview-src-list="[item.url]"
:z-index=999 :z-index="999"
/> />
<div> <div>
<el-checkbox class="material-name" :label="item.url"> <el-checkbox class="material-name" :label="item.url">
@ -144,319 +145,319 @@
</template> </template>
<script> <script>
import { getPage as materialgroupPage, addObj as materialgroupAdd, delObj as materialgroupDel, putObj as materialgroupEdit } from '@/api/tools/materialgroup' import { getPage as materialgroupPage, addObj as materialgroupAdd, delObj as materialgroupDel, putObj as materialgroupEdit } from '@/api/tools/materialgroup'
import { getPage, addObj, delObj, putObj } from '@/api/tools/material' import { getPage, addObj, delObj, putObj } from '@/api/tools/material'
import { getToken } from '@/utils/auth' import { getToken } from '@/utils/auth'
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
export default { export default {
name: 'MaterialList', name: 'MaterialList',
props: { props: {
// 素材数据 // 素材数据
value: { value: {
type: Array, type: Array,
default() { default() {
return [] return []
}
},
// 素材类型
type: {
type: String
},
// 素材限制数量，默认5个
num: {
type: Number,
default() {
return 5
}
},
// 宽度
width: {
type: Number,
default() {
return 150
}
},
// 宽度
height: {
type: Number,
default() {
return 150
}
} }
}, },
// 素材类型 data() {
type: { return {
type: String headers: {
}, Authorization: getToken()
// 素材限制数量，默认5个 },
num: { dialogVisible: false,
type: Number, url: '',
default() { listDialogVisible: false,
return 5 materialgroupList: [],
materialgroupObjId: '',
materialgroupObj: {},
materialgroupLoading: false,
tableData: [],
page: {
total: 0, // 总页数
currentPage: 1, // 当前页数
pageSize: 12, // 每页显示多少条
ascs: [], // 升序字段
descs: 'create_time'// 降序字段
},
tableLoading: false,
groupId: null,
urls: []
} }
}, },
// 宽度 computed: {
width: { ...mapGetters([
type: Number, 'uploadApi'
default() { ])
return 150
}
}, },
// 宽度 methods: {
height: { moveMaterial(index, type) {
type: Number, if (type == 'up') {
default() { const tempOption = this.value[index - 1]
return 150 this.$set(this.value, index - 1, this.value[index])
} this.$set(this.value, index, tempOption)
} }
}, if (type == 'down') {
data() { const tempOption = this.value[index + 1]
return { this.$set(this.value, index + 1, this.value[index])
headers: { this.$set(this.value, index, tempOption)
Authorization: getToken() }
}, },
dialogVisible: false, zoomMaterial(index) {
url: '', this.dialogVisible = true
listDialogVisible: false, this.url = this.value[index]
materialgroupList: [],
materialgroupObjId: '',
materialgroupObj: {},
materialgroupLoading: false,
tableData: [],
page: {
total: 0, // 总页数
currentPage: 1, // 当前页数
pageSize: 12, // 每页显示多少条
ascs: [], // 升序字段
descs: 'create_time'// 降序字段
}, },
tableLoading: false, deleteMaterial(index) {
groupId: null, const that = this
urls: [] this.$confirm('是否确认删除？', '提示', {
} confirmButtonText: '确定',
}, cancelButtonText: '取消',
computed: { type: 'warning'
...mapGetters([ }).then(function() {
'uploadApi' that.value.splice(index, 1)
]) that.urls = []
},
methods: {
moveMaterial(index, type) {
if (type == 'up') {
const tempOption = this.value[index - 1]
this.$set(this.value, index - 1, this.value[index])
this.$set(this.value, index, tempOption)
}
if (type == 'down') {
const tempOption = this.value[index + 1]
this.$set(this.value, index + 1, this.value[index])
this.$set(this.value, index, tempOption)
}
},
zoomMaterial(index) {
this.dialogVisible = true
this.url = this.value[index]
},
deleteMaterial(index) {
const that = this
this.$confirm('是否确认删除？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
that.value.splice(index, 1)
that.urls = []
})
},
toSeleteMaterial() {
this.listDialogVisible = true
if (this.tableData.length <= 0) {
this.materialgroupPage()
}
},
materialgroupPage() {
this.materialgroupLoading = true
materialgroupPage({
total: 0, // 总页数
currentPage: 1, // 当前页数
pageSize: 100, // 每页显示多少条
ascs: [], // 升序字段
descs: 'create_time'// 降序字段
}).then(response => {
this.materialgroupLoading = false
const materialgroupList = response.content
materialgroupList.unshift({
id: '-1',
name: '全部分组'
})
this.materialgroupList = materialgroupList
this.tabClick({
index: 0
}) })
}) },
}, toSeleteMaterial() {
materialgroupDelete(materialgroupObj) { this.listDialogVisible = true
const that = this if (this.tableData.length <= 0) {
this.$confirm('是否确认删除该分组？', '提示', { this.materialgroupPage()
confirmButtonText: '确定', }
cancelButtonText: '取消', },
type: 'warning' materialgroupPage() {
}).then(function() { this.materialgroupLoading = true
materialgroupDel(materialgroupObj.id) materialgroupPage({
.then(function() { total: 0, // 总页数
that.$delete(that.materialgroupList, materialgroupObj.index) currentPage: 1, // 当前页数
pageSize: 100, // 每页显示多少条
ascs: [], // 升序字段
descs: 'create_time'// 降序字段
}).then(response => {
this.materialgroupLoading = false
const materialgroupList = response.content
materialgroupList.unshift({
id: '-1',
name: '全部分组'
}) })
}) this.materialgroupList = materialgroupList
}, this.tabClick({
materialgroupEdit(materialgroupObj) { index: 0
const that = this })
this.$prompt('请输入分组名', '提示', { })
confirmButtonText: '确定', },
cancelButtonText: '取消', materialgroupDelete(materialgroupObj) {
inputValue: materialgroupObj.name const that = this
}).then(({ value }) => { this.$confirm('是否确认删除该分组？', '提示', {
materialgroupEdit({ confirmButtonText: '确定',
id: materialgroupObj.id, cancelButtonText: '取消',
name: value type: 'warning'
}).then(function() { }).then(function() {
materialgroupObj.name = value materialgroupDel(materialgroupObj.id)
that.$set(that.materialgroupList, materialgroupObj.index, materialgroupObj) .then(function() {
that.$delete(that.materialgroupList, materialgroupObj.index)
})
}) })
}).catch(() => { },
materialgroupEdit(materialgroupObj) {
const that = this
this.$prompt('请输入分组名', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValue: materialgroupObj.name
}).then(({ value }) => {
materialgroupEdit({
id: materialgroupObj.id,
name: value
}).then(function() {
materialgroupObj.name = value
that.$set(that.materialgroupList, materialgroupObj.index, materialgroupObj)
})
}).catch(() => {
})
},
materialgroupAdd() {
const that = this
this.$prompt('请输入分组名', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消'
}).then(({ value }) => {
materialgroupAdd({
name: value
}).then(function() {
that.materialgroupPage()
}) })
}).catch(() => { },
materialgroupAdd() {
const that = this
this.$prompt('请输入分组名', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消'
}).then(({ value }) => {
materialgroupAdd({
name: value
}).then(function() {
that.materialgroupPage()
})
}).catch(() => {
})
},
tabClick(tab, event) {
this.urls = []
const index = Number(tab.index)
const materialgroupObj = this.materialgroupList[index]
materialgroupObj.index = index
this.materialgroupObj = materialgroupObj
this.materialgroupObjId = materialgroupObj.id
this.page.currentPage = 1
this.page.total = 0
if (materialgroupObj.id != '-1') {
this.groupId = materialgroupObj.id
} else {
this.groupId = null
}
this.getPage(this.page)
},
getPage(page, params) {
this.tableLoading = true
getPage(Object.assign({
page: page.currentPage - 1,
size: page.pageSize,
descs: this.page.descs,
ascs: this.page.ascs,
sort: 'createTime,desc'
}, {
groupId: this.groupId
})).then(response => {
const tableData = response.content
this.page.total = response.totalElements
this.page.currentPage = page.currentPage
this.page.pageSize = page.pageSize
this.tableData = tableData
this.tableLoading = false
}).catch(() => {
this.tableLoading = false
})
},
sizeChange(val) {
console.log(val)
this.page.currentPage = 1
this.page.pageSize = val
this.getPage(this.page)
},
pageChange(val) {
console.log(val)
this.page.currentPage = val
// this.page.pageSize = val
this.getPage(this.page)
},
materialRename(item) {
const that = this
this.$prompt('请输入素材名', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValue: item.name
}).then(({ value }) => {
putObj({
id: item.id,
name: value
}).then(function() {
that.getPage(that.page)
}) })
}).catch(() => { },
tabClick(tab, event) {
this.urls = []
const index = Number(tab.index)
const materialgroupObj = this.materialgroupList[index]
materialgroupObj.index = index
this.materialgroupObj = materialgroupObj
this.materialgroupObjId = materialgroupObj.id
this.page.currentPage = 1
this.page.total = 0
if (materialgroupObj.id != '-1') {
this.groupId = materialgroupObj.id
} else {
this.groupId = null
}
this.getPage(this.page)
},
getPage(page, params) {
this.tableLoading = true
getPage(Object.assign({
page: page.currentPage - 1,
size: page.pageSize,
descs: this.page.descs,
ascs: this.page.ascs,
sort: 'createTime,desc'
}, {
groupId: this.groupId
})).then(response => {
const tableData = response.content
this.page.total = response.totalElements
this.page.currentPage = page.currentPage
this.page.pageSize = page.pageSize
this.tableData = tableData
this.tableLoading = false
}).catch(() => {
this.tableLoading = false
})
},
sizeChange(val) {
console.log(val)
this.page.currentPage = 1
this.page.pageSize = val
this.getPage(this.page)
},
pageChange(val) {
console.log(val)
this.page.currentPage = val
// this.page.pageSize = val
this.getPage(this.page)
},
materialRename(item) {
const that = this
this.$prompt('请输入素材名', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValue: item.name
}).then(({ value }) => {
putObj({
id: item.id,
name: value
}).then(function() {
that.getPage(that.page)
})
}).catch(() => {
}) })
}, },
materialUrl(item) { materialUrl(item) {
const that = this const that = this
this.$prompt('素材链接', '提示', { this.$prompt('素材链接', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
inputValue: item.url inputValue: item.url
}).then(({ value }) => { }).then(({ value }) => {
}).catch(() => { }).catch(() => {
}) })
}, },
materialDel(item) { materialDel(item) {
const that = this const that = this
this.$confirm('是否确认删除该素材？', '提示', { this.$confirm('是否确认删除该素材？', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
type: 'warning' type: 'warning'
}).then(function() { }).then(function() {
delObj(item.id) delObj(item.id)
.then(function() { .then(function() {
that.getPage(that.page) that.getPage(that.page)
}) })
}) })
}, },
handleCommand(command) { handleCommand(command) {
const that = this const that = this
const s = command.split('-') const s = command.split('-')
putObj({ putObj({
id: s[0], id: s[0],
groupId: s[1] groupId: s[1]
}).then(function() { }).then(function() {
that.getPage(that.page) that.getPage(that.page)
}) })
}, },
handleProgress(event, file, fileList) { handleProgress(event, file, fileList) {
// let uploadProgress = file.percentage.toFixed(0) // let uploadProgress = file.percentage.toFixed(0)
// this.uploadProgress = uploadProgress // this.uploadProgress = uploadProgress
}, },
handleSuccess(response, file, fileList) { handleSuccess(response, file, fileList) {
const that = this const that = this
this.uploadProgress = 0 this.uploadProgress = 0
addObj({ addObj({
type: '1', type: '1',
groupId: this.groupId != '-1' ? this.groupId : null, groupId: this.groupId != '-1' ? this.groupId : null,
name: file.name, name: file.name,
url: response.link url: response.link
}).then(function() { }).then(function() {
that.getPage(that.page) that.getPage(that.page)
}) })
}, },
beforeUpload(file) { beforeUpload(file) {
const isPic = const isPic =
file.type === 'image/jpeg' || file.type === 'image/jpeg' ||
file.type === 'image/png' || file.type === 'image/png' ||
file.type === 'image/gif' || file.type === 'image/gif' ||
file.type === 'image/jpg' file.type === 'image/jpg'
const isLt2M = file.size / 1024 / 1024 < 2 const isLt2M = file.size / 1024 / 1024 < 2
if (!isPic) { if (!isPic) {
this.$message.error('上传图片只能是 JPG、JPEG、PNG、GIF 格式!') this.$message.error('上传图片只能是 JPG、JPEG、PNG、GIF 格式!')
return false return false
} }
if (!isLt2M) { if (!isLt2M) {
this.$message.error('上传头像图片大小不能超过 2MB!') this.$message.error('上传头像图片大小不能超过 2MB!')
}
return isPic && isLt2M
},
sureUrls() {
this.urls.forEach(item => {
this.$set(this.value, this.value.length, item)
})
this.listDialogVisible = false
} }
return isPic && isLt2M
},
sureUrls() {
this.urls.forEach(item => {
this.$set(this.value, this.value.length, item)
})
this.listDialogVisible = false
} }
} }
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

1338
src/views/shop/order/index.vue
View File

File diff suppressed because it is too large Load Diff

189
src/views/shop/order/print.vue
Unescape View File

@ -0,0 +1,189 @@
<template>
<el-dialog id="printDialog" :append-to-body="false" :close-on-click-modal="false" :before-close="cancel" :visible.sync="dialog" title="订单打印" width="220mm">
<el-button
type="warning"
class="filter-item"
size="mini"
icon="el-icon-printer"
onclick="doPrint()"
>打印</el-button>
<div id="printList">
<div class="order-list" v-for="(list, index) in printList">
<el-header class="order-title">订货单</el-header>
<div class="order-info">
<span class="info">{{list.orderId}}</span>
<span class="info">下单日期 : {{formatTimeTwo(list.addTime)}}</span>
<span>客户名称 : {{list.realName}}</span>
</div>
<div class="order-info">
<span class="info">联系人 : {{list.userDTO.account}}</span>
<span class="info">联系电话 : {{list.userPhone}}</span>
<span>收货地址 : {{list.userAddress}}</span>
</div>
<el-table border show-summary :data="list.cartInfoList" :summary-method="getSummaries" size="small" style="width: 100%;">
<el-table-column type="index" label="行号" :index="indexMethod" width="60mm"/>
<el-table-column prop="cartInfoMap.productInfo.productId" width="80mm" label="商品编号" />
<el-table-column prop="cartInfoMap.productInfo.storeName" width="172mm" label="商品名称" />
<el-table-column prop="cartInfoMap.productInfo.unitName" width="80mm" label="商品规格" />
<el-table-column prop="cartInfoMap.productInfo.unitName" width="80mm" label="单位" />
<el-table-column prop="cartInfoMap.productInfo.price" width="80mm" label="单价" />
<el-table-column prop="cartInfoMap.cartNum" width="80mm" label="数量" />
<el-table-column prop="cartInfoMap" width="80mm" label="小计(元)" >
<template slot-scope="scope">
<span>{{ scope.row.cartInfoMap.productInfo.price*scope.row.cartInfoMap.cartNum }}</span>
</template>
</el-table-column>
<el-table-column prop="cartInfoMap.mark" width="80mm" label="备注" />
</el-table>
</div>
</div>
</el-dialog>
</template>
<script>
import { formatTime, parseTime, formatTimeTwo } from '@/utils/index'
export default {
props: {
printList: {
type: Array,
required: true
},
toQuery: {
type: Function,
required: true
}
},
data() {
return {
loading: false, dialog: false
}
},
mounted() {
window.doPrint = this.doPrint;
},
methods: {
formatTime,
parseTime,
formatTimeTwo,
cancel() {
this.dialog = false
},
indexMethod(index){
return index+1;
},
doPrint(){
let printbox = document.querySelector("#printList").innerHTML;
document.querySelector("body").innerHTML = printbox;
window.print();
this.cancel();
// this.toQuery();
window.location.reload();
},
getSummaries(param) {
const { columns, data } = param;
const sums = [];
columns.forEach((column, index) => {
if (index === 0) {
sums[index] = '合计';
return;
}else if(index === 7){
const values = data.map(item => Number(item.cartInfoMap.productInfo.price*item.cartInfoMap.cartNum));
sums[index] = values.reduce((prev, curr) => {
const value = Number(curr);
if (!isNaN(value)) {
return prev + curr;
} else {
return prev;
}
}, 0);
sums[index] += ' 元';
}
});
return sums;
}
}
}
</script>
<style scoped lang="scss">
.container {
height: calc(100% - 80px);
position: absolute;
overflow: auto;
width: calc(100% - 20px);
.order-caculate {
font-size: 14px;
color: #909399;
border-top: 1px solid #f0f0f0;
padding: 20px 10px;
.caculate-title {
display: inline-block;
margin-right: 50px;
}
.caculate-num {
font-size: 20px;
color: #ff4949;
}
}
.el-table th {
background-color: #fafafa;
}
}
.footer-contains {
position: absolute;
display: -ms-flexbox;
display: flex;
background-color: #f6f6f6;
bottom: 0;
flex-align: center;
align-items: center;
justify-content: space-between;
width: 100%;
z-index: 999;
padding: 0 20px 0 13px;
}
/*打印单样式编辑*/
.order-list {
/* height: 297mm;*/
margin: 0 auto;
width: 210mm;
.order-title {
height: 16mm;
line-height: 16mm;
font-size: 8mm;
font-weight: bolder;
text-align: center;
}
.order-info {
span {
display: inline-block;
padding: 0 0 10px 0;
font-size: 3mm;
}
span.info {
width: 60mm;
}
}
.el-table--small th, .el-table--small td {
padding: 4px 0;
}
}
</style>
Write Preview
Loading…
Cancel
Save