Skip to content

F
founder_vue
Commit afbde7f9 by liyuhang19990520
Options

合并

parents a3af7d04 ed1b0050
Showing with 842 additions and 274 deletions
public/image-edit/js/fabric-v4.2.0.js
...@@ -14140,6 +14140,7 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati ...@@ -14140,6 +14140,7 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
* @type Boolean * @type Boolean
* @default * @default
*/ */
// 禁止拖动
selectable: false, selectable: false,
/** /**
......
src/components/ImageEd.scss
...@@ -1126,14 +1126,18 @@ div { ...@@ -1126,14 +1126,18 @@ div {
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0 24px; padding: 0 24px;
color: #666666;
.btn { .btn {
cursor: pointer; cursor: pointer;
background: #f6f8fa; background: #f6f8fa;
box-shadow: 4px 4px 4px 0px rgba(193, 216, 251, 0.8), box-shadow: 4px 4px 4px 0px rgba(193, 216, 251, 0.8),
-4px -4px 4px 0px #ffffff; -4px -4px 4px 0px #ffffff;
border-radius: 4px; border-radius: 4px;
padding: 9px 12px; // padding: 9px 12px;
width: 64px;
padding: 9px 0;
margin-right: 16px; margin-right: 16px;
text-align: center;
&:last-child { &:last-child {
margin-right: 0; margin-right: 0;
} }
...@@ -1144,6 +1148,10 @@ div { ...@@ -1144,6 +1148,10 @@ div {
color: #ffffff; color: #ffffff;
} }
} }
.light_dbd {
width: 128px;
height: 40px;
}
.line { .line {
width: 1px; width: 1px;
height: 40px; height: 40px;
......
src/components/ImageEd.vue
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-09-09 09:28:46 * @Date: 2021-09-09 09:28:46
* @LastEditTime: 2021-11-08 20:01:12 * @LastEditTime: 2021-11-09 21:14:34
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \指纹系统\founder_vue\src\views\cxyrd\LTz.vue * @FilePath: \指纹系统\founder_vue\src\views\cxyrd\LTz.vue
...@@ -401,7 +401,7 @@ ...@@ -401,7 +401,7 @@
<div class="btn" :class="{blendActive: isBlendActive}" @click="changeBlend">差异化</div> <div class="btn" :class="{blendActive: isBlendActive}" @click="changeBlend">差异化</div>
<div class="btn" :class="{multiplyActive: isMultiplyActive}" @click="changeMultiply">正片叠底</div> <div class="btn" :class="{multiplyActive: isMultiplyActive}" @click="changeMultiply">正片叠底</div>
<div class="btn" :class="{removeWhiteActive: isRemoveWhiteActive}" @click="changeRemoveWhite">去白</div> <div class="btn" :class="{removeWhiteActive: isRemoveWhiteActive}" @click="changeRemoveWhite">去白</div>
<div class="btn" :class="{brightnessActive: isBrightnessActive}" @click="changeBrightness">亮度/对比度</div> <div class="btn light_dbd" :class="{brightnessActive: isBrightnessActive}" @click="changeBrightness">亮度/对比度</div>
<!-- 去白弹框 --> <!-- 去白弹框 -->
<div class="remove-white" v-show="optionsRemoveWhite"> <div class="remove-white" v-show="optionsRemoveWhite">
<div class="title">去白</div> <div class="title">去白</div>
......
src/router/index.js
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-09-07 09:57:48 * @Date: 2021-09-07 09:57:48
* @LastEditTime: 2021-11-11 16:53:53 * @LastEditTime: 2021-11-11 16:58:07
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \指纹系统\founder_vue\src\router\index.js * @FilePath: \指纹系统\founder_vue\src\router\index.js
...@@ -66,7 +66,8 @@ const router = new VueRouter({ ...@@ -66,7 +66,8 @@ const router = new VueRouter({
// }); // });
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
if (from.name === 'ryzwbj') { console.log(from);
if(from.name === 'ryzwbj' || from.name === 'ajzwbj') {
// 清空session // 清空session
sessionStorage.clear() sessionStorage.clear()
} }
......
src/router/modules/index.js
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-09-07 09:58:13 * @Date: 2021-09-07 09:58:13
* @LastEditTime: 2021-11-11 16:15:25 * @LastEditTime: 2021-11-11 16:58:44
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \founder_vue\src\router\modules\index.js * @FilePath: \founder_vue\src\router\modules\index.js
......
src/views/AllPersonnelBase/modules/fztm.vue
...@@ -19,12 +19,15 @@ ...@@ -19,12 +19,15 @@
<el-input <el-input
v-if="type== 'ry'" v-if="type== 'ry'"
v-model="rowData.ysxtAsjxgrybh" v-model="rowData.ysxtAsjxgrybh"
:disabled="true"
></el-input> ></el-input>
<el-input <el-input
v-else v-else
v-model="rowData.ysxtAsjbh" v-model="rowData.ysxtAsjbh"
:disabled="true"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<div style="height:16px"></div>
<el-form-item <el-form-item
label="新数据条码号：" label="新数据条码号："
prop='barcode' prop='barcode'
...@@ -193,6 +196,7 @@ export default { ...@@ -193,6 +196,7 @@ export default {
right: -4px; right: -4px;
} }
.tip1 { .tip1 {
margin-top: 26px;
height: 22px; height: 22px;
line-height: 22px; line-height: 22px;
font-size: 14px; font-size: 14px;
......
src/views/AllPersonnelBase/modules/ggrytm.vue
...@@ -19,14 +19,21 @@ ...@@ -19,14 +19,21 @@
label="源条码号：" label="源条码号："
v-if="this.type == 'ry'" v-if="this.type == 'ry'"
> >
<el-input v-model="rowData.ysxtAsjxgrybh"></el-input> <el-input
v-model="rowData.ysxtAsjxgrybh"
:disabled="true"
></el-input>
</el-form-item> </el-form-item>
<el-form-item <el-form-item
label="源条码号：" label="源条码号："
v-else v-if="this.type == 'aj'"
> >
<el-input v-model="rowData.ysxtAsjbh"></el-input> <el-input
v-model="rowData.ysxtAsjbh"
:disabled="true"
></el-input>
</el-form-item> </el-form-item>
<div style="height:16px"></div>
<el-form-item <el-form-item
label="修改条码号：" label="修改条码号："
prop='barcode' prop='barcode'
...@@ -190,6 +197,7 @@ export default { ...@@ -190,6 +197,7 @@ export default {
padding: 0; padding: 0;
} }
.tip1 { .tip1 {
margin-top: 26px;
height: 22px; height: 22px;
line-height: 22px; line-height: 22px;
font-size: 14px; font-size: 14px;
......
src/views/AllPersonnelBase/qbalk.vue
...@@ -734,12 +734,7 @@ export default { ...@@ -734,12 +734,7 @@ export default {
*/ */
handleClick (row) { handleClick (row) {
console.log(row); console.log(row);
this.$router.push({ this.$router.push('/zwbj/ajzwbj/' + row.id + '/' + row.ysxtAsjbh)
path: '/zwbj/ajzwbj/' + row.id,
query: {
barcode: row.barcode
}
})
}, },
/** /**
* @description: 单选事件 * @description: 单选事件
......
src/views/Editor/modules/ajzwbjLeft.vue
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-10-22 09:42:07 * @Date: 2021-10-22 09:42:07
* @LastEditTime: 2021-11-01 20:35:57 * @LastEditTime: 2021-11-10 16:05:35
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \指纹系统\founder_vue\src\views\Editor\modules\ryzwbjLeft.vue * @FilePath: \指纹系统\founder_vue\src\views\Editor\modules\ryzwbjLeft.vue
...@@ -23,11 +23,12 @@ ...@@ -23,11 +23,12 @@
</div> </div>
<div class="left-right-hand" v-if="zwSelect==='指纹'"> <div class="left-right-hand" v-if="zwSelect==='指纹'">
<div class="lr-hand" v-if="fingers.length>0"> <div class="lr-hand" v-if="fingers.length>0">
<div class="fingerDom" v-for="(item,index) in fingers" :key="index" @click="FingersChange(index)"> <div class="fingerDom" v-for="(item,index) in fingers" :key="index" @click="FingersChange(index, item)">
<div class="fingerPic" :class="{fingerPicActive: activeFinger===index}"> <div class="fingerPic" :class="{fingerPicActive: activeFinger===index}">
<div class="finger-number">{{(index+1) &lt; 10 ? ('0'+(index+1)) : (index+1)}}</div> <div class="finger-number">{{(index+1) &lt; 10 ? ('0'+(index+1)) : (index+1)}}</div>
<div class="finger-pic"> <div class="finger-pic">
<img src="../../../assets/img/finger.png" /> <!-- <img src="../../../assets/img/finger.png" /> -->
<img :src="'data:image/jpeg;base64,'+item.image" alt="">
</div> </div>
</div> </div>
</div> </div>
...@@ -39,7 +40,7 @@ ...@@ -39,7 +40,7 @@
</div> </div>
</div> </div>
<div class="finger-total"> <div class="finger-total">
共计<span>4枚</span>指纹 共计<span>{{fingers.length}}枚</span>指纹
</div> </div>
</div> </div>
<div class="left-right-hand" v-else-if="zwSelect==='掌纹'"> <div class="left-right-hand" v-else-if="zwSelect==='掌纹'">
...@@ -48,7 +49,8 @@ ...@@ -48,7 +49,8 @@
<div class="fingerPic" :class="{fingerPicActive: activeHand===index}"> <div class="fingerPic" :class="{fingerPicActive: activeHand===index}">
<div class="finger-number">{{(index+1) &lt; 10 ? ('0'+(index+1)) : (index+1)}}</div> <div class="finger-number">{{(index+1) &lt; 10 ? ('0'+(index+1)) : (index+1)}}</div>
<div class="finger-pic"> <div class="finger-pic">
<img src="../../../assets/img/zhangwen.png" /> <!-- <img src="../../../assets/img/zhangwen.png" /> -->
<img :src="'data:image/jpeg;base64,'+item.image" alt="">
</div> </div>
</div> </div>
</div> </div>
...@@ -69,9 +71,12 @@ ...@@ -69,9 +71,12 @@
</template> </template>
<script> <script>
import { mapState } from 'vuex';
export default { export default {
data () { data () {
return { return {
// 上一次的指纹序号
preSeq: '',
// 案事件编号 // 案事件编号
barcode: '', barcode: '',
id: '', id: '',
...@@ -131,28 +136,116 @@ export default { ...@@ -131,28 +136,116 @@ export default {
], ],
} }
}, },
computed: {
...mapState({
seq: state => state.zwbj.seq,
preTzdArr: state => state.zwbj.pretzdall,
autopretzdall: state => state.zwbj.autopretzdall,
})
},
mounted () { mounted () {
let self = this
console.log(this.$route); console.log(this.$route);
this.barcode = this.$route.query.barcode this.barcode = this.$route.params.barcode
this.id = this.$route.params.id this.id = this.$route.params.id
self.preSeq = this.activerollFinger
// 获取案件指纹
this.getCaseFinger()
}, },
methods: { methods: {
/** /**
* @description: 切换掌纹 * 获取案件指纹原图
* @param {*} handIndex
* @return {*}
*/ */
FingersChange (handIndex) { getCaseOrigin (seq) {
this.activeHand = handIndex this.$store.commit('zwbj/setSeq', seq)
let self = this
this.$axios({
method: 'get',
url: `/api/org/case/${self.id}/${seq}?mnt=1`,
loading: false
}).then(res => {
console.log(res);
if (res.data.code === 0) {
for (const key in res.data.ret) {
if (Object.hasOwnProperty.call(res.data.ret, key)) {
const element = res.data.ret[key];
// 指纹编辑区域发送指纹数据，替换指纹图片
self.$bus.emit('ajzwbjImage', element.image)
self.$bus.emit('ajzwbjTDZ')
}
}
}
})
}, },
/** /**
* 获取案件指纹
*/
getCaseFinger () {
let self = this
this.$axios({
method: 'get',
url: '/api/org/case/' + self.id + '?mnt=1'
}).then(res => {
// console.log(res);
if (res.data.code === 0) {
// self.fingers = res.data.ret
self.fingers = []
for (const key in res.data.ret) {
if (Object.hasOwnProperty.call(res.data.ret, key)) {
const element = res.data.ret[key];
self.fingers.push({
code: element.seq,
image: element.image
})
}
}
// console.log(self.fingers);
// 自动获取第一个
if (self.fingers.length > 0) {
this.activeFinger = 0
self.FingersChange(0, self.fingers[0])
}
} else {
self.$message.error(res.data.message)
}
}).catch(err => {
console.log(err);
})
},
// /**
// * @description: 切换掌纹
// * @param {*} handIndex
// * @return {*}
// */
// FingersChange (handIndex) {
// this.activeHand = handIndex
// },
/**
* @description: 切换指纹 * @description: 切换指纹
* @param {*} finger * @param {*} finger
* @return {*} * @return {*}
*/ */
FingersChange (fingerIndex) { FingersChange (fingerIndex, finger) {
console.log(fingerIndex); console.log(fingerIndex);
this.activeFinger = fingerIndex this.activeFinger = fingerIndex
let self = this
if (this.preSeq) {
// 保存当前的指位特征点信息
// 直接覆盖之前的数据
console.log(self.preTzdArr);
if (self.preTzdArr && self.preTzdArr.length >= 0) {
sessionStorage.setItem(this.preSeq, JSON.stringify(self.preTzdArr))
sessionStorage.setItem(`auto_tzdDom${this.preSeq}`, JSON.stringify(self.autopretzdall))
}
self.$store.commit('zwbj/setTzdall', null)
self.$store.commit('zwbj/setAutoTzdall', null)
}
this.preSeq = finger.code
// 调取获取原图接口
this.getCaseOrigin(finger.code)
}, },
/** /**
* @description: 滚动指纹-平面指纹-掌纹切换 * @description: 滚动指纹-平面指纹-掌纹切换
......
src/views/Editor/modules/imageEd.scss
...@@ -944,6 +944,7 @@ $transOrigin: var(--transOrigin, 0px, 0px); ...@@ -944,6 +944,7 @@ $transOrigin: var(--transOrigin, 0px, 0px);
background: transparent; background: transparent;
overflow: hidden; overflow: hidden;
transform-origin: 320px 320px; transform-origin: 320px 320px;
z-index: 9999;
// transform-origin: $transOrigin; // transform-origin: $transOrigin;
// background-color: #999; // background-color: #999;
} }
......
src/views/Editor/modules/imageEd.vue
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-10-22 11:36:10 * @Date: 2021-10-22 11:36:10
* @LastEditTime: 2021-11-09 20:02:20 * @LastEditTime: 2021-11-10 18:20:00
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \指纹系统\founder_vue\src\views\Editor\modules\imageEd.vue * @FilePath: \指纹系统\founder_vue\src\views\Editor\modules\imageEd.vue
...@@ -619,7 +619,7 @@ export default { ...@@ -619,7 +619,7 @@ export default {
// 笔刷颜色选择器 // 笔刷颜色选择器
// var brushColorpicker = tui.colorPicker.create({ // var brushColorpicker = tui.colorPicker.create({
// container: $('#tui-brush-color-picker')[0], // container: $('#tui-brush-color-picker')[0],
// color: '#FFAA00', // color: '#FFFD0F',
// preset: ['#FF4041', '#FF6619', '#FFBB3B', '#08BD9E', '#1AE8F2', '#00AAFF', '#9E5FFF', '#055FE7'], // preset: ['#FF4041', '#FF6619', '#FFBB3B', '#08BD9E', '#1AE8F2', '#00AAFF', '#9E5FFF', '#055FE7'],
// usageStatistics: false // usageStatistics: false
// }); // });
...@@ -826,7 +826,7 @@ export default { ...@@ -826,7 +826,7 @@ export default {
// imageEditor.stopDrawingMode(); // imageEditor.stopDrawingMode();
// imageEditor.startDrawingMode('LINE_DRAWING', { // imageEditor.startDrawingMode('LINE_DRAWING', {
// width: 4, // width: 4,
// color: '#FFAA00', // color: '#FFFD0F',
// arrowType: { // arrowType: {
// head: 'triangle' // triangle // head: 'triangle' // triangle
// } // }
...@@ -834,7 +834,7 @@ export default { ...@@ -834,7 +834,7 @@ export default {
// imageEditor // imageEditor
// .addShape('circle', { // .addShape('circle', {
// fill: '#FFAA00', // fill: '#FFFD0F',
// stroke: 'blue', // stroke: 'blue',
// strokeWidth: 0, // strokeWidth: 0,
// rx: 4, // rx: 4,
...@@ -988,17 +988,17 @@ export default { ...@@ -988,17 +988,17 @@ export default {
self.isReset = true self.isReset = true
// 旋转角度同样恢复到0 // 旋转角度同样恢复到0
self.inputRotationRange = 0 self.inputRotationRange = 0
console.log(self.startPlace,222); console.log(self.startPlace, 222);
// 事件不能连续重复执行，需要缓存时间 // 事件不能连续重复执行，需要缓存时间
setTimeout(() => { setTimeout(() => {
console.log(11111,-self.startPlace) console.log(11111, -self.startPlace)
imageEditor.rotate(-parseInt(self.startPlace)) imageEditor.rotate(-parseInt(self.startPlace))
imageEditor.resetZoom(); imageEditor.resetZoom();
self.startPlace = 0; self.startPlace = 0;
}, 200); }, 200);
//重置位置变量 //重置位置变量
self.move_left = 0; self.move_left = 0;
self.move_top = 0; self.move_top = 0;
self.zoomLevel = 1; self.zoomLevel = 1;
imageEditor.resetFlip().then(function (status) { imageEditor.resetFlip().then(function (status) {
console.log('flipX: ', status.flipX); console.log('flipX: ', status.flipX);
...@@ -1225,11 +1225,11 @@ export default { ...@@ -1225,11 +1225,11 @@ export default {
$('.tzdDom .head').css('width', '8px') $('.tzdDom .head').css('width', '8px')
$('.tzdDom .head').css('height', '8px') $('.tzdDom .head').css('height', '8px')
$('.tzdDom .head').css('border-radius', '8px') $('.tzdDom .head').css('border-radius', '8px')
$('.tzdDom .head').css('background-color', '#ffaa00') $('.tzdDom .head').css('background-color', '#FFFD0F')
$('.tzdDom .direction').css('width', '20px') $('.tzdDom .direction').css('width', '20px')
$('.tzdDom .direction').css('height', '2px') $('.tzdDom .direction').css('height', '2px')
$('.tzdDom .direction').css('background-color', '#ffaa00') $('.tzdDom .direction').css('background-color', '#FFFD0F')
$(`#tzd${self.tzdId}`).css("left", (item.zwzxd_tzxzb - 4) / self.zoomLevel + "px"); $(`#tzd${self.tzdId}`).css("left", (item.zwzxd_tzxzb - 4) / self.zoomLevel + "px");
$(`#tzd${self.tzdId}`).css("top", (item.zwzxd_tzyzb - 4) / self.zoomLevel + "px"); $(`#tzd${self.tzdId}`).css("top", (item.zwzxd_tzyzb - 4) / self.zoomLevel + "px");
...@@ -1320,11 +1320,11 @@ export default { ...@@ -1320,11 +1320,11 @@ export default {
$('.tzdDom .head').css('width', '8px') $('.tzdDom .head').css('width', '8px')
$('.tzdDom .head').css('height', '8px') $('.tzdDom .head').css('height', '8px')
$('.tzdDom .head').css('border-radius', '8px') $('.tzdDom .head').css('border-radius', '8px')
$('.tzdDom .head').css('background-color', '#ffaa00') $('.tzdDom .head').css('background-color', '#FFFD0F')
$('.tzdDom .direction').css('width', '20px') $('.tzdDom .direction').css('width', '20px')
$('.tzdDom .direction').css('height', '2px') $('.tzdDom .direction').css('height', '2px')
$('.tzdDom .direction').css('background-color', '#ffaa00') $('.tzdDom .direction').css('background-color', '#FFFD0F')
// self.zoomLevel // self.zoomLevel
// $(`#tzd${self.tzdId}`).css("left", e.pageX - $('.tzdDrawing').offset().left - 4 + "px"); // $(`#tzd${self.tzdId}`).css("left", e.pageX - $('.tzdDrawing').offset().left - 4 + "px");
...@@ -1337,7 +1337,7 @@ export default { ...@@ -1337,7 +1337,7 @@ export default {
// 鼠标右击 // 鼠标右击
if (e.which === 3) { if (e.which === 3) {
console.log(e); console.log(e);
if (e.target.className == "head" || e.target.className == "direction") { if (e.target.className == "head" || e.target.className == "direction" || e.target.className == 'auto_tzdDom') {
// 删除该特征点 // 删除该特征点
let tdzindex = self.tzdArr.findIndex((item) => { let tdzindex = self.tzdArr.findIndex((item) => {
return item.id == e.target.parentNode.id.substring(3, e.target.parentNode.id.length); return item.id == e.target.parentNode.id.substring(3, e.target.parentNode.id.length);
...@@ -1353,21 +1353,48 @@ export default { ...@@ -1353,21 +1353,48 @@ export default {
} }
self.tzdnumber = self.tzdArr.length self.tzdnumber = self.tzdArr.length
// console.log(self.tzdArr); // console.log(self.tzdArr);
// 全部数据保存
var tzdall_shou = []
self.tzdArr.forEach(item => {
tzdall_shou.push({
id: item.id,
zwtzd_tzfx: item.angle,
zwzxd_tzxzb: item.x,
zwzxd_tzyzb: item.y
})
})
self.$store.commit('zwbj/setTzdall', tzdall_shou)
// 删除自动提取的特征点 // 删除自动提取的特征点
console.log(self.autoTzdArr); console.log(self.autoTzdArr);
let auto_tzdindex = self.autoTzdArr.findIndex((item) => { if (e.target.className == 'auto_tzdDom') {
return item.id == e.target.parentNode.id; let auto_tzdindex = self.autoTzdArr.findIndex((item) => {
}) return item.id == e.target.parentNode.id;
console.log(auto_tzdindex); })
if (auto_tzdindex != -1) { console.log(auto_tzdindex);
self.autoTzdArr.splice(auto_tzdindex, 1) if (auto_tzdindex != -1) {
$(e.target.parentNode).css('border', '2px solid red'); self.autoTzdArr.splice(auto_tzdindex, 1)
setTimeout(() => { $(e.target.parentNode).css('border', '2px solid red');
$(e.target.parentNode).remove(); setTimeout(() => {
}, 1000); $(e.target.parentNode).remove();
// 更新vuex数据 }, 1000);
self.$store.commit('zwbj/setAutoTzdall', self.autoTzdArr) // 更新vuex数据
self.$store.commit('zwbj/setAutoTzdall', self.autoTzdArr)
}
} else {
let auto_tzdindex = self.autoTzdArr.findIndex((item) => {
return item.id == e.target.parentNode.id;
})
console.log(auto_tzdindex);
if (auto_tzdindex != -1) {
self.autoTzdArr.splice(auto_tzdindex, 1)
$(e.target.parentNode).css('border', '2px solid red');
setTimeout(() => {
$(e.target.parentNode).remove();
}, 1000);
// 更新vuex数据
self.$store.commit('zwbj/setAutoTzdall', self.autoTzdArr)
}
} }
// auto_tzdDom // auto_tzdDom
} }
...@@ -1508,6 +1535,8 @@ export default { ...@@ -1508,6 +1535,8 @@ export default {
// self.$set(self.tzdArr[self.tzdId], 'angle', obj.deg) // self.$set(self.tzdArr[self.tzdId], 'angle', obj.deg)
self.tzdArr[objindex].angle = obj.deg self.tzdArr[objindex].angle = obj.deg
} else { } else {
console.log(self.tzdArr);
console.log(self.tzdId);
let objindex = self.tzdArr.findIndex((item) => { let objindex = self.tzdArr.findIndex((item) => {
return item.id == self.tzdId return item.id == self.tzdId
}) })
...@@ -1633,11 +1662,11 @@ export default { ...@@ -1633,11 +1662,11 @@ export default {
$('.auto_tzdDom .head').css('width', '8px') $('.auto_tzdDom .head').css('width', '8px')
$('.auto_tzdDom .head').css('height', '8px') $('.auto_tzdDom .head').css('height', '8px')
$('.auto_tzdDom .head').css('border-radius', '8px') $('.auto_tzdDom .head').css('border-radius', '8px')
$('.auto_tzdDom .head').css('background-color', '#ffaa00') $('.auto_tzdDom .head').css('background-color', '#FFFD0F')
$('.auto_tzdDom .direction').css('width', '20px') $('.auto_tzdDom .direction').css('width', '20px')
$('.auto_tzdDom .direction').css('height', '2px') $('.auto_tzdDom .direction').css('height', '2px')
$('.auto_tzdDom .direction').css('background-color', '#ffaa00') $('.auto_tzdDom .direction').css('background-color', '#FFFD0F')
$(`#tzd${self.tzdId}`).css("left", (item.zwzxd_tzxzb - 4) / self.zoomLevel + "px"); $(`#tzd${self.tzdId}`).css("left", (item.zwzxd_tzxzb - 4) / self.zoomLevel + "px");
$(`#tzd${self.tzdId}`).css("top", (item.zwzxd_tzyzb - 4) / self.zoomLevel + "px"); $(`#tzd${self.tzdId}`).css("top", (item.zwzxd_tzyzb - 4) / self.zoomLevel + "px");
...@@ -1655,7 +1684,7 @@ export default { ...@@ -1655,7 +1684,7 @@ export default {
self.autoTzdArr = JSON.parse(sessionStorage.getItem(`auto${this.seq}`)) self.autoTzdArr = JSON.parse(sessionStorage.getItem(`auto${this.seq}`))
self.autoTzdArr.forEach((item, index) => { self.autoTzdArr.forEach((item, index) => {
$( $(
`<div id="tzd${self.id}" class="auto_tzdDom"><div class="head"></div><div class="direction"></div></div>` `<div id="${item.id}" class="auto_tzdDom"><div class="head"></div><div class="direction"></div></div>`
).appendTo(".tzdDrawing"); ).appendTo(".tzdDrawing");
$('.auto_tzdDom').css('display', 'flex') $('.auto_tzdDom').css('display', 'flex')
$('.auto_tzdDom').css('align-items', 'center') $('.auto_tzdDom').css('align-items', 'center')
...@@ -1665,16 +1694,16 @@ export default { ...@@ -1665,16 +1694,16 @@ export default {
$('.auto_tzdDom .head').css('width', '8px') $('.auto_tzdDom .head').css('width', '8px')
$('.auto_tzdDom .head').css('height', '8px') $('.auto_tzdDom .head').css('height', '8px')
$('.auto_tzdDom .head').css('border-radius', '8px') $('.auto_tzdDom .head').css('border-radius', '8px')
$('.auto_tzdDom .head').css('background-color', '#ffaa00') $('.auto_tzdDom .head').css('background-color', '#FFFD0F')
$('.auto_tzdDom .direction').css('width', '20px') $('.auto_tzdDom .direction').css('width', '20px')
$('.auto_tzdDom .direction').css('height', '2px') $('.auto_tzdDom .direction').css('height', '2px')
$('.auto_tzdDom .direction').css('background-color', '#ffaa00') $('.auto_tzdDom .direction').css('background-color', '#FFFD0F')
$(`#tzd${self.id}`).css("left", (item.zwzxd_tzxzb - 4) / self.zoomLevel + "px"); $(`#${item.id}`).css("left", (item.zwzxd_tzxzb - 4) / self.zoomLevel + "px");
$(`#tzd${self.id}`).css("top", (item.zwzxd_tzyzb - 4) / self.zoomLevel + "px"); $(`#${item.id}`).css("top", (item.zwzxd_tzyzb - 4) / self.zoomLevel + "px");
$(`#tzd${self.id}`).css("box-sizing", "border-box"); $(`#${item.id}`).css("box-sizing", "border-box");
$("#tzd" + self.id).css("transform", `rotate(${item.zwtzd_tzfx}deg)`); $("#" + item.id).css("transform", `rotate(${item.zwtzd_tzfx}deg)`);
}) })
self.$store.commit('zwbj/setAutoTzdall', self.autoTzdArr) self.$store.commit('zwbj/setAutoTzdall', self.autoTzdArr)
// 将自动提取的特征点存入session中 // 将自动提取的特征点存入session中
...@@ -1880,7 +1909,7 @@ export default { ...@@ -1880,7 +1909,7 @@ export default {
// this.imageEditor.stopDrawingMode(); // this.imageEditor.stopDrawingMode();
// this.imageEditor.startDrawingMode('LINE_DRAWING', { // this.imageEditor.startDrawingMode('LINE_DRAWING', {
// width: 4, // width: 4,
// color: '#FFAA00', // color: '#FFFD0F',
// arrowType: { // arrowType: {
// head: 'triangle' // triangle // head: 'triangle' // triangle
// } // }
...@@ -1925,7 +1954,7 @@ export default { ...@@ -1925,7 +1954,7 @@ export default {
}, 200); }, 200);
//重置位置变量 //重置位置变量
self.move_left = 0; self.move_left = 0;
self.move_top = 0; self.move_top = 0;
self.zoomLevel = 1; self.zoomLevel = 1;
self.imageEditor.resetFlip().then(function (status) { self.imageEditor.resetFlip().then(function (status) {
console.log('flipX: ', status.flipX); console.log('flipX: ', status.flipX);
...@@ -1940,7 +1969,7 @@ export default { ...@@ -1940,7 +1969,7 @@ export default {
// self.zoomLevel = 1; // self.zoomLevel = 1;
// this.imageEditor.rotate(-parseInt(-self.startPlace)); // this.imageEditor.rotate(-parseInt(-self.startPlace));
// self.startPlace = 0; // self.startPlace = 0;
// // 特征点图层缩放设置为1 // // 特征点图层缩放设置为1
// $('.tzdDrawing').css('transform', 'scale(1)'); // $('.tzdDrawing').css('transform', 'scale(1)');
}, },
......
src/views/Editor/modules/imageEdAJ.scss
...@@ -844,6 +844,7 @@ $directionRotate: var(--directionRotate, 0deg); ...@@ -844,6 +844,7 @@ $directionRotate: var(--directionRotate, 0deg);
background: transparent; background: transparent;
overflow: hidden; overflow: hidden;
transform-origin: 320px 320px; transform-origin: 320px 320px;
z-index: 9999;
// transform-origin: $transOrigin; // transform-origin: $transOrigin;
// background-color: #999; // background-color: #999;
} }
...@@ -1114,6 +1115,7 @@ $directionRotate: var(--directionRotate, 0deg); ...@@ -1114,6 +1115,7 @@ $directionRotate: var(--directionRotate, 0deg);
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0 16px; padding: 0 16px;
position: relative;
.blcbtn { .blcbtn {
cursor: pointer; cursor: pointer;
width: 40px; width: 40px;
...@@ -1131,6 +1133,35 @@ $directionRotate: var(--directionRotate, 0deg); ...@@ -1131,6 +1133,35 @@ $directionRotate: var(--directionRotate, 0deg);
height: 26px; height: 26px;
} }
} }
.blcbtn-options {
z-index: 100;
position: absolute;
top: 50px;
left: 16px;
width: 286px;
height: 285px;
background: #ffffff;
box-shadow: 0px 14px 30px 0px rgba(0, 21, 51, 0.25);
border-radius: 6px;
.blcbtn-head {
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #e6e6e8;
height: 50px;
padding: 0 24px;
.head-title {
font-size: 16px;
font-family: MicrosoftYaHei;
color: #282f3c;
}
.head-close {
cursor: pointer;
color: #b1b6c2;
font-size: 20px;
}
}
}
.txblyz { .txblyz {
cursor: pointer; cursor: pointer;
margin-right: 28px; margin-right: 28px;
......
src/views/Editor/modules/imageEdAJ.vue
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-10-22 11:36:10 * @Date: 2021-10-22 11:36:10
* @LastEditTime: 2021-11-09 16:19:34 * @LastEditTime: 2021-11-10 18:18:24
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \指纹系统\founder_vue\src\views\Editor\modules\imageEd.vue * @FilePath: \指纹系统\founder_vue\src\views\Editor\modules\imageEd.vue
...@@ -155,6 +155,18 @@ ...@@ -155,6 +155,18 @@
<div class="blcbtn" @click="addRule"> <div class="blcbtn" @click="addRule">
<img src="@/assets/img/rybj/rule.png" alt=""> <img src="@/assets/img/rybj/rule.png" alt="">
</div> </div>
<div class="blcbtn-options" v-show="rule">
<div class="blcbtn-head">
<div class="head-title">比例尺</div>
<div class="head-close" @click="rule = false">×</div>
</div>
<div class="blcbtn-content">
<!-- <el-select v-model="value" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select> -->
</div>
</div>
<div class="txblyz"> <div class="txblyz">
<div class="pic"> <div class="pic">
<img src="@/assets/img/rybj/img.png" alt=""> <img src="@/assets/img/rybj/img.png" alt="">
...@@ -236,7 +248,7 @@ ...@@ -236,7 +248,7 @@
<!-- <div class="bzd" @click="directionChange">--> <!-- <div class="bzd" @click="directionChange">-->
<!-- <img src="@/assets/img/rybj/bzd.png" alt="">--> <!-- <img src="@/assets/img/rybj/bzd.png" alt="">-->
<!-- </div>--> <!-- </div>-->
<div class="rule"> <div class="rule" @click="getAutoTzd(true)">
<img src="@/assets/img/rybj/dp.png" alt=""> <img src="@/assets/img/rybj/dp.png" alt="">
</div> </div>
<div class="rotate" @click="rotateChange"> <div class="rotate" @click="rotateChange">
...@@ -399,10 +411,13 @@ ...@@ -399,10 +411,13 @@
<script> <script>
// import RangeSlider from './RangeSlider'; // import RangeSlider from './RangeSlider';
import { mapState } from 'vuex';
import MouseGesture from "./tzd_rotate.js"; import MouseGesture from "./tzd_rotate.js";
export default { export default {
data () { data () {
return { return {
// 是否展示比例尺
rule: false,
// 是否裁剪过 // 是否裁剪过
isCrop: false, isCrop: false,
// 裁切的位置 // 裁切的位置
...@@ -659,6 +674,8 @@ export default { ...@@ -659,6 +674,8 @@ export default {
tzdFlag: false, tzdFlag: false,
// 特征点数组 // 特征点数组
tzdArr: [], tzdArr: [],
// 自动提取-特征点数据
autoTzdArr: [],
// 是否显示旋转绿线 // 是否显示旋转绿线
isdirection: false, isdirection: false,
newHeight: 640, newHeight: 640,
...@@ -666,16 +683,32 @@ export default { ...@@ -666,16 +683,32 @@ export default {
// tzdDrawing 的移动距离 // tzdDrawing 的移动距离
tzdDrawingLeft: 0, tzdDrawingLeft: 0,
tzdDrawingTop: 0, tzdDrawingTop: 0,
//旋转之前的度数 // 旋转之前的度数
startPlace: 0, startPlace: 0,
// 是否可以打开缩略图
isSLT: false,
// 路由传参
barcode: '',
// 特征点全部数组
tzdall: [],
// 之前的手动特征点
pretzdall: []
}; };
}, },
computed: {
...mapState({
seq: state => state.zwbj.seq,
preTzdArr: state => state.zwbj.pretzdall,
autopretzdall: state => state.zwbj.autopretzdall,
})
},
created () { created () {
let w1 = 1920 let w1 = 1920
let w2 = window.innerWidth let w2 = window.innerWidth
this.canvasWidth = this.canvasWidth * w2 / w1 this.canvasWidth = this.canvasWidth * w2 / w1
this.canvasHeight = this.canvasHeight * w2 / w1 this.canvasHeight = this.canvasHeight * w2 / w1
// 获取barcode，seq
this.barcode = this.$route.params.barcode
}, },
mounted () { mounted () {
// $('input').RangeSlider({ min: 0, max: 100, step: 0.1}); // $('input').RangeSlider({ min: 0, max: 100, step: 0.1});
...@@ -683,11 +716,8 @@ export default { ...@@ -683,11 +716,8 @@ export default {
let self = this let self = this
var supportingFileAPI = !!(window.File && window.FileList && window.FileReader); var supportingFileAPI = !!(window.File && window.FileList && window.FileReader);
var rImageType = /data:(image\/.+);base64,/; var rImageType = /data:(image\/.+);base64,/;
var activeObjectId;
// Buttons // Buttons
var $btns = $('.menu-item');
var $btnsActivatable = $btns.filter('.activatable');
var $inputImage = $('#input-image-file'); var $inputImage = $('#input-image-file');
var $btnDownload = $('#btn-download'); var $btnDownload = $('#btn-download');
...@@ -826,24 +856,6 @@ export default { ...@@ -826,24 +856,6 @@ export default {
} }
} }
function activateShapeMode () {
if (imageEditor.getDrawingMode() !== 'SHAPE') {
imageEditor.stopDrawingMode();
imageEditor.startDrawingMode('SHAPE');
}
}
function activateIconMode () {
imageEditor.stopDrawingMode();
}
function activateTextMode () {
if (imageEditor.getDrawingMode() !== 'TEXT') {
imageEditor.stopDrawingMode();
imageEditor.startDrawingMode('TEXT');
}
}
// Attach image editor custom events // Attach image editor custom events
imageEditor.on({ imageEditor.on({
objectAdded: function (objectProps) { objectAdded: function (objectProps) {
...@@ -996,7 +1008,7 @@ export default { ...@@ -996,7 +1008,7 @@ export default {
self.inputRotationRange = 0 self.inputRotationRange = 0
// 事件不能连续重复执行，需要缓存时间 // 事件不能连续重复执行，需要缓存时间
setTimeout(() => { setTimeout(() => {
console.log(11111,-self.startPlace) console.log(11111, -self.startPlace)
imageEditor.rotate(-parseInt(self.startPlace)) imageEditor.rotate(-parseInt(self.startPlace))
imageEditor.resetZoom(); imageEditor.resetZoom();
self.startPlace = 0; self.startPlace = 0;
...@@ -1235,6 +1247,96 @@ export default { ...@@ -1235,6 +1247,96 @@ export default {
}); });
}) })
this.$bus.on('ajzwbjImage', (sourceImage) => {
self.sourceImage = sourceImage
imageEditor.loadImageFromURL('data:image/jpeg;base64,' + sourceImage, 'SampleImage').then(function (sizeValue) {
// console.log(sizeValue);
// 切换指纹图片时，清空特征点数组
self.tzdnumber = 0
self.tzdArr = []
self.autoTzdArr = []
// 移除图片上的点
$('.tzdDom').remove()
$('.auto_tzdDom').remove()
imageEditor.clearUndoStack();
// 缩放为1
self.zoomLevel = 1
// 获取自动提取特征
self.getAutoTzd(false)
// 如果之前保留了特征点，则展示出来
if (sessionStorage.getItem(self.seq) != 'undefined' && sessionStorage.getItem(self.seq) != null) {
console.log(sessionStorage.getItem(self.seq));
let preTzd = JSON.parse(sessionStorage.getItem(self.seq))
if (preTzd && preTzd.length > 0) {
preTzd.forEach((item, index) => {
self.tzdArr.push({
id: self.tzdId,
x: item.xczw_zwtzd_tzxzb,
y: item.xczw_zwtzd_tzyzb,
angle: item.xczw_zwtzd_tzfx
})
$(
`<div id="tzd${self.tzdId}" class="tzdDom"><div class="head"></div><div class="direction"></div></div>`
).appendTo(".tzdDrawing");
$('.tzdDom').css('display', 'flex')
$('.tzdDom').css('align-items', 'center')
$('.tzdDom').css('position', 'absolute')
$('.tzdDom').css('transform-origin', 'left center')
$('.tzdDom .head').css('width', '8px')
$('.tzdDom .head').css('height', '8px')
$('.tzdDom .head').css('border-radius', '8px')
$('.tzdDom .head').css('background-color', '#FFFD0F')
$('.tzdDom .direction').css('width', '20px')
$('.tzdDom .direction').css('height', '2px')
$('.tzdDom .direction').css('background-color', '#FFFD0F')
$(`#tzd${self.tzdId}`).css("left", (item.xczw_zwtzd_tzxzb - 4) / self.zoomLevel + "px");
$(`#tzd${self.tzdId}`).css("top", (item.xczw_zwtzd_tzyzb - 4) / self.zoomLevel + "px");
$(`#tzd${self.tzdId}`).css("box-sizing", "border-box");
$("#tzd" + self.tzdId).css("transform", `rotate(${item.xczw_zwtzd_tzfx}deg)`);
self.tzdId++
})
}
}
});
})
// 监听是否选择了掌纹===展示缩略图
this.$bus.on('ajzwbjType', (type) => {
if (type) {
self.isSLT = true
} else {
self.isSLT = false
}
})
// 清空特征点数量
this.$bus.on('ajzwbjTDZ', () => {
self.tzdArr = []
self.tzdnumber = 0
self.isHandTZD = false
$('.tzdDom').remove()
})
$(document).keydown(function (event) {
if (event.keyCode == 32) {
self.isHandSpace = true
}
});
$(document).keyup(function (event) {
if (event.keyCode == 32) {
self.isHandSpace = false
}
});
// 图片导入 // 图片导入
$inputImage.on('change', function (event) { $inputImage.on('change', function (event) {
var file; var file;
...@@ -1283,7 +1385,7 @@ export default { ...@@ -1283,7 +1385,7 @@ export default {
var centerY = 0; var centerY = 0;
var radius = 0; var radius = 0;
var circleId = 0; var circleId = 0;
var circleArr = []; self.circleArr_hand = [];
// 是否正在画圆 // 是否正在画圆
var isDrawing = false; var isDrawing = false;
// ****************************** // ******************************
...@@ -1336,11 +1438,11 @@ export default { ...@@ -1336,11 +1438,11 @@ export default {
$('.tzdDom .head').css('width', '8px') $('.tzdDom .head').css('width', '8px')
$('.tzdDom .head').css('height', '8px') $('.tzdDom .head').css('height', '8px')
$('.tzdDom .head').css('border-radius', '8px') $('.tzdDom .head').css('border-radius', '8px')
$('.tzdDom .head').css('background-color', '#ffaa00') $('.tzdDom .head').css('background-color', '#FFFD0F')
$('.tzdDom .direction').css('width', '20px') $('.tzdDom .direction').css('width', '20px')
$('.tzdDom .direction').css('height', '2px') $('.tzdDom .direction').css('height', '2px')
$('.tzdDom .direction').css('background-color', '#ffaa00') $('.tzdDom .direction').css('background-color', '#FFFD0F')
// self.zoomLevel // self.zoomLevel
// $(`#tzd${self.tzdId}`).css("left", e.pageX - $('.tzdDrawing').offset().left - 4 + "px"); // $(`#tzd${self.tzdId}`).css("left", e.pageX - $('.tzdDrawing').offset().left - 4 + "px");
...@@ -1352,8 +1454,8 @@ export default { ...@@ -1352,8 +1454,8 @@ export default {
} }
// 鼠标右击 // 鼠标右击
if (e.which === 3) { if (e.which === 3) {
// console.log(e); console.log(e);
if (e.target.className == "head" || e.target.className == "direction") { if (e.target.className == "head" || e.target.className == "direction" || e.target.className == 'auto_tzdDom') {
// 删除该特征点 // 删除该特征点
let tdzindex = self.tzdArr.findIndex((item) => { let tdzindex = self.tzdArr.findIndex((item) => {
return item.id == e.target.parentNode.id.substring(3, e.target.parentNode.id.length); return item.id == e.target.parentNode.id.substring(3, e.target.parentNode.id.length);
...@@ -1366,30 +1468,98 @@ export default { ...@@ -1366,30 +1468,98 @@ export default {
setTimeout(() => { setTimeout(() => {
$(e.target.parentNode).remove(); $(e.target.parentNode).remove();
}, 1000); }, 1000);
self.tzdnumber = self.tzdArr.length
// 全部数据保存
var tzdall_shou = []
self.tzdArr.forEach(item => {
tzdall_shou.push({
id: item.id,
xczw_zwtzd_tzxzb: item.x,
xczw_zwtzd_tzyzb: item.y,
xczw_zwtzd_tzfx: item.angle
})
})
self.$store.commit('zwbj/setTzdall', tzdall_shou)
} }
self.tzdnumber = self.tzdArr.length self.tzdnumber = self.tzdArr.length
// console.log(self.tzdArr); // console.log(self.tzdArr);
// 删除自动提取的特征点
console.log(self.autoTzdArr);
if (e.target.className == 'auto_tzdDom') {
let auto_tzdindex = self.autoTzdArr.findIndex((item) => {
return item.id == e.target.id;
})
console.log(auto_tzdindex);
if (auto_tzdindex != -1) {
self.autoTzdArr.splice(auto_tzdindex, 1)
$(e.target).css('border', '2px solid red');
setTimeout(() => {
$(e.target).remove();
}, 1000);
// 更新vuex数据
self.$store.commit('zwbj/setAutoTzdall', self.autoTzdArr)
}
} else {
let auto_tzdindex = self.autoTzdArr.findIndex((item) => {
return item.id == e.target.parentNode.id;
})
console.log(auto_tzdindex);
if (auto_tzdindex != -1) {
self.autoTzdArr.splice(auto_tzdindex, 1)
$(e.target.parentNode).css('border', '2px solid red');
setTimeout(() => {
$(e.target.parentNode).remove();
}, 1000);
// 更新vuex数据
self.$store.commit('zwbj/setAutoTzdall', self.autoTzdArr)
}
}
} }
} }
} }
// 开启圆形绘制 // 开启圆形绘制
if (self.isSelectedCirclePaint) { if (e.which === 1) {
if (e.target.className == "circle") { if (self.isSelectedCirclePaint) {
return; if (e.target.className == "td_circle") {
return;
}
$circle = $(`<div id="circle${circleId}" class="td_circle"></div>`);
centerX = e.pageX - $drawing.offset().left;
centerY = e.pageY - $drawing.offset().top;
$('.tzdDrawing').append($circle);
$circle.css("border", "2px solid red");
$circle.css("position", "absolute");
self.circleArr_hand.push({
id: circleId,
centerX: centerX,
centerY: centerY,
radius: 0
});
isDrawing = true;
e.preventDefault();
} }
$circle = $(`<div id="circle${circleId}" class="td_circle"></div>`); }
centerX = e.pageX - $drawing.offset().left; // 删除圆
centerY = e.pageY - $drawing.offset().top; if (e.target.className == "td_circle") {
$('.tzdDrawing').append($circle); console.log(e);
$circle.css("border", "2px solid red"); $(".td_circle").unbind('click').click(function (event) {
$circle.css("position", "absolute"); console.log(event);
circleArr.push({ console.log(1111);
id: circleId, let circleid = event.target.id.substring(
centerX: centerX, 6,
centerY: centerY, event.target.id.length
);
let circleIndex = self.circleArr_hand.findIndex((item) => {
return item.id == circleid;
});
console.log(circleIndex);
if (circleIndex != -1) self.circleArr_hand.splice(circleIndex, 1);
$(this).remove();
console.log(self.circleArr_hand);
event.stopPropagation(); // 阻止事件冒泡
}); });
isDrawing = true;
e.preventDefault();
} }
}); });
// 去掉鼠标默认事件 // 去掉鼠标默认事件
...@@ -1583,6 +1753,8 @@ export default { ...@@ -1583,6 +1753,8 @@ export default {
$circle.css("width", 2 * radius + "px"); $circle.css("width", 2 * radius + "px");
$circle.css("height", 2 * radius + "px"); $circle.css("height", 2 * radius + "px");
$circle.css("border-radius", "50%"); $circle.css("border-radius", "50%");
$circle.css("background", "rgba(0,0,0,0)");
} }
} }
}); });
...@@ -1610,6 +1782,8 @@ export default { ...@@ -1610,6 +1782,8 @@ export default {
// self.$set(self.tzdArr[self.tzdId], 'angle', obj.deg) // self.$set(self.tzdArr[self.tzdId], 'angle', obj.deg)
self.tzdArr[objindex].angle = obj.deg self.tzdArr[objindex].angle = obj.deg
} else { } else {
console.log(self.tzdArr);
console.log(self.tzdId);
let objindex = self.tzdArr.findIndex((item) => { let objindex = self.tzdArr.findIndex((item) => {
return item.id == self.tzdId return item.id == self.tzdId
}) })
...@@ -1620,6 +1794,24 @@ export default { ...@@ -1620,6 +1794,24 @@ export default {
self.tzdFlag = false; self.tzdFlag = false;
self.tzdId++; self.tzdId++;
ins.setEnd(); ins.setEnd();
// 为了数据回显（只保留手动的，自动的换图自动点击），每次追加一个特征点都保存到全局中去
if (self.tzdArr.length > 0) {
self.tzdArr.forEach(item => {
self.pretzdall.push({
xczw_zwtzd_tzfx: item.angle,
xczw_zwtzd_tzxzb: item.x,
xczw_zwtzd_tzyzb: item.y
})
})
}
console.log(self.pretzdall);
// 全部数据保存
self.$store.commit('zwbj/setTzdall', self.pretzdall)
console.log(self.preTzdArr);
self.pretzdall = []
} }
} }
if (e.which === 3) { if (e.which === 3) {
...@@ -1627,42 +1819,52 @@ export default { ...@@ -1627,42 +1819,52 @@ export default {
ins.setEnd(); ins.setEnd();
} }
// 开启圆形绘制 // 开启圆形绘制
if (self.isSelectedCirclePaint) { if (e.which === 1) {
let circleid = e.target.id.substring(6, e.target.id.length); if (self.isSelectedCirclePaint) {
console.log(circleid); console.log(e);
let circleid = e.target.id.substring(6, e.target.id.length);
for (let index = 0; index < circleArr.length; index++) { console.log(circleid);
const element = circleArr[index]; if (self.circleArr_hand[circleId])
if (element.id == circleid) { self.circleArr_hand[circleId].radius = radius
element.radius = radius; // for (let index = 0; index < self.circleArr_hand.length; index++) {
} // const element = self.circleArr_hand[index];
} // if (element.id == circleid) {
console.log(circleArr); // console.log(element.id);
circleId++; // console.log(radius);
isDrawing = false; // // element.radius = radius;
if (e.target.className == "td_circle") { // self.$set(self.circleArr_hand[index], 'radius', radius)
$(".td_circle").unbind('click').click(function (event) { // }
console.log(event); // }
console.log(1111); console.log(self.circleArr_hand);
let circleid = event.target.id.substring( circleId++;
6, isDrawing = false;
event.target.id.length // if (e.target.className == "td_circle") {
); // $(".td_circle").unbind('click').click(function (event) {
let circleIndex = circleArr.findIndex((item) => { // console.log(event);
return item.id == circleid; // console.log(1111);
}); // let circleid = event.target.id.substring(
console.log(circleIndex); // 6,
if (circleIndex != -1) circleArr.splice(circleIndex, 1); // event.target.id.length
$(this).remove(); // );
console.log(circleArr); // let circleIndex = self.circleArr_hand.findIndex((item) => {
event.stopPropagation(); // 阻止事件冒泡 // return item.id == circleid;
}); // });
// console.log(circleIndex);
// if (circleIndex != -1) self.circleArr_hand.splice(circleIndex, 1);
// $(this).remove();
// console.log(self.circleArr_hand);
// event.stopPropagation(); // 阻止事件冒泡
// });
// }
} }
} }
}); });
var Fcanvas = new fabric_irregular.Canvas("irregular"); var Fcanvas = new fabric_irregular.Canvas("irregular");
// selectable
Fcanvas.selections = false//取消框选 Fcanvas.selections = false//取消框选
var Fcanvasarr = []; var Fcanvasarr = [];
var Fcanvasline1 = []; var Fcanvasline1 = [];
var findIndex = 0 var findIndex = 0
...@@ -1693,6 +1895,8 @@ export default { ...@@ -1693,6 +1895,8 @@ export default {
// 鼠标左击 // 鼠标左击
if (e.which === 1) { if (e.which === 1) {
var object = Fcanvas.getActiveObject(); var object = Fcanvas.getActiveObject();
console.log(Fcanvas);
console.log(object);
if (object) { if (object) {
for (let i = 0; i < Fcanvasarr.length; i++) { for (let i = 0; i < Fcanvasarr.length; i++) {
if (JSON.stringify(Fcanvasarr[i]) === JSON.stringify(object.points)) { if (JSON.stringify(Fcanvasarr[i]) === JSON.stringify(object.points)) {
...@@ -1724,10 +1928,14 @@ export default { ...@@ -1724,10 +1928,14 @@ export default {
objectCaching: false, objectCaching: false,
transparentCorners: false, transparentCorners: false,
cornerColor: "rgba(0,0,0,0)", cornerColor: "rgba(0,0,0,0)",
// 设置可选
selectable: true
}); });
// Fcanvas.viewportTransform = [0.7, 0, 0, 0.7, -50, 50]; // Fcanvas.viewportTransform = [0.7, 0, 0, 0.7, -50, 50];
Fcanvas.add(polygon); Fcanvas.add(polygon);
Fcanvasarr.push(Fcanvasline1) Fcanvasarr.push(Fcanvasline1)
console.log(Fcanvasarr);
self.Fcanvasarr = Fcanvasarr
Fcanvasline1 = [] Fcanvasline1 = []
} }
} }
...@@ -1904,6 +2112,102 @@ export default { ...@@ -1904,6 +2112,102 @@ export default {
}) })
}, },
methods: { methods: {
/**
* @description: 自动提取特征点
* @param {*}
* @return {*}
*/
async getAutoTzd (flag) {
let self = this
console.log(this.seq);
if (!sessionStorage.getItem(`auto_tzdDom${this.seq}`)) [
flag = true
]
// 从数据库中获取数据
if (flag) {
let res = await this.$axios({
method: 'get',
url: '/api/export/trait/xml/case/' + this.barcode + '/' + this.seq,
loading: false
})
console.log(res);
// 自动提取特征数组
if (res.data.code === 0) {
self.autoTzdArr = res.data.ret.fpt5LMinutiaList
self.autoTzdArr.forEach((item, index) => {
self.$set(self.autoTzdArr[index], 'id', 'auto_tzdDom' + self.tzdId)
$(
`<div id="auto_tzdDom${self.tzdId}" class="auto_tzdDom"><div class="head"></div><div class="direction"></div></div>`
).appendTo(".tzdDrawing");
$('.auto_tzdDom').css('display', 'flex')
$('.auto_tzdDom').css('align-items', 'center')
$('.auto_tzdDom').css('position', 'absolute')
$('.auto_tzdDom').css('transform-origin', 'left center')
$('.auto_tzdDom .head').css('width', '8px')
$('.auto_tzdDom .head').css('height', '8px')
$('.auto_tzdDom .head').css('border-radius', '8px')
$('.auto_tzdDom .head').css('background-color', '#FFFD0F')
$('.auto_tzdDom .direction').css('width', '20px')
$('.auto_tzdDom .direction').css('height', '2px')
$('.auto_tzdDom .direction').css('background-color', '#FFFD0F')
console.log(item.xczw_zwtzd_tzxzb);
console.log(item.xczw_zwtzd_tzyzb);
console.log(item.xczw_zwtzd_tzfx);
$(`#auto_tzdDom${self.tzdId}`).css("left", (item.xczw_zwtzd_tzxzb - 4) / self.zoomLevel + "px");
$(`#auto_tzdDom${self.tzdId}`).css("top", (item.xczw_zwtzd_tzyzb - 4) / self.zoomLevel + "px");
$(`#auto_tzdDom${self.tzdId}`).css("box-sizing", "border-box");
$("#auto_tzdDom" + self.tzdId).css("transform", `rotate(${item.xczw_zwtzd_tzfx}deg)`);
self.tzdId++
})
self.$store.commit('zwbj/setAutoTzdall', self.autoTzdArr)
// 将自动提取的特征点存入session中
sessionStorage.setItem(`auto_tzdDom${self.seq}`, JSON.stringify(self.autoTzdArr))
}
} else {
// 从session中拿
if (sessionStorage.getItem(`auto_tzdDom${this.seq}`)) {
self.autoTzdArr = JSON.parse(sessionStorage.getItem(`auto_tzdDom${this.seq}`))
self.autoTzdArr.forEach((item, index) => {
$(
`<div id="${item.id}" class="auto_tzdDom"><div class="head"></div><div class="direction"></div></div>`
).appendTo(".tzdDrawing");
$('.auto_tzdDom').css('display', 'flex')
$('.auto_tzdDom').css('align-items', 'center')
$('.auto_tzdDom').css('position', 'absolute')
$('.auto_tzdDom').css('transform-origin', 'left center')
$('.auto_tzdDom .head').css('width', '8px')
$('.auto_tzdDom .head').css('height', '8px')
$('.auto_tzdDom .head').css('border-radius', '8px')
$('.auto_tzdDom .head').css('background-color', '#FFFD0F')
$('.auto_tzdDom .direction').css('width', '20px')
$('.auto_tzdDom .direction').css('height', '2px')
$('.auto_tzdDom .direction').css('background-color', '#FFFD0F')
$(`#${item.id}`).css("left", (item.xczw_zwtzd_tzxzb - 4) / self.zoomLevel + "px");
$(`#${item.id}`).css("top", (item.xczw_zwtzd_tzyzb - 4) / self.zoomLevel + "px");
$(`#${item.id}`).css("box-sizing", "border-box");
$('#' + item.id).css("transform", `rotate(${item.xczw_zwtzd_tzfx}deg)`);
})
self.$store.commit('zwbj/setAutoTzdall', self.autoTzdArr)
// 将自动提取的特征点存入session中
sessionStorage.setItem(`auto_tzdDom${self.seq}`, JSON.stringify(self.autoTzdArr))
}
}
// if (self.autoTzdArr.length > 0) {
// if ($('.auto_tzdDom').css('display') == 'flex') {
// $('.auto_tzdDom').css('display', 'none')
// } else {
// $('.auto_tzdDom').css('display', 'flex')
// }
// return
// }
},
/*** /***
* 裁剪 * 裁剪
*/ */
...@@ -2066,7 +2370,10 @@ export default { ...@@ -2066,7 +2370,10 @@ export default {
tzdChange () { tzdChange () {
this.isHandTZD = !this.isHandTZD this.isHandTZD = !this.isHandTZD
if (this.isHandTZD) { if (this.isHandTZD) {
console.log(111);
$('.tzdDrawing').css('z-index', '99999')
} else { } else {
$('.tzdDrawing').css('z-index', '99')
} }
}, },
/** /**
...@@ -2830,8 +3137,72 @@ export default { ...@@ -2830,8 +3137,72 @@ export default {
* @return {*} * @return {*}
*/ */
changeSaveType (saveType) { changeSaveType (saveType) {
let self = this
this.saveType = saveType this.saveType = saveType
this.isShowSaveTypeOptions = false this.isShowSaveTypeOptions = false
if (this.saveType === '当前特征') {
self.tzdall = []
// let tzdall = self.tzdArr.concat(self.autoTzdArr)
if (self.tzdArr.length > 0) {
self.tzdArr.forEach(item => {
self.tzdall.push({
zwtzd_tzfx: item.angle,
zwzxd_tzxzb: item.x,
zwzxd_tzyzb: item.y
})
})
}
if (self.autoTzdArr.length > 0) {
self.tzdall.concat(self.autoTzdArr)
}
console.log(self.tzdall);
// 处理数据--圆
let circleArr_hand_t = []
self.circleArr_hand.forEach(item => {
circleArr_hand_t.push({
yxtq_yxxzb: item.x,
yxtq_yxyzb: item.y,
yxtq_yxbj: item.radius
})
})
// TODO
// 处理数据---自由
let Fcanvasarr_t = []
self.Fcanvasarr.forEach(item => {
Fcanvasarr_t.push({
})
})
self.fpt5LMinutiaList = []
self.fpt5LMinutiaList.push(self.circleArr_hand)
self.fpt5LMinutiaList.push(self.Fcanvasarr)
console.log(self.fpt5LMinutiaList);
let fpt5TraitMinutiaList = {
fpt5TraitMinutiaList: self.tzdall,
zwzwdm: self.seq > 9 ? self.seq : ('0' + self.seq),
fpt5LMinutiaList: self.fpt5LMinutiaList
}
console.log(8888);
this.$axios({
method: 'post',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
},
url: '/api/upload/trait/case?barcode=' + self.barcode + '&seq=' + self.seq,
data: JSON.stringify(fpt5TraitMinutiaList),
loading: false
}).then(res => {
console.log(res);
if (res.data.message == 'success') {
self.$message.success('保存成功！')
}
})
}
}, },
/** /**
* @description: 是否展示选择保存类型对话框 * @description: 是否展示选择保存类型对话框
...@@ -3218,14 +3589,16 @@ export default { ...@@ -3218,14 +3589,16 @@ export default {
* @return {*} * @return {*}
*/ */
onchangePreview () { onchangePreview () {
this.isShowSourcePrivew = !this.isShowSourcePrivew if (this.isSLT) {
if (this.isShowSourcePrivew) { this.isShowSourcePrivew = !this.isShowSourcePrivew
// 转换canvas为base64图片贴到缩略图中 if (this.isShowSourcePrivew) {
setTimeout(() => { // 转换canvas为base64图片贴到缩略图中
let dataURL = this.imageEditor.toDataURL() setTimeout(() => {
console.log(dataURL); let dataURL = this.imageEditor.toDataURL()
this.previewSource = dataURL console.log(dataURL);
}, 200); this.previewSource = dataURL
}, 200);
}
} }
}, },
/** /**
......
src/views/drFPTX/Index.vue
...@@ -812,11 +812,13 @@ export default { ...@@ -812,11 +812,13 @@ export default {
this.nowSelectData = val; this.nowSelectData = val;
}, },
checkRightAll (val) { checkRightAll (val) {
console.log('val111', val) // console.log('val111', val)
this.nowSelectRightData = val; this.nowSelectRightData = val;
}, },
// 选中 // 选中
handelSelect () { handelSelect () {
// this.checkRightAll(this.nowSelectData)
// this.nowSelectRightData.push(this.nowSelectData)
this.selectArr = this.handleConcatArr(this.selectArr, this.nowSelectData) this.selectArr = this.handleConcatArr(this.selectArr, this.nowSelectData)
this.nowSelectRightData = this.selectArr this.nowSelectRightData = this.selectArr
this.handleRemoveTabList(this.nowSelectData, this.datas); this.handleRemoveTabList(this.nowSelectData, this.datas);
......
src/views/drFPTX/RAList.vue
...@@ -6,9 +6,15 @@ ...@@ -6,9 +6,15 @@
<el-radio :label="1">人员</el-radio> <el-radio :label="1">人员</el-radio>
<el-radio :label="2">案件</el-radio> <el-radio :label="2">案件</el-radio>
</el-radio-group> </el-radio-group>
<div class="search barcode"> <div class='search barcode'>
<div class="item">条码号：</div> <div class='item'> 条码号：</div>
<el-input placeholder="请输入条码号" v-model="barcode" clearable> <el-input
placeholder="请输入条码号"
v-model="barcode"
maxlength="23"
show-word-limit
clearable
>
</el-input> </el-input>
</div> </div>
<div class="search ljfk"> <div class="search ljfk">
...@@ -23,9 +29,15 @@ ...@@ -23,9 +29,15 @@
</el-option> </el-option>
</el-select> </el-select>
</div> </div>
<div class="search taskNumber"> <div class='search taskNumber'>
<div class="item">任务号：</div> <div class='item'> 任务号：</div>
<el-input placeholder="请输入任务号" v-model="taskNumber" clearable> <el-input
placeholder="请输入任务号"
v-model="taskNumber"
maxlength="14"
show-word-limit
clearable
>
</el-input> </el-input>
</div> </div>
<div class="search rkzt"> <div class="search rkzt">
...@@ -51,10 +63,19 @@ ...@@ -51,10 +63,19 @@
</el-date-picker> </el-date-picker>
</div> </div>
</div> </div>
<div class="head" v-if="showType == 2"> <div
<div class="search barcode"> class='head'
<div class="item">条码号：</div> v-if="showType==2"
<el-input placeholder="请输入条码号" v-model="barcode" clearable> >
<div class='search barcode'>
<div class='item'> 条码号：</div>
<el-input
placeholder="请输入条码号"
v-model="barcode"
maxlength="23"
show-word-limit
clearable
>
</el-input> </el-input>
</div> </div>
<div class="search ljfk"> <div class="search ljfk">
......
src/views/login/Login1.vue
<template> <template>
<div id="homepage_hero_module" class="homepage_hero_module"> <div id="homepage_hero_module" class="homepage_hero_module">
<div class="video_container"> <!-- <div class="video_container">-->
<!-- <div :style="fixStyle" class="filter"></div>--> <!-- &lt;!&ndash; <div :style="fixStyle" class="filter"></div>&ndash;&gt;-->
<!-- autoplay 自动播放 loop 循环播放 muted 静音播放--> <!-- &lt;!&ndash; autoplay 自动播放 loop 循环播放 muted 静音播放&ndash;&gt;-->
<!-- <video autoplay loop muted class="fillWidth" v-on:canplay="canplay">--> <!-- &lt;!&ndash; <video autoplay loop muted class="fillWidth" v-on:canplay="canplay">&ndash;&gt;-->
<!-- <source :src="barcgroundUrl" type="video/mp4" />--> <!-- &lt;!&ndash; <source :src="barcgroundUrl" type="video/mp4" />&ndash;&gt;-->
<!-- 浏览器不支持 video 标签，建议升级浏览器。--> <!-- &lt;!&ndash; 浏览器不支持 video 标签，建议升级浏览器。&ndash;&gt;-->
<!-- </video>--> <!-- &lt;!&ndash; </video>&ndash;&gt;-->
<!-- &lt;!&ndash; todo 视频加载切换为图片加载 &ndash;&gt;--> <!-- &lt;!&ndash; &lt;!&ndash; todo 视频加载切换为图片加载 &ndash;&gt;&ndash;&gt;-->
<!-- &lt;!&ndash; 考虑视频加载失败 图片背景效果 &ndash;&gt;--> <!-- &lt;!&ndash; &lt;!&ndash; 考虑视频加载失败 图片背景效果 &ndash;&gt;&ndash;&gt;-->
<!-- <div class="poster hidden" v-if="!vedioCanPlay">--> <!-- &lt;!&ndash; <div class="poster hidden" v-if="!vedioCanPlay">&ndash;&gt;-->
<!-- <img :style="fixStyle" :src="barcgroundImgUrl" alt="" />--> <!-- &lt;!&ndash; <img :style="fixStyle" :src="barcgroundImgUrl" alt="" />&ndash;&gt;-->
<!-- </div>--> <!-- &lt;!&ndash; </div>&ndash;&gt;-->
<img src="@/assets/img/login/login.gif" /> <!-- -->
</div> <!-- </div>-->
<transition name="slide_fade"> <img class="video_container" src="@/assets/img/login/login.gif" />
<div :style="drawerStyle" class="login_main_layer" v-if="isShow"> <div :style="drawerStyle" class="login_main_layer" ref="loginWindow">
<transition name="login_fade"> <div>
<div v-if="loginShow"> <div class=" login_top_layer middle">
<div class=" login_top_layer middle"> <el-image class="login_emblem middle" :src="emblemUrl"></el-image>
<el-image class="login_emblem middle" :src="emblemUrl"></el-image> <br />
<br /> <el-image class="login_system middle" :src="systemUrl"></el-image>
<el-image class="login_system middle" :src="systemUrl"></el-image> </div>
</div> <div class=" middle margin_top25_bottom10">
<div class=" middle margin_top25_bottom10"> <el-button
<el-button class="magin_left_right30"
class="magin_left_right30" :class="{ active: loginType.accountStatus }"
:class="{ active: loginType.accountStatus }" :autofocus="true"
:autofocus="true" type="text"
type="text" @click="changeLoginType(1)"
@click="changeLoginType(1)" >帐号密码登录
>帐号密码登录 </el-button>
</el-button> <span class="font_color">|</span>
<span class="font_color">|</span> <el-button
<el-button class="magin_left_right30"
class="magin_left_right30" type="text"
type="text" :class="{ active: loginType.keyStatus }"
:class="{ active: loginType.keyStatus }" @click="changeLoginType(2)"
@click="changeLoginType(2)" >KEY登录
>KEY登录 </el-button>
</el-button> </div>
</div> <div>
<div> <accountsLogin :login-type="loginType.accountStatus"></accountsLogin>
<accountsLogin </div>
:login-type="loginType.accountStatus" <div>
></accountsLogin> <keyLogin :login-type="loginType.keyStatus"></keyLogin>
</div>
<div>
<keyLogin :login-type="loginType.keyStatus"></keyLogin>
</div>
</div>
</transition>
<div class="login_bottom_layer middle ">
<span class=" font_color"
>Copyright&nbsp;©&nbsp;2021&nbsp;Founder</span
>
</div> </div>
</div> </div>
</transition> <div class="login_bottom_layer middle ">
<span class=" font_color">Copyright&nbsp;©&nbsp;2021&nbsp;Founder</span>
</div>
</div>
</div> </div>
</template> </template>
...@@ -74,8 +67,7 @@ export default { ...@@ -74,8 +67,7 @@ export default {
data() { data() {
return { return {
isShow: false, isShow: true,
loginShow: false,
// drawerHeight: null, // drawerHeight: null,
barcgroundUrl: require("../../assets/video/login.mp4"), barcgroundUrl: require("../../assets/video/login.mp4"),
barcgroundImgUrl: require("../../assets/img/login/background.png"), barcgroundImgUrl: require("../../assets/img/login/background.png"),
...@@ -110,15 +102,18 @@ export default { ...@@ -110,15 +102,18 @@ export default {
}, },
created() { created() {
var me = this; var me = this;
console.log(this.$refs.loginWindow);
// 动画加载时间 // 动画加载时间
setTimeout(() => { // setTimeout(() => {
me.isShow = true; // me.isShow = true;
}, 1000); // }, 1000);
setTimeout(() => {
me.loginShow = true;
}, 3000);
}, },
mounted() { mounted() {
this.$nextTick(() => {
console.log(this.$refs.loginWindow);
this.$refs.loginWindow.right = "0px";
});
this.loginType.accountStatus = true; this.loginType.accountStatus = true;
if (localStorage.getItem("token") !== null) { if (localStorage.getItem("token") !== null) {
this.$router.push("/Home/Home"); this.$router.push("/Home/Home");
...@@ -177,6 +172,8 @@ export default { ...@@ -177,6 +172,8 @@ export default {
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
overflow: hidden; overflow: hidden;
background: rgba(36, 54, 76, 0.5);
position: relative;
} }
.homepage_hero_module img { .homepage_hero_module img {
width: 100%; width: 100%;
...@@ -224,6 +221,7 @@ video { ...@@ -224,6 +221,7 @@ video {
} */ } */
.video_container { .video_container {
height: 100%; height: 100%;
width: 100%;
} }
.video_container .poster img, .video_container .poster img,
.video_container video { .video_container video {
...@@ -238,30 +236,30 @@ video { ...@@ -238,30 +236,30 @@ video {
/*opacity: 0.5;*/ /*opacity: 0.5;*/
} }
/*滑动进入*/ /*!*滑动进入*!*/
/* 可以设置不同的进入和离开动画 */ /*!* 可以设置不同的进入和离开动画 *!*/
/* 设置动画持续时间和动画函数 */ /*!* 设置动画持续时间和动画函数 *!*/
.slide_fade-enter-active { /*.slide_fade-enter-active {*/
transition: all 2s ease; /* transition: all 2s ease;*/
} /*}*/
.slide_fade-leave-active { /*.slide_fade-leave-active {*/
transition: all 0.8s cubic-bezier(1, 0.5, 0.8, 1); /* transition: all 0.8s cubic-bezier(1, 0.5, 0.8, 1);*/
} /*}*/
.slide_fade-enter, .slide_fade-leave-to /*.slide_fade-enter, .slide_fade-leave-to*/
/* .slide-fade-leave-active for below version 2.1.8 */ /* !* .slide-fade-leave-active for below version 2.1.8 *!*/
{ /* {*/
transform: translateX(1000px); /* !*transform: translateX(100%);*!*/
opacity: 0; /* !*opacity: 0;*!*/
} /*}*/
/*淡入淡出*/ /*!*淡入淡出*!*/
.login_fade-enter-active, /*.login_fade-enter-active,*/
.login_-leave-active { /*.login_-leave-active {*/
/* opacity 透明度 */ /* !* opacity 透明度 *!*/
transition: opacity 2s; /* transition: opacity 2s;*/
} /*}*/
/* .fade-leave-active, 2.1.8 版本以下 */ /* .fade-leave-active, 2.1.8 版本以下 */
.login_fade-enter, .login_fade-enter,
...@@ -269,33 +267,33 @@ video { ...@@ -269,33 +267,33 @@ video {
opacity: 0; opacity: 0;
} }
@keyframes fade-in { /*@keyframes fade-in {*/
0% { /* 0% {*/
opacity: 0; /* opacity: 0;*/
} /* }*/
/*初始状态 透明度为0*/ /* !*初始状态 透明度为0*!*/
40% { /* 40% {*/
opacity: 0; /* opacity: 0;*/
} /* }*/
/*过渡状态 透明度为0*/ /* !*过渡状态 透明度为0*!*/
100% { /* 100% {*/
opacity: 1; /* opacity: 1;*/
} /* }*/
/*结束状态 透明度为1*/ /* !*结束状态 透明度为1*!*/
} /*}*/
@-webkit-keyframes fade-in { /*@-webkit-keyframes fade-in {*/
/*针对webkit内核*/ /* !*针对webkit内核*!*/
0% { /* 0% {*/
opacity: 0; /* opacity: 0;*/
} /* }*/
40% { /* 40% {*/
opacity: 0; /* opacity: 0;*/
} /* }*/
100% { /* 100% {*/
opacity: 1; /* opacity: 1;*/
} /* }*/
} /*}*/
/*#wrapper {*/ /*#wrapper {*/
/* animation: fade-in;!*动画名称*!*/ /* animation: fade-in;!*动画名称*!*/
...@@ -307,11 +305,12 @@ video { ...@@ -307,11 +305,12 @@ video {
height: 100%; height: 100%;
width: 600px; width: 600px;
position: absolute; position: absolute;
right: 0; right: -600px;
top: 0; top: 0;
z-index: 4; z-index: 4;
/*opacity: 0.5;*/ /*opacity: 0.5;*/
background: rgba(36, 54, 76, 0.5); background: rgba(36, 54, 76, 0.5);
transition: all 2s;
/*background-color: #24364c;*/ /*background-color: #24364c;*/
} }
...@@ -334,6 +333,7 @@ video { ...@@ -334,6 +333,7 @@ video {
z-index: 10; z-index: 10;
margin-bottom: 10px; margin-bottom: 10px;
opacity: 1; opacity: 1;
background: rgba(36, 54, 76, 0);
} }
.login_system { .login_system {
...@@ -341,11 +341,13 @@ video { ...@@ -341,11 +341,13 @@ video {
height: 55px; height: 55px;
opacity: 1; opacity: 1;
z-index: 10; z-index: 10;
background: rgba(36, 54, 76, 0);
} }
.login_top_layer { .login_top_layer {
margin-top: 20%; margin-top: 20%;
margin-bottom: 50px; margin-bottom: 50px;
background: rgba(36, 54, 76, 0);
} }
.login_bottom_layer { .login_bottom_layer {
......
vue.config.js
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-09-07 09:57:48 * @Date: 2021-09-07 09:57:48
* @LastEditTime: 2021-11-08 20:01:14 * @LastEditTime: 2021-11-10 09:47:04
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \指纹系统\founder_vue\vue.config.js * @FilePath: \指纹系统\founder_vue\vue.config.js
...@@ -92,13 +92,12 @@ module.exports = { ...@@ -92,13 +92,12 @@ module.exports = {
// target: "http://192.168.0.137:8080/", //统一的请求头部每次修改都要重启才会生效 http://39.99.224.27:8006/ // target: "http://192.168.0.137:8080/", //统一的请求头部每次修改都要重启才会生效 http://39.99.224.27:8006/
// target: "http://172.18.108.2:8099/", // 张 认定 // target: "http://172.18.108.2:8099/", // 张 认定
// target: "http://192.168.128.112:8099", // 湖南-张 // target: "http://192.168.128.112:8099", // 湖南-张
// target: "http://192.168.128.114:8099", // 湖南-马 target: "http://192.168.128.114:8099", // 湖南-马
// target: "http://192.168.128.116:8099", // 湖南-王 // target: "http://192.168.128.116:8099", // 湖南-王
// target: "http://172.18.116.73:8099/", //统一的请求头部每次修改都要重启才会生效 http://39.99.224.27:8006/ ma // target: "http://172.18.116.73:8099/", //统一的请求头部每次修改都要重启才会生效 http://39.99.224.27:8006/ ma
// target: "http://127.0.0.1:8099", // target: "http://127.0.0.1:8099",
// target: "http://47.92.225.109:5602", // target: "http://47.92.225.109:5602",
// target: "http://192.168.128.109:8765", // 湖南-王 // target: "http://www.meetfood.cn:2390/", // 湖南-线上
target: "http://www.meetfood.cn:2390/", // 湖南-线上
ws: true, ws: true,
changeOrigin: true, changeOrigin: true,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment