Kaynağa Gözat

upload

release
HolyKnightIX 6 ay önce
ebeveyn
işleme
04d4e75dc1
9 değiştirilmiş dosya ile 173 ekleme ve 74 silme
  1. +2
    -0
      .env.development
  2. +2
    -0
      .env.production
  3. +0
    -1
      example/data/options.js
  4. +12
    -11
      example/main.js
  5. +7
    -8
      example/page/designer.vue
  6. +119
    -48
      example/page/index.vue
  7. +5
    -3
      package.json
  8. +1
    -1
      src/index.js
  9. +25
    -2
      yarn.lock

+ 2
- 0
.env.development Dosyayı Görüntüle

@@ -0,0 +1,2 @@
# .env.development
VUE_APP_BASE_API=https://admintest.malls.iformall.com/api

+ 2
- 0
.env.production Dosyayı Görüntüle

@@ -0,0 +1,2 @@
# .env.test
VUE_APP_BASE_API=https://api.test.com

+ 0
- 1
example/data/options.js Dosyayı Görüntüle

@@ -163,7 +163,6 @@ export const OutStockOptions = [
snCode: ' [SPP1Y79G1]',
price: '12.00'
}

],
tabelHtml: '',
columnsAttr: [


+ 12
- 11
example/main.js Dosyayı Görüntüle

@@ -5,21 +5,22 @@ import VueRouter from 'vue-router'
import Designer from './page/designer.vue'
import Index from './page/index.vue'
import { outStockTemp } from './data/defaultTemp'
import axios from 'axios';
import 'element-ui/lib/theme-chalk/index.css';

// 默认设置一条模板示例
let tempList
try {
tempList = JSON.parse(localStorage.getItem('tempList')) || []
} catch (error) {
tempList = []
}

if (tempList.length == 0) {
localStorage.setItem('tempList', outStockTemp)
}

// let tempList
// try {
// tempList = JSON.parse(localStorage.getItem('tempList')) || []
// } catch (error) {
// tempList = []
// }

// if (tempList.length == 0) {
// localStorage.setItem('tempList', outStockTemp)
// }

Vue.prototype.$axios = axios;
Vue.use(VueRouter)
Vue.use(vuePrintDesigner)
const routes = [


+ 7
- 8
example/page/designer.vue Dosyayı Görüntüle

@@ -7,6 +7,7 @@ export default {
data() {
return {
index: '',
printData: [],
value: {
title: 'demo',
width: 750,
@@ -21,24 +22,22 @@ export default {

created() {
this.index = this.$route.query.index
this.printData = this.$route.query.printData
try {
let tempList = JSON.parse(localStorage.getItem('tempList')) || []
this.value = tempList[this.index]
this.widgets = this.value.type == 1 ? OutStockOptions : InStockOptions
this.value = this.printData
this.widgets = OutStockOptions
} catch (err) {
console.error(err)
}
},
methods: {
handleSave(data) {
let tempList = JSON.parse(localStorage.getItem('tempList')) || []
tempList[this.index] = data
localStorage.setItem('tempList', JSON.stringify(tempList))
console.log(data, 'data')
this.$router.back()
},
// 手动初始话模板数据
initTemp(){
this.$refs.printDesigner.initTemp(this.value,this.widgets)
initTemp() {
this.$refs.printDesigner.initTemp(this.value, this.widgets)
}
},
}


+ 119
- 48
example/page/index.vue Dosyayı Görüntüle

@@ -1,16 +1,31 @@
<template>
<div class="box">
<div class="title">打印模板设计器</div>
<div class="title">ID:{{ currentID }}</div>
<div class="title">ID:{{ tenantId }}</div>
<section>
<div class="section">模板管理</div>
<el-form :inline="true" :model="searchForm" size="small" label-width="80px" label-position="right">
<el-form-item label="模板名称" prop="name">
<el-input v-model="searchForm.name"></el-input>
</el-form-item>

<el-form-item label="模板类型" prop="type">
<el-select v-model="searchForm.type">
<el-option v-for="(item, index) in typeArr" :key="index" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>

<el-form-item>
<el-button size="mini" type="primary" @click="getList">查询模板</el-button>
</el-form-item>
</el-form>
<el-table :data="tempList" style="width: 100%" size="mini" border>
<el-table-column label="模板名称" prop="title"></el-table-column>
<el-table-column label="模板类型">
<!-- <el-table-column label="模板类型">
<template slot-scope="scope">
<span>{{ scope.row.type == 1 ? '出库单' : '入库单' }}</span>
</template>
</el-table-column>
</el-table-column> -->
<el-table-column label="模板宽高">
<template slot-scope="scope">
<span>{{ scope.row.width + ' * ' + scope.row.height }}</span>
@@ -29,8 +44,7 @@
<el-button type="text" size="mini" @click="handleEdit(scope.$index, scope.row)">设计</el-button>
<el-button type="text" size="mini" @click="handlePreview(scope.$index, scope.row)">预览</el-button>
<el-button type="text" size="mini" @click="handleCopy(scope.row)">复制新增</el-button>
<el-button v-if="!scope.row.default" type="text" size="mini"
@click="handleDelete(scope.$index, scope.row)">删除</el-button>
<el-button type="text" size="mini" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
@@ -39,12 +53,12 @@
<el-form-item label="模板名称" prop="title">
<el-input v-model="form.title"></el-input>
</el-form-item>
<el-form-item label="模板类型" prop="type">
<!-- <el-form-item label="模板类型" prop="type">
<el-select v-model="form.type">
<el-option label="出库单" :value="1"></el-option>
<el-option label="入库单" :value="2"></el-option>
</el-select>
</el-form-item>
</el-form-item> -->
<el-form-item label="模板宽度" prop="width">
<el-input v-model="form.width"></el-input>
</el-form-item>
@@ -64,7 +78,7 @@
</div>
</el-dialog>
</section>
<section>
<!-- <section v-if="false">
<div class="section">模板打印测试</div>
<el-form ref="printForm" :model="printForm" size="small" :rules="printRules" :inline="true">
<el-form-item label="打印模板" prop="tempIndex">
@@ -86,7 +100,7 @@
</el-form-item>
</el-form>
</section>
<section>
<section v-if="false">
<el-collapse>
<el-collapse-item title="测试数据" name="1">
<el-form ref="testData" :model="testData" size="small" :inline="true">
@@ -101,34 +115,39 @@
</el-form>
</el-collapse-item>
</el-collapse>
</section>
</section> -->
</div>
</template>
<script>
import { Table, TableColumn, Dialog, MessageBox } from 'element-ui'
import { Table, TableColumn, Dialog, MessageBox, Message } from 'element-ui'
import Vue from 'vue'
Vue.prototype.$confirm = (...args) => MessageBox.confirm(...args)
const defaultTemp = () => ({
title: '',
type: 1, // 模板类型 1:出库单;2:入库单
width: '',
height: '',
pageWidth: '',
pageHeight: '',
tempItems: [],
})
Vue.prototype.$message = Message
const baseUrl = process.env.VUE_APP_BASE_API;
import { OutStockData, InStockData } from '../data/test'
export default {
data() {
return {
visible: false,
currentID: "",
tenantId: "",
value: {},
tempList: [],
form: defaultTemp(),
typeArr: [],
searchForm: {
name: '',
type: 2,
},
form: {
title: '',
width: '',
height: '',
pageWidth: '',
pageHeight: '',
tempItems: [],
},
rules: {
title: { required: true, message: '请输入模板名称' },
type: { required: true, message: '请选择模板类型' },
// type: { required: true, message: '请选择模板类型' },
width: { required: true, message: '请输入模板宽度' },
height: { required: true, message: '请输入模板高度' },
pageWidth: { required: true, message: '请输入纸张宽度' },
@@ -148,14 +167,6 @@ export default {
},
}
},
created() {
Vue.use(Table)
Vue.use(TableColumn)
Vue.use(Dialog)
this.tempList = JSON.parse(localStorage.getItem('tempList')) || []
const id = this.$route.query.id
if (id) this.currentID = id
},

methods: {
// 预览
@@ -168,39 +179,43 @@ export default {
path: '/designer',
query: {
index: index,
printData: row
},
})
},

// 删除
handleDelete(index, row) {
this.$confirm('确认删除该条数据吗?', '确认信息')
.then((isPass) => {
if (isPass) {
this.tempList.splice(index, 1)
localStorage.setItem('tempList', JSON.stringify(this.tempList))
}
})
.catch()
console.log(this.$message)
if (row.default) {
this.$message.error('默认模板无法删除!')
} else {
this.$confirm('删除该模板?, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {

}).catch(() => {

});
}
},

//复制新增
handleCopy(row) {
let copyTemp = JSON.parse(JSON.stringify(row))
copyTemp.title = copyTemp.title + '_copy'
copyTemp.default = false
this.tempList.push(copyTemp)
localStorage.setItem('tempList', JSON.stringify(this.tempList))
this.tempList.push(row)
},

// 新增
openCreate() {
this.form = defaultTemp()
this.visible = true
},
// 保存新增
savaTemp() {
this.$refs.form.validate((valid) => {
if (valid) {
this.tempList.push(this.form)
localStorage.setItem('tempList', JSON.stringify(this.tempList))
this.addNewModel(this.form)
this.visible = false
}
})
@@ -236,10 +251,62 @@ export default {
}
})
},

addNewModel(data) {

},

getData() {
this.getPrintTypes()
this.getList()
},

getPrintTypes() {
this.$axios.get(baseUrl + "/print/types")
.then(res => {
console.log(res, 'res')
this.typeArr = res.data.data
})
.catch(err => {
console.error(err);
});
},

getList() {
const url = baseUrl +
"/print/printTemplates?isDel=0" +
"&name=" +
this.searchForm.name +
"&type=" +
this.searchForm.type +
"&tenantId=" +
this.tenantId
this.$axios.get(url)
.then(res => {
console.log(res, 'res')
const arr = []
res.data.data.forEach(item => {
arr.push(item.contentJson)
});
this.tempList = arr
})
.catch(err => {
console.error(err);
});
}
},
created() {
Vue.use(Table)
Vue.use(TableColumn)
Vue.use(Dialog)
this.tempList = []
const tenantId = this.$route.query.tenantId
if (tenantId) this.tenantId = tenantId
this.getData()
},
}
</script>
<style scoped>
<style lang="scss" scoped>
.box {
width: 1000px;
margin: auto;
@@ -260,4 +327,8 @@ export default {
color: #333333;
padding: 10px 0;
}

.el-message-box {
background-color: #1890ff;
}
</style>

+ 5
- 3
package.json Dosyayı Görüntüle

@@ -11,10 +11,12 @@
"author": "liuxia",
"scripts": {
"dev": "vue-cli-service serve",
"build": "vue-cli-service build",
"build:test": "vue-cli-service build --mode development",
"build:pro": "vue-cli-service build --mode production",
"lib": "vue-cli-service build --target lib --name kr-print-designer --dest lib src/index.js"
},
"dependencies": {
"axios": "^1.7.3",
"nanoid": "^1.0.1"
},
"devDependencies": {
@@ -22,11 +24,11 @@
"@vue/cli-service": "^4.0.0",
"babel-eslint": "^10.0.3",
"babel-plugin-component": "^1.1.1",
"element-ui": "2.13.0",
"eslint": "^5.16.0",
"eslint-plugin-vue": "^5.0.0",
"sass": "^1.26.5",
"sass-loader": "^8.0.2",
"element-ui": "2.13.0",
"vue": "^2.6.11",
"vue-router": "^3.4.8",
"vue-template-compiler": "^2.6.10"
@@ -36,4 +38,4 @@
"last 2 versions",
"not dead"
]
}
}

+ 1
- 1
src/index.js Dosyayı Görüntüle

@@ -19,7 +19,7 @@ import {
Form,
FormItem,
Tag,
ColorPicker,
ColorPicker
} from 'element-ui';
import './assets/style/index.scss'
// LODOP打印服务


+ 25
- 2
yarn.lock Dosyayı Görüntüle

@@ -2107,6 +2107,15 @@ aws4@^1.8.0:
resolved "https://registry.npmmirror.com/aws4/-/aws4-1.13.0.tgz#d9b802e9bb9c248d7be5f7f5ef178dc3684e9dcc"
integrity sha512-3AungXC4I8kKsS9PuS4JH2nc+0bVY/mjgrephHTIi8fpEeGsTHBUJeosp0Wc1myYMElmD0B3Oc4XL/HVJ4PV2g==

axios@^1.7.3:
version "1.7.3"
resolved "https://registry.npmmirror.com/axios/-/axios-1.7.3.tgz#a1125f2faf702bc8e8f2104ec3a76fab40257d85"
integrity sha512-Ar7ND9pU99eJ9GpoGQKhKf58GpUOgnzuaB7ueNQ5BMi0p+LZ5oaEnfF999fAArcTIBwXTCHAmGcHOZJaWPq9Nw==
dependencies:
follow-redirects "^1.15.6"
form-data "^4.0.0"
proxy-from-env "^1.1.0"

babel-eslint@^10.0.3:
version "10.1.0"
resolved "https://registry.npmmirror.com/babel-eslint/-/babel-eslint-10.1.0.tgz#6968e568a910b78fb3779cdd8b6ac2f479943232"
@@ -2825,7 +2834,7 @@ color@^3.0.0:
color-convert "^1.9.3"
color-string "^1.6.0"

combined-stream@^1.0.6, combined-stream@~1.0.6:
combined-stream@^1.0.6, combined-stream@^1.0.8, combined-stream@~1.0.6:
version "1.0.8"
resolved "https://registry.npmmirror.com/combined-stream/-/combined-stream-1.0.8.tgz#c3d45a8b34fd730631a110a8a2520682b31d5a7f"
integrity sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==
@@ -4274,7 +4283,7 @@ flush-write-stream@^1.0.0:
inherits "^2.0.3"
readable-stream "^2.3.6"

follow-redirects@^1.0.0:
follow-redirects@^1.0.0, follow-redirects@^1.15.6:
version "1.15.6"
resolved "https://registry.npmmirror.com/follow-redirects/-/follow-redirects-1.15.6.tgz#7f815c0cda4249c74ff09e95ef97c23b5fd0399b"
integrity sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==
@@ -4296,6 +4305,15 @@ forever-agent@~0.6.1:
resolved "https://registry.npmmirror.com/forever-agent/-/forever-agent-0.6.1.tgz#fbc71f0c41adeb37f96c577ad1ed42d8fdacca91"
integrity sha512-j0KLYPhm6zeac4lz3oJ3o65qvgQCcPubiyotZrXqEaG4hNagNYO8qdlUrX5vwqv9ohqeT/Z3j6+yW067yWWdUw==

form-data@^4.0.0:
version "4.0.0"
resolved "https://registry.npmmirror.com/form-data/-/form-data-4.0.0.tgz#93919daeaf361ee529584b9b31664dc12c9fa452"
integrity sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==
dependencies:
asynckit "^0.4.0"
combined-stream "^1.0.8"
mime-types "^2.1.12"

form-data@~2.3.2:
version "2.3.3"
resolved "https://registry.npmmirror.com/form-data/-/form-data-2.3.3.tgz#dcce52c05f644f298c6a7ab936bd724ceffbf3a6"
@@ -7000,6 +7018,11 @@ proxy-addr@~2.0.7:
forwarded "0.2.0"
ipaddr.js "1.9.1"

proxy-from-env@^1.1.0:
version "1.1.0"
resolved "https://registry.npmmirror.com/proxy-from-env/-/proxy-from-env-1.1.0.tgz#e102f16ca355424865755d2c9e8ea4f24d58c3e2"
integrity sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==

prr@~1.0.1:
version "1.0.1"
resolved "https://registry.npmmirror.com/prr/-/prr-1.0.1.tgz#d3fc114ba06995a45ec6893f484ceb1d78f5f476"


Yükleniyor…
İptal
Kaydet