feat(front):生成二维码;

master
jiyufei 3 months ago
parent a19b22db69
commit d704d6ee9b

@ -17,11 +17,10 @@
{{ '下一条' }} {{ '下一条' }}
</el-dropdown-item> </el-dropdown-item>
</template> </template>
<el-dropdown-item type="primary" @click.native="dataFormSubmit(2)" <el-dropdown-item type="primary" @click.native="dataFormSubmit(2)" :loading="continueBtnLoading" :disabled='btnLoading'>
:loading="continueBtnLoading" :disabled='btnLoading'> {{ !dataForm.id ? '确定并新增' : '确定并继续' }}</el-dropdown-item>
{{ !dataForm.id ? '确定并新增' : '确定并继续' }}</el-dropdown-item> </el-dropdown-menu>
</el-dropdown-menu> </el-dropdown> -->
</el-dropdown> -->
<el-button type="primary" @click="dataFormSubmit()" :loading="btnLoading" <el-button type="primary" @click="dataFormSubmit()" :loading="btnLoading"
:disabled='continueBtnLoading'> :disabled='continueBtnLoading'>
</el-button> </el-button>
@ -199,6 +198,17 @@
</JnpfInput> </JnpfInput>
</jnpf-form-tip-item> </jnpf-form-tip-item>
</el-col> </el-col>
<el-col :span="8">
<el-form label-width="100px">
<jnpf-form-tip-item label="生成二维码">
<el-button type="primary" @click="getQRimg"> </el-button>
</jnpf-form-tip-item>
<el-form-item label="二维码图像">
<div id="qrcode" ref="qrCode"></div>
</el-form-item>
</el-form>
</el-col>
<!-- 表单结束 --> <!-- 表单结束 -->
</template> </template>
</el-form> </el-form>
@ -219,11 +229,15 @@ import { getDefaultCurrentValueUserId } from '@/api/permission/user'
import { getDefaultCurrentValueDepartmentId } from '@/api/permission/organize' import { getDefaultCurrentValueDepartmentId } from '@/api/permission/organize'
import { getDateDay, getLaterData, getBeforeData, getBeforeTime, getLaterTime } from '@/components/Generator/utils/index.js' import { getDateDay, getLaterData, getBeforeData, getBeforeTime, getLaterTime } from '@/components/Generator/utils/index.js'
import { thousandsFormat } from "@/components/Generator/utils/index" import { thousandsFormat } from "@/components/Generator/utils/index"
import QRCode from 'qrcodejs2'
import JsBarcode from 'jsbarcode'
export default { export default {
components: {}, components: {},
props: [], props: [],
data() { data() {
return { return {
qrcode: '',
barcode: "",
dataFormSubmitType: 0, dataFormSubmitType: 0,
continueBtnLoading: false, continueBtnLoading: false,
index: 0, index: 0,
@ -417,6 +431,46 @@ export default {
}, },
mounted() { }, mounted() { },
methods: { methods: {
getQRimg() {
if (this.dataForm.equipmentCoding == null || this.dataForm.deviceName == null ||
this.dataForm.equipmentType == null || this.dataForm.equipmentBrand == null || this.dataForm.spaceId == null) {
this.$message.error('请完善设备必填信息');
return
}
let qrCodeJsonString = JSON.stringify(this.dataForm);
this.qrcode = qrCodeJsonString;
if (!this.qrcode) {
return
}
this.$refs.qrCode.innerHTML = "";
let qrcode = new QRCode(this.$refs.qrCode, {
width: 265,
height: 265, //
text: this.qrcode, //
// render: 'canvas' // tablecanvascanvas
// background: '#f0f'
// foreground: '#ff0'
correctLevel: QRCode.CorrectLevel.H // 1QRCode.CorrectLevel.L 2QRCode.CorrectLevel.M 3QRCode.CorrectLevel.Q 4QRCode.CorrectLevel.H
})
},
getBarcode() {
let reg = /^[A-Za-z0-9]+$/
if (!reg.test(this.barcode)) {
this.$message({
message: '请输入数字或者英文字母',
type: 'error',
duration: 1500,
})
return
}
JsBarcode("#barcode", this.barcode, {
// format: "pharmacode",
// lineColor: "#0aa",
width: 4,
height: 80,
displayValue: false
});
},
spaceChange(var1, var2) { spaceChange(var1, var2) {
this.dataForm.spaceName = var2.name; this.dataForm.spaceName = var2.name;
this.dataForm.regionId = var2.pid; this.dataForm.regionId = var2.pid;

Loading…
Cancel
Save