z_yu
3 years ago
1 changed files with 141 additions and 0 deletions
@ -0,0 +1,141 @@ |
|||
<template> |
|||
<div> |
|||
<el-dialog class="bindingDialog" :title="bindingTitle" :visible.sync="bindingVisible" :close-on-click-modal="false" :before-close="handleClose"> |
|||
<span class="dialog-right-top" /> |
|||
<span class="dialog-left-bottom" /> |
|||
<div class="setting-dialog"> |
|||
<div class="binding-wrap"> |
|||
<div v-if="isBinding" class="rebinding"> |
|||
<span>TID</span> |
|||
<el-input v-model="tidCode" placeholder="请输入内容" /> |
|||
</div> |
|||
<div v-else class="binding-flow"> |
|||
<div class="step-item"> |
|||
<!-- step-active 完成 step-loading 进行种 --> |
|||
<span class="step-left-num step-active">1</span> |
|||
<div class="step-right-cont"> |
|||
<p class="step-title">第一步<span>连接读写器</span></p> |
|||
<p class="step-tip tip-active">连接成功</p> |
|||
<!-- err: 连接失败,请检查网络 --> |
|||
<!-- err: 当前电脑未绑定读写器,请到档案设备里进行绑定 --> |
|||
</div> |
|||
</div> |
|||
<div class="step-item"> |
|||
<span class="step-left-num step-active step-loading">2</span> |
|||
<div class="pulse1" /> |
|||
<div class="pulse2" /> |
|||
<div class="pulse3" /> |
|||
<div class="step-right-cont"> |
|||
<p class="step-title">第二步<span>放入标签</span></p> |
|||
<p class="step-tip tip-error">请放入标签</p> |
|||
<!-- tip: 已放入标签 --> |
|||
<!-- err: 未读取到标签,请重新放入 --> |
|||
</div> |
|||
</div> |
|||
<div class="step-item"> |
|||
<span class="step-left-num">3</span> |
|||
<div class="step-right-cont"> |
|||
<p class="step-title">第三步<span>读取标签</span></p> |
|||
<p class="step-tip">放入标签后开始读取标签</p> |
|||
<!-- tip: 读取成功 --> |
|||
<!-- err: 当前标签存在多个,请取出多余的标签只保留一张! --> |
|||
</div> |
|||
</div> |
|||
<div class="step-item"> |
|||
<span class="step-left-num">4</span> |
|||
<div class="step-right-cont"> |
|||
<p class="step-title">第四步<span>开始绑定</span></p> |
|||
<p class="step-tip">标签读取成功后,开始绑定档案</p> |
|||
<!-- tip: 绑定中 --> |
|||
<!-- err: 当前标签已被绑定,是否覆盖? --> |
|||
<!-- 3s后 弹出覆盖绑定dialog --> |
|||
<!-- tip: 已覆盖 --> |
|||
<!-- err: 绑定失败,请拿走当前标签 --> |
|||
</div> |
|||
</div> |
|||
<div class="step-item"> |
|||
<span class="step-left-num">5</span> |
|||
<div class="step-right-cont"> |
|||
<p class="step-title">第五步<span>绑定成功</span></p> |
|||
<p class="step-tip">当前标签与档案绑定成功</p> |
|||
<!-- tip: 绑定成功 --> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div v-if="isBinding" slot="footer" class="dialog-footer"> |
|||
<el-button type="primary" @click="isBinding=false">下一步</el-button> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
|
|||
<!-- 是否覆盖 --> |
|||
<el-dialog title="覆盖绑定" :append-to-body="true" :visible.sync="coverBindingVisible" :before-close="handleClose"> |
|||
<span class="dialog-right-top" /> |
|||
<span class="dialog-left-bottom" /> |
|||
<div class="setting-dialog"> |
|||
<div class="dialog-delt"> |
|||
<p><span>当前标签已被绑定,是否覆盖?</span></p> |
|||
</div> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button type="primary">确定覆盖</el-button> |
|||
<el-button type="text" @click="coverBindingVisible=false">取消</el-button> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'BindingTagDlg', |
|||
components: {}, |
|||
mixins: [], |
|||
props: { |
|||
isBinding: { |
|||
type: Boolean, |
|||
default: false |
|||
}, |
|||
bindingId: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
bindingType: { |
|||
type: Number, |
|||
default: 1 |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
bindingVisible: false, // 绑定标签 |
|||
bindingTitle: '绑定标签', |
|||
tidCode: null, |
|||
coverBindingVisible: false |
|||
} |
|||
}, |
|||
mounted() { |
|||
// test |
|||
// setTimeout(() => { |
|||
// this.coverBindingVisible = true |
|||
// }, 4000) |
|||
}, |
|||
methods: { |
|||
// 右边初始化数据是空 |
|||
// [CRUD.HOOK.beforeRefresh]() { |
|||
// if (this.$refs.dictDetail) { |
|||
// this.$refs.dictDetail.query.id = '' |
|||
// } |
|||
// return true |
|||
// }, |
|||
// 关闭 |
|||
handleClose(done) { |
|||
this.coverBindingVisible = false |
|||
done() |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "~@/assets/styles/archives-manage.scss"; |
|||
</style> |
Write
Preview
Loading…
Cancel
Save
Reference in new issue