chenrui
3 years ago
5 changed files with 818 additions and 2 deletions
@ -0,0 +1,64 @@ |
|||||
|
<template> |
||||
|
<div class="header_body"> |
||||
|
<header-nav |
||||
|
:slefBack="true" |
||||
|
@goBack="goBack" |
||||
|
> |
||||
|
</header-nav> |
||||
|
</div> |
||||
|
<div class="m-pdf"> |
||||
|
<div id="pdf-content"></div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<script > |
||||
|
import Pdfh5 from "pdfh5"; |
||||
|
import "pdfh5/css/pdfh5.css"; |
||||
|
export default { |
||||
|
name: "Pdfh5", |
||||
|
data() { |
||||
|
return { |
||||
|
pdfh5: null, |
||||
|
// 可引入网络文件或者本地文件 |
||||
|
pdfUrl: "http://192.168.110.36:85/profile/upload/2024/03/29/40eb1a97ca27c3369370e90632d92db0.pdf", // 如果引入本地pdf文件，需要将pdf放在public文件夹下，引用时使用绝对路径（/：表示public文件夹） |
||||
|
}; |
||||
|
}, |
||||
|
mounted() { |
||||
|
console.log("pdf地址",this.$route.query.url) |
||||
|
this.pdfUrl = this.$route.query.url; |
||||
|
this.initPdf(); |
||||
|
}, |
||||
|
methods: { |
||||
|
initPdf() { |
||||
|
// pdfh5实例化时传两个参数：selector选择器，options配置项参数，会返回一个pdfh5实例对象，可以用来操作pdf，监听相关事件 |
||||
|
// pdfh5 = new Pdfh5(selector, options) goto初始到第几页，logo设置每一页pdf上的水印 |
||||
|
this.pdfh5 = new Pdfh5("#pdf-content", { |
||||
|
pdfurl: this.pdfUrl, |
||||
|
goto: 1, |
||||
|
// 设置每一页pdf上的水印 |
||||
|
|
||||
|
}); |
||||
|
this.pdfh5.scrollEnable(true); // 允许pdf滚动 |
||||
|
// 监听pdf准备开始渲染，此时可以拿到pdf总页数 |
||||
|
this.pdfh5.on("ready", function () { |
||||
|
console.log("总页数:" + this.totalNum); |
||||
|
}); |
||||
|
// 监听pdf加载完成事件，加载失败、渲染成功都会触发 |
||||
|
this.pdfh5.on("complete", (status, msg, time) => { |
||||
|
console.log("状态:" + status + "，信息:" + msg + "，耗时:" + time + "毫秒"); |
||||
|
}); |
||||
|
}, |
||||
|
}, |
||||
|
// 返回 |
||||
|
goBack(){ |
||||
|
console.log(11111) |
||||
|
this.$router.go(-1) |
||||
|
} |
||||
|
}; |
||||
|
</script> |
||||
|
<style scoped> |
||||
|
.m-pdf{ |
||||
|
height: 100%; |
||||
|
} |
||||
|
</style> |
||||
|
|
||||
|
|
||||
@ -0,0 +1,138 @@ |
|||||
|
<style scoped> |
||||
|
.scan-area { |
||||
|
width: 100%; |
||||
|
height: 680px; |
||||
|
} |
||||
|
</style> |
||||
|
|
||||
|
<template> |
||||
|
<div class="scan-area"> |
||||
|
<qrcode-stream @click="handleClick" :paused="scanPause" :track="paintOutLineAndCenterText" @error="handleError" @camera-on="onCameraOn"> |
||||
|
<div v-if="!cameraReady"> |
||||
|
loading... |
||||
|
</div> |
||||
|
</qrcode-stream> |
||||
|
<!-- <audio ref="audioRef" src="/src/assets/Di.mp3"></audio> --> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script setup lang="ts"> |
||||
|
import Vconsole from "vconsole"; |
||||
|
import { QrcodeStream } from "vue-qrcode-reader"; |
||||
|
import {ref} from 'vue' |
||||
|
const audioRef = ref(null); |
||||
|
const errorInfo = ref(''); |
||||
|
const cameraReady = ref(false); |
||||
|
const scanPause = ref(false); |
||||
|
const reactAngles = ref<any>([]); |
||||
|
const onCameraOn = function () { |
||||
|
cameraReady.value = true; |
||||
|
new Vconsole(); |
||||
|
} |
||||
|
const handleError = function (err) { |
||||
|
errorInfo.value = `[${err.name}]: ` |
||||
|
if (err.name === 'NotAllowedError') { |
||||
|
errorInfo.value += '您需要授予相机访问权限' |
||||
|
} else if (err.name === 'NotFoundError') { |
||||
|
errorInfo.value = '此设备上没有检测到摄像头'; |
||||
|
} else if (err.name === 'NotReadableError') { |
||||
|
errorInfo.value = '相机被占用' |
||||
|
} else if (err.name === 'NotSupportedError') { |
||||
|
errorInfo.value = 'secure context required (HTTPS, localhost)' |
||||
|
} else if (err.name === 'OverconstrainedError') { |
||||
|
errorInfo.value += '' |
||||
|
} else if (err.name === 'StreamApiNotSupportedError') { |
||||
|
errorInfo.value += 'Stream API is not supported in this browser' |
||||
|
} else if (err.name === 'InsecureContextError') { |
||||
|
errorInfo.value += 'Camera access is only permitted in secure context. Use HTTPS or localhost rather than HTTP.' |
||||
|
} else { |
||||
|
errorInfo.value += err.message |
||||
|
} |
||||
|
console.log(errorInfo.value); |
||||
|
errorInfo.value = ''; |
||||
|
} |
||||
|
const created = () =>{ |
||||
|
new Vconsole(); |
||||
|
} |
||||
|
|
||||
|
const paintOutLineAndCenterText = (detectedCodes, ctx) => { |
||||
|
// 暂停页面 |
||||
|
scanPause.value = true; |
||||
|
// 播放语音 |
||||
|
// audioRef.value.play(); |
||||
|
// 画边框和文本 |
||||
|
reactAngles.value.splice(); |
||||
|
for (const detectedCode of detectedCodes) { |
||||
|
// 画边框 |
||||
|
ctx.lineWidth = 1; |
||||
|
const [firstPoint, ...otherPoints] = detectedCode.cornerPoints |
||||
|
ctx.strokeStyle = 'red' |
||||
|
ctx.beginPath() |
||||
|
ctx.moveTo(firstPoint.x, firstPoint.y) |
||||
|
for (const { x, y } of otherPoints) { |
||||
|
ctx.lineTo(x, y) |
||||
|
} |
||||
|
ctx.lineTo(firstPoint.x, firstPoint.y) |
||||
|
ctx.closePath(); |
||||
|
ctx.stroke(); |
||||
|
// 画文字 |
||||
|
const { boundingBox, rawValue } = detectedCode |
||||
|
const centerX = boundingBox.x + boundingBox.width / 2 |
||||
|
const centerY = boundingBox.y + boundingBox.height / 2 |
||||
|
const fontSize = Math.max(12, (50 * boundingBox.width) / ctx.canvas.width) |
||||
|
console.log(boundingBox.width, ctx.canvas.width) |
||||
|
ctx.lineWidth = 2; |
||||
|
ctx.font = `${fontSize}px sans-serif` |
||||
|
ctx.textAlign = 'center' |
||||
|
ctx.strokeStyle = '#35e5a7' |
||||
|
ctx.strokeText('>', centerX, centerY) |
||||
|
// 配置矩形内容 |
||||
|
if (detectedCode.cornerPoints.length==4) { |
||||
|
reactAngles.value.push({ |
||||
|
leftTop: {x: firstPoint.x, y:firstPoint.y}, |
||||
|
rightTop: {x: otherPoints[0].x, y:otherPoints[0].y}, |
||||
|
rightBottom: {x: otherPoints[1].x, y:otherPoints[1].y}, |
||||
|
leftBottom: {x: otherPoints[2].x, y:otherPoints[2].y}, |
||||
|
text: detectedCode.rawValue |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
// 获取事件的发生位置 |
||||
|
const getEventPosition = (ev) => { |
||||
|
var x, y; |
||||
|
if (ev.layerX || ev.layerX == 0) { |
||||
|
x = ev.layerX; |
||||
|
y = ev.layerY; |
||||
|
} else if (ev.offsetX || ev.offsetX == 0) { // Opera |
||||
|
x = ev.offsetX; |
||||
|
y = ev.offsetY; |
||||
|
} |
||||
|
return {x: x, y: y}; |
||||
|
}; |
||||
|
|
||||
|
const handleClick = function (event) { |
||||
|
// 1. 获取点击点的位置 |
||||
|
var eventPosition = getEventPosition(event); |
||||
|
// 2. 判断在不在已有的矩形内部，在的话获取二维码解析的结果，并进行业务处理 |
||||
|
var resolveText = handleClickRectAngle(eventPosition); |
||||
|
if (resolveText != undefined) { |
||||
|
alert(resolveText); |
||||
|
} |
||||
|
// 3. 业务处理完，如果决定跳转就跳转，不决定跳转的话就关闭暂停 |
||||
|
scanPause.value = false; |
||||
|
} |
||||
|
|
||||
|
// 判断一个点在不在某个矩形内部的算法，后面可以采取凸包算法，优化判断的实现，不过这里已经能实现了，没必要深究 |
||||
|
const handleClickRectAngle = function (eventPosition) { |
||||
|
for (let i = 0; i < reactAngles.value.length; i++) { |
||||
|
let reactAngle = reactAngles.value[i]; |
||||
|
if ( ((eventPosition.x >= Math.min(reactAngle.leftTop.x, reactAngle.leftBottom.x)) && (eventPosition.x <= Math.max(reactAngle.rightTop.x, reactAngle.rightBottom.x))) |
||||
|
&& ((eventPosition.y >= Math.min(reactAngle.leftTop.y, reactAngle.rightTop.y)) && (eventPosition.y <= Math.max(reactAngle.leftBottom.y, reactAngle.rightBottom.y))) |
||||
|
) { |
||||
|
return reactAngle.text; |
||||
|
} |
||||
|
} |
||||
|
return undefined; |
||||
|
} |
||||
|
</script> |
||||
@ -0,0 +1,215 @@ |
|||||
|
<template> |
||||
|
<div class="address_edit"> |
||||
|
<!-- 导航栏 --> |
||||
|
<div class="header_body"> |
||||
|
<header-nav :slefBack="true" @goBack="goBack" :titelText="`详情`"></header-nav> |
||||
|
</div> |
||||
|
<!-- 中间 --> |
||||
|
<div> |
||||
|
<!-- <van-cell-group>--> |
||||
|
<van-form @failed="onFailed" @submit="submit"> |
||||
|
<van-field |
||||
|
v-model="submitData.lawEnforcementCode" |
||||
|
label="登记编号" |
||||
|
readonly |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.enterpriseName" |
||||
|
label="企业名称" |
||||
|
required |
||||
|
readonly |
||||
|
:rules="[{ required: true, message: '必填项' }]" |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.linkMan" |
||||
|
label="企业联系人" |
||||
|
readonly |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.linkTel" |
||||
|
label="联系人电话" |
||||
|
:rules="[{ validator, message: '请输入正确内容' }]" |
||||
|
readonly |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.checkTime" |
||||
|
required |
||||
|
readonly |
||||
|
label="检查时间" |
||||
|
:rules="[{ required: true, message: '必填项' }]" |
||||
|
|
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.checkItem" |
||||
|
required |
||||
|
label="检查事项" |
||||
|
:rules="[{ required: true, message: '必填项' }]" |
||||
|
readonly |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.checkRequire" |
||||
|
required |
||||
|
label="检查要求" |
||||
|
:rules="[{ required: true, message: '必填项' }]" |
||||
|
readonly |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.lawEnforcement" |
||||
|
readonly |
||||
|
label="执法部门" |
||||
|
:rules="[{ required: true, message: '必填项' }]" |
||||
|
|
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.lawEnforcer" |
||||
|
readonly |
||||
|
label="执法人员" |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.lawEnforcerTwo" |
||||
|
readonly |
||||
|
label="执法人员2" |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.remark" |
||||
|
label="备注" |
||||
|
rows="2" |
||||
|
autosize |
||||
|
type="textarea" |
||||
|
maxlength="50" |
||||
|
placeholder="请输入备注" |
||||
|
show-word-limit |
||||
|
readonly |
||||
|
/> |
||||
|
</van-form> |
||||
|
<!-- </van-cell-group>--> |
||||
|
</div> |
||||
|
|
||||
|
<!-- <div class="warp_body">--> |
||||
|
<!-- <van-action-bar>--> |
||||
|
<!-- <van-action-bar-button color="#be99ff" text="保存" @click="submit" />--> |
||||
|
<!-- </van-action-bar>--> |
||||
|
<!-- </div>--> |
||||
|
|
||||
|
<van-popup v-model:show="data.showLawEnforcerFlag" position="bottom" :style="{ height: '30%' }" /> |
||||
|
|
||||
|
<van-popup v-model:show="data.showTimePicker" position="bottom" :style="{ height: '30%' }" > |
||||
|
<van-date-picker |
||||
|
type="time" |
||||
|
@confirm="onConfirm" |
||||
|
@cancel="data.showTimePicker = false" |
||||
|
/> |
||||
|
</van-popup> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script setup name="register"> |
||||
|
|
||||
|
import {getEnterpriseLawEnforcement} from '../../api/administrative' |
||||
|
import { reactive, ref } from "vue"; |
||||
|
|
||||
|
const router = useRouter(); |
||||
|
const route = useRoute(); |
||||
|
let queryaddressId = ref(""); |
||||
|
const data = reactive({ |
||||
|
showLawEnforcerFlag:false, |
||||
|
showTimePicker:false, |
||||
|
}); |
||||
|
//保存参数 |
||||
|
let submitData = reactive({ |
||||
|
/** 登记编号 */ |
||||
|
lawEnforcementCode:"", |
||||
|
/** 企业名称 */ |
||||
|
enterpriseName:"", |
||||
|
/** 企业ID */ |
||||
|
enterpriseId:"", |
||||
|
/** 企业联系人 */ |
||||
|
linkMan:"", |
||||
|
/** 联系人电话 */ |
||||
|
linkTel:"", |
||||
|
/** 检查时间 */ |
||||
|
checkTime:"", |
||||
|
/** 检查事项 */ |
||||
|
checkItem:"", |
||||
|
/** 检查要求 */ |
||||
|
checkRequire:"", |
||||
|
/** 执法部门 */ |
||||
|
lawEnforcement:"", |
||||
|
/** 执法部门ID */ |
||||
|
lawEnforcementId:"", |
||||
|
/** 执法人员 */ |
||||
|
lawEnforcer:"", |
||||
|
/** 执法人员ID */ |
||||
|
lawEnforcerId:"", |
||||
|
/** 执法人员2 */ |
||||
|
lawEnforcerTwo:"", |
||||
|
/** 执法人员ID2 */ |
||||
|
lawEnforcerIdTwo:"", |
||||
|
/** 备注 */ |
||||
|
remark:"", |
||||
|
}) |
||||
|
|
||||
|
const onConfirm = (time) => { |
||||
|
if(time != null) { |
||||
|
var times = time.selectedValues; |
||||
|
submitData.checkTime = times[0] +"-"+ times[1] +"-"+ times[2]; |
||||
|
} |
||||
|
data.showTimePicker = false; |
||||
|
}; |
||||
|
|
||||
|
const validator = (val) => /^1[34578]\d{9}$/.test(val); |
||||
|
|
||||
|
const onFailed = (errorInfo) => { |
||||
|
console.log('failed', errorInfo); |
||||
|
}; |
||||
|
|
||||
|
// 返回 |
||||
|
const goBack = () => { |
||||
|
router.go(-1); |
||||
|
}; |
||||
|
|
||||
|
//初始化参数，获取扫码的企业统一信用编码 |
||||
|
onMounted(() =>{ |
||||
|
getEnterpriseLawEnforcement(route?.query?.id,success =>{ |
||||
|
//跳转企业二维码地址 |
||||
|
if(success.success){ |
||||
|
submitData.lawEnforcementCode = success.data.lawEnforcementCode; |
||||
|
submitData.lawEnforcement = success.data.lawEnforcement; |
||||
|
submitData.lawEnforcer = success.data.lawEnforcer; |
||||
|
submitData.lawEnforcerTwo = success.data.lawEnforcerTwo; |
||||
|
submitData.checkItem = success.data.checkItem; |
||||
|
submitData.checkRequire = success.data.checkRequire; |
||||
|
submitData.enterpriseName = success.data.enterpriseName; |
||||
|
submitData.linkMan = success.data.linkMan; |
||||
|
submitData.linkTel = success.data.linkTel; |
||||
|
submitData.checkTime = success.data.checkTime; |
||||
|
submitData.remark = success.data.remark; |
||||
|
} |
||||
|
},error=>{ |
||||
|
console.log("登记失败") |
||||
|
}) |
||||
|
}) |
||||
|
|
||||
|
</script> |
||||
|
<style lang="less" scoped> |
||||
|
.address_edit { |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
height: 100%; |
||||
|
overflow: hidden; |
||||
|
background-color: #f4f4f4; |
||||
|
} |
||||
|
/* vant4的 Toast 和 Popup 样式冲突,会导致 Toast 变成白底 */ |
||||
|
.van-popup.van-toast{ |
||||
|
background: var(--van-toast-background) !important; |
||||
|
box-sizing: content-box !important; |
||||
|
/* 下面3条css,影响不大 */ |
||||
|
transition: all var(--van-duration-fast) !important; |
||||
|
width: var(--van-toast-default-width) !important; |
||||
|
max-width: var(--van-toast-max-width) !important; |
||||
|
} |
||||
|
.van-popup.van-toast .van-toast__icon{ |
||||
|
font-size: var(--van-toast-icon-size) !important; |
||||
|
} |
||||
|
|
||||
|
</style> |
||||
@ -0,0 +1,399 @@ |
|||||
|
<template> |
||||
|
<div class="address_edit"> |
||||
|
<!-- 导航栏 --> |
||||
|
<div class="header_body"> |
||||
|
<header-nav :slefBack="true" @goBack="goBack" :titelText="`执法信息详情`"></header-nav> |
||||
|
</div> |
||||
|
<!-- 中间 --> |
||||
|
<div class="warp_body"> |
||||
|
<van-form @failed="onFailed" @submit="submit"> |
||||
|
<van-cell-group> |
||||
|
<div style="font-size:large" class="zf-name">执法信息</div> |
||||
|
<van-field |
||||
|
v-model="submitData.lawEnforcement" |
||||
|
label="执法部门" |
||||
|
readonly |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.lawEnforcer" |
||||
|
label="执法人员1" |
||||
|
readonly |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.lawEnforcerTwo" |
||||
|
label="执法人员2" |
||||
|
readonly |
||||
|
placeholder="请选择" |
||||
|
right-icon="add-o" |
||||
|
@click="showPopup" |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.subsidiaryer" |
||||
|
label="辅助人员" |
||||
|
readonly |
||||
|
placeholder="请选择" |
||||
|
right-icon="add-o" |
||||
|
@click="showPopup2" |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.lawEnforcementItem" |
||||
|
required |
||||
|
label="执法事项" |
||||
|
:rules="[{ required: true, message: '必填项' }]" |
||||
|
placeholder="必填 执法事项" |
||||
|
readonly |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.lawEnforcementBasis" |
||||
|
required |
||||
|
label="执法依据" |
||||
|
:rules="[{ required: true, message: '必填项' }]" |
||||
|
placeholder="必填 执法依据" |
||||
|
readonly |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.reslut" |
||||
|
required |
||||
|
label="执法结果" |
||||
|
:rules="[{ required: true, message: '必填项' }]" |
||||
|
readonly |
||||
|
> |
||||
|
<template #input> |
||||
|
<div> |
||||
|
<van-tag :color="data.good">合格</van-tag> |
||||
|
<van-tag :color="data.bad" style="margin-left: 15px;">不合格</van-tag> |
||||
|
</div> |
||||
|
</template> |
||||
|
</van-field> |
||||
|
<van-field |
||||
|
v-model="submitData.remark" |
||||
|
label="备注" |
||||
|
rows="2" |
||||
|
autosize |
||||
|
type="textarea" |
||||
|
maxlength="50" |
||||
|
placeholder="请输入备注" |
||||
|
show-word-limit |
||||
|
readonly |
||||
|
/> |
||||
|
|
||||
|
<van-divider class="divdsty" /> |
||||
|
|
||||
|
<div class="file-upload"> |
||||
|
<!-- <div class="file-upload-center"> |
||||
|
<label>上传附件</label> <span>(不多于9张)</span> |
||||
|
</div> --> |
||||
|
<!-- <van-uploader v-model="submitData.fileListObj" accept="" class="file" multiple :max-size="500 * 1024" :after-read="uploadFiles" :before-delete="deleteFile"> |
||||
|
<template #preview-cover="{ file }"> |
||||
|
<div class="preview-cover van-ellipsis">{{ file.name }}</div> |
||||
|
</template> |
||||
|
</van-uploader> --> |
||||
|
<div class="zoom"> |
||||
|
<img |
||||
|
v-for="(item, index) in imgstr && imgstr.split(',')" |
||||
|
class="img" |
||||
|
:src="item" |
||||
|
alt="预览图片" |
||||
|
@click="imagePreview(index)" |
||||
|
/> |
||||
|
</div> |
||||
|
</div> |
||||
|
</van-cell-group> |
||||
|
|
||||
|
<van-divider class="divdsty" /> |
||||
|
|
||||
|
<van-cell-group> |
||||
|
<div style="padding-top:10px; font-size:large" class="qy-name">企业信息</div> |
||||
|
<van-field |
||||
|
v-model="submitData.enterpriseName" |
||||
|
required |
||||
|
label="企业名称" |
||||
|
:rules="[{ required: true, message: '必填项' }]" |
||||
|
placeholder="必填 企业名称" |
||||
|
readonly |
||||
|
/> |
||||
|
<van-field |
||||
|
v-model="submitData.enterpriseNumber" |
||||
|
required |
||||
|
label="统一信用码" |
||||
|
:rules="[{ required: true, message: '必填项' }]" |
||||
|
placeholder="必填 纳税人识别号" |
||||
|
readonly |
||||
|
/> |
||||
|
</van-cell-group> |
||||
|
|
||||
|
<!-- <van-action-bar> |
||||
|
<van-button round block color="#be99ff" type="info" native-type="submit">提交</van-button> |
||||
|
</van-action-bar> --> |
||||
|
</van-form> |
||||
|
</div> |
||||
|
<!-- |
||||
|
<Popup :visible="data.popupVisible" :content="data.popupContent" @close="closePopup" @reciveData="reciveData" /> |
||||
|
<Popup :visible="data.popupVisible2" :content="data.popupContent2" @close="closePopup" @reciveData="reciveData2" /> --> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script setup name="register"> |
||||
|
|
||||
|
import { showSuccessToast,showImagePreview } from 'vant'; |
||||
|
import {queryEnforcementRegistrationById} from '../../api/enforce' |
||||
|
import { reactive, ref } from "vue"; |
||||
|
import {uploadFile} from "../../util/fileUpload"; |
||||
|
//用户筛选弹窗 |
||||
|
// import Popup from './userFilter.vue'; |
||||
|
|
||||
|
const { useMy } = $globalStore |
||||
|
|
||||
|
const router = useRouter(); |
||||
|
//路由参数 |
||||
|
const route = useRoute(); |
||||
|
const data = reactive({ |
||||
|
showLawEnforcerFlag:false, |
||||
|
currentPage: 1, |
||||
|
good:"#7FFFD4", |
||||
|
bad:"#D3D3D3", |
||||
|
popupVisible: false, |
||||
|
popupContent: '', |
||||
|
popupVisible2: false, |
||||
|
popupContent2: '', |
||||
|
}); |
||||
|
// 图片imagelist |
||||
|
const imgstr = "https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg,https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"; |
||||
|
const imgstrArr = imgstr.split(","); |
||||
|
//保存参数 |
||||
|
const submitData = reactive({ |
||||
|
//执法部门 |
||||
|
lawEnforcement:"", |
||||
|
lawEnforcementId:"", |
||||
|
//执法人员1 |
||||
|
lawEnforcer:"", |
||||
|
lawEnforcerId:"", |
||||
|
//执法人员2 |
||||
|
lawEnforcerTwo: "", |
||||
|
lawEnforcerIdTwo: "", |
||||
|
//辅助人员 |
||||
|
subsidiaryer: "", |
||||
|
subsidiaryerId: "", |
||||
|
//执法事项 |
||||
|
lawEnforcementItem:"", |
||||
|
//执法依据 |
||||
|
lawEnforcementBasis:"", |
||||
|
//执法结果 |
||||
|
reslut:0, |
||||
|
//备注 |
||||
|
remark:"", |
||||
|
//企业名称 |
||||
|
enterpriseName:"", |
||||
|
//统一信用码 |
||||
|
enterpriseNumber:"", |
||||
|
//后台保存图片列表 |
||||
|
fileList:[], |
||||
|
//vant组件上传照片列表 |
||||
|
fileListObj:[], |
||||
|
}) |
||||
|
|
||||
|
const tapGood = () => { |
||||
|
data.good = "#7FFFD4"; |
||||
|
data.bad = "#D3D3D3"; |
||||
|
submitData.reslut = 0; |
||||
|
} |
||||
|
const tapBad = () => { |
||||
|
data.good = "#D3D3D3"; |
||||
|
data.bad = "#7FFFD4"; |
||||
|
submitData.reslut = 1; |
||||
|
} |
||||
|
const imagePreview = (index) =>{ |
||||
|
showImagePreview({ |
||||
|
images:imgstrArr, |
||||
|
startPosition: index, |
||||
|
}); |
||||
|
} |
||||
|
//3a0096181c184e5aa56f70923680856d$6e74ceda1463c165fd43eeeadce4f7cd |
||||
|
//初始化参数，获取扫码的企业统一信用编码 |
||||
|
onMounted(() =>{ |
||||
|
//查询执法登记信息 |
||||
|
queryEnforcementRegistrationById(route?.query?.id,success =>{ |
||||
|
console.log(success.data); |
||||
|
submitData.enterpriseName = success.data.enterpriseName; |
||||
|
submitData.enterpriseNumber = success.data.enterpriseNumber; |
||||
|
submitData.lawEnforcement = success.data.lawEnforcement; |
||||
|
submitData.lawEnforcementId = success.data.lawEnforcementId; |
||||
|
submitData.lawEnforcementItem = success.data.lawEnforcementItem; |
||||
|
submitData.lawEnforcementBasis = success.data.lawEnforcementBasis; |
||||
|
submitData.lawEnforcerIdTwo = success.data.lawEnforcerIdTwo; |
||||
|
submitData.lawEnforcer = success.data.lawEnforcer; |
||||
|
submitData.remark = success.data.remark; |
||||
|
if(success.data.reslut == 0){ |
||||
|
data.good = "#7FFFD4"; |
||||
|
data.bad = "#D3D3D3"; |
||||
|
}else{ |
||||
|
data.good = "#D3D3D3"; |
||||
|
data.bad = "#7FFFD4"; |
||||
|
} |
||||
|
},error=>{ |
||||
|
|
||||
|
}) |
||||
|
}) |
||||
|
|
||||
|
// 返回 |
||||
|
const goBack = () => { |
||||
|
router.go(-1); |
||||
|
}; |
||||
|
|
||||
|
|
||||
|
|
||||
|
const uploadFiles = (file) =>{ |
||||
|
uploadFile(file,(res) =>{ |
||||
|
console.log(res); |
||||
|
submitData.fileList.push(res.url) |
||||
|
console.log(submitData.fileList); |
||||
|
}); |
||||
|
|
||||
|
} |
||||
|
|
||||
|
const deleteFile = (file,index) =>{ |
||||
|
console.log(index); |
||||
|
submitData.fileListObj.filter((item, indexs) => { |
||||
|
if (index.index == indexs) { |
||||
|
submitData.fileListObj.splice(indexs, 1);//splice 删除 |
||||
|
} |
||||
|
}); |
||||
|
submitData.fileList.filter((item, indexs) => { |
||||
|
if (index.index == indexs) { |
||||
|
submitData.fileList.splice(indexs, 1);//splice 删除 |
||||
|
} |
||||
|
}); |
||||
|
console.log(submitData.fileList); |
||||
|
return true; |
||||
|
} |
||||
|
|
||||
|
const submit = () =>{ |
||||
|
addEnforcementRegistration(submitData,success =>{ |
||||
|
//跳转首页 |
||||
|
if(success.success){ |
||||
|
showSuccessToast('登记成功'); |
||||
|
router.push({ path: "/home" }); |
||||
|
} |
||||
|
},error=>{ |
||||
|
console.log("登记失败") |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
const showPopup = () =>{ |
||||
|
data.popupVisible = true; |
||||
|
} |
||||
|
const showPopup2 = () =>{ |
||||
|
data.popupVisible2 = true; |
||||
|
} |
||||
|
const closePopup = () =>{ |
||||
|
data.popupVisible = false; |
||||
|
data.popupVisible2 = false; |
||||
|
} |
||||
|
const reciveData = (item) =>{ |
||||
|
submitData.lawEnforcerTwo = item.userName; |
||||
|
submitData.lawEnforcerIdTwo = item.userId; |
||||
|
} |
||||
|
const reciveData2 = (item) =>{ |
||||
|
submitData.subsidiaryer = item.userName; |
||||
|
submitData.subsidiaryerId = item.userId; |
||||
|
} |
||||
|
|
||||
|
</script> |
||||
|
|
||||
|
<style lang="less" scoped> |
||||
|
.address_edit { |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
height: 100%; |
||||
|
overflow: hidden; |
||||
|
background-color: #ebf3fb; |
||||
|
} |
||||
|
|
||||
|
.warp_body { |
||||
|
margin: 0 3%; |
||||
|
padding-bottom: 3rem; |
||||
|
width: 94%; |
||||
|
height: 100%; |
||||
|
//border-radius: 0.25rem; |
||||
|
background-image: linear-gradient(to bottom, #ebf3fb, #fff); |
||||
|
overflow-y: auto; |
||||
|
} |
||||
|
|
||||
|
.qy-name{ |
||||
|
font-size: large; |
||||
|
margin-left: 5%; |
||||
|
height: 34px; |
||||
|
margin-top: 0%; |
||||
|
font-weight: 600; |
||||
|
} |
||||
|
.zf-name{ |
||||
|
font-size: 15px; |
||||
|
height: 33px; |
||||
|
background-color: white; |
||||
|
padding-left: 4%; |
||||
|
padding-top: 2%; |
||||
|
font-weight: 600; |
||||
|
} |
||||
|
|
||||
|
/* vant4的 Toast 和 Popup 样式冲突,会导致 Toast 变成白底 */ |
||||
|
.van-popup.van-toast{ |
||||
|
background: var(--van-toast-background) !important; |
||||
|
box-sizing: content-box !important; |
||||
|
/* 下面3条css,影响不大 */ |
||||
|
transition: all var(--van-duration-fast) !important; |
||||
|
width: var(--van-toast-default-width) !important; |
||||
|
max-width: var(--van-toast-max-width) !important; |
||||
|
} |
||||
|
.van-popup.van-toast .van-toast__icon{ |
||||
|
font-size: var(--van-toast-icon-size) !important; |
||||
|
} |
||||
|
|
||||
|
.divdsty { |
||||
|
margin: auto; |
||||
|
width: 100%; |
||||
|
height: 0.25rem; |
||||
|
background-color: #f4f4f4; |
||||
|
border: 0; |
||||
|
} |
||||
|
.file-upload{ |
||||
|
min-height: 4.5rem; |
||||
|
position: relative; |
||||
|
} |
||||
|
.file-upload-center{ |
||||
|
position: absolute; |
||||
|
height: 20%; |
||||
|
top: 10%; |
||||
|
left: 2%; |
||||
|
font-size: 0.38rem; |
||||
|
span { |
||||
|
font-size: 0.32rem; |
||||
|
color: rgb(221, 229, 227); |
||||
|
} |
||||
|
} |
||||
|
.file{ |
||||
|
position: absolute; |
||||
|
bottom: 10%; |
||||
|
left: 2%; |
||||
|
} |
||||
|
|
||||
|
.preview-cover { |
||||
|
position: absolute; |
||||
|
bottom: 0; |
||||
|
box-sizing: border-box; |
||||
|
width: 100%; |
||||
|
padding: 4px; |
||||
|
color: #fff; |
||||
|
font-size: 0.32rem; |
||||
|
text-align: center; |
||||
|
background: rgba(0, 0, 0, 0.3); |
||||
|
} |
||||
|
.zoom{ |
||||
|
padding-top: 10px; |
||||
|
padding-left: 10px; |
||||
|
img{ |
||||
|
width: 2rem; |
||||
|
height: 2rem; |
||||
|
padding-right: 10px |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue