parent
8fa5d47611
commit
a573ee9a56
|
@ -10,7 +10,7 @@
|
||||||
</el-row>
|
</el-row>
|
||||||
<div class="compare-class" v-loading="isReloadData">
|
<div class="compare-class" v-loading="isReloadData">
|
||||||
<el-card style="width: 50%;" ref="old">
|
<el-card style="width: 50%;" ref="old">
|
||||||
<el-form :model="oldData" :rules="rule" ref="httpForm" label-width="80px" label-position="right" :disabled="true">
|
<el-form :model="oldData" :rules="rule" ref="httpForm" label-width="80px" label-position="right" >
|
||||||
<!-- 操作按钮 -->
|
<!-- 操作按钮 -->
|
||||||
<ms-form-divider :title="$t('test_track.plan_view.base_info')"/>
|
<ms-form-divider :title="$t('test_track.plan_view.base_info')"/>
|
||||||
|
|
||||||
|
@ -19,14 +19,14 @@
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="8">
|
<el-col :span="8">
|
||||||
<el-form-item :label="$t('commons.name')" prop="name">
|
<el-form-item :label="$t('commons.name')" prop="name">
|
||||||
<el-input class="ms-http-input" size="small" v-model="oldData.name"/>
|
<el-input class="ms-http-input" size="small" v-model="oldData.name" :disabled="true"/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="16">
|
<el-col :span="16">
|
||||||
<el-form-item :label="$t('api_report.request')" prop="path">
|
<el-form-item :label="$t('api_report.request')" prop="path">
|
||||||
<el-input :placeholder="$t('api_test.definition.request.path_info')" v-model="oldData.path"
|
<el-input :placeholder="$t('api_test.definition.request.path_info')" v-model="oldData.path" :disabled="true"
|
||||||
class="ms-http-input" size="small" style="margin-top: 5px" >
|
class="ms-http-input" size="small" style="margin-top: 5px" >
|
||||||
<el-select v-model="oldData.method" slot="prepend" style="width: 100px" size="small">
|
<el-select v-model="oldData.method" slot="prepend" style="width: 100px" size="small" :disabled="true">
|
||||||
<el-option v-for="item in reqOptions" :key="item.id" :label="item.label" :value="item.id"/>
|
<el-option v-for="item in reqOptions" :key="item.id" :label="item.label" :value="item.id"/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-input>
|
</el-input>
|
||||||
|
@ -38,7 +38,7 @@
|
||||||
<el-col :span="8">
|
<el-col :span="8">
|
||||||
<el-form-item :label="$t('api_test.definition.request.responsible')" prop="userId">
|
<el-form-item :label="$t('api_test.definition.request.responsible')" prop="userId">
|
||||||
<el-select v-model="oldData.userId"
|
<el-select v-model="oldData.userId"
|
||||||
:placeholder="$t('api_test.definition.request.responsible')" filterable size="small"
|
:placeholder="$t('api_test.definition.request.responsible')" filterable size="small" :disabled="true"
|
||||||
class="ms-http-select">
|
class="ms-http-select">
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in maintainerOptions"
|
v-for="item in maintainerOptions"
|
||||||
|
@ -58,7 +58,7 @@
|
||||||
|
|
||||||
<el-col :span="8">
|
<el-col :span="8">
|
||||||
<el-form-item :label="$t('commons.status')" prop="status">
|
<el-form-item :label="$t('commons.status')" prop="status">
|
||||||
<el-select class="ms-http-select" size="small" v-model="oldData.status">
|
<el-select class="ms-http-select" size="small" v-model="oldData.status" :disabled="true">
|
||||||
<el-option v-for="item in options" :key="item.id" :label="$t(item.label)" :value="item.id"/>
|
<el-option v-for="item in options" :key="item.id" :label="$t(item.label)" :value="item.id"/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
@ -76,7 +76,7 @@
|
||||||
v-model="oldData.description"
|
v-model="oldData.description"
|
||||||
type="textarea"
|
type="textarea"
|
||||||
:autosize="{ minRows: 1, maxRows: 10}"
|
:autosize="{ minRows: 1, maxRows: 10}"
|
||||||
:rows="1" size="small"/>
|
:rows="1" size="small" :disabled="true"/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
@ -130,7 +130,7 @@
|
||||||
|
|
||||||
</el-card>
|
</el-card>
|
||||||
<el-card style="width: 50%;" ref="new">
|
<el-card style="width: 50%;" ref="new">
|
||||||
<el-form :model="newData" :rules="rule" ref="httpForm" label-width="80px" label-position="right" :disabled="true">
|
<el-form :model="newData" :rules="rule" ref="httpForm" label-width="80px" label-position="right" >
|
||||||
<ms-form-divider :title="$t('test_track.plan_view.base_info')"/>
|
<ms-form-divider :title="$t('test_track.plan_view.base_info')"/>
|
||||||
|
|
||||||
<!-- 基础信息 -->
|
<!-- 基础信息 -->
|
||||||
|
@ -139,14 +139,14 @@
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="8">
|
<el-col :span="8">
|
||||||
<el-form-item :label="$t('commons.name')" prop="name">
|
<el-form-item :label="$t('commons.name')" prop="name">
|
||||||
<el-input class="ms-http-input" size="small" v-model="newData.name"/>
|
<el-input class="ms-http-input" size="small" v-model="newData.name" :disabled="true"/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="16">
|
<el-col :span="16">
|
||||||
<el-form-item :label="$t('api_report.request')" prop="path">
|
<el-form-item :label="$t('api_report.request')" prop="path">
|
||||||
<el-input :placeholder="$t('api_test.definition.request.path_info')" v-model="newData.path"
|
<el-input :placeholder="$t('api_test.definition.request.path_info')" v-model="newData.path" :disabled="true"
|
||||||
class="ms-http-input" size="small" style="margin-top: 5px" >
|
class="ms-http-input" size="small" style="margin-top: 5px" >
|
||||||
<el-select v-model="newData.method" slot="prepend" style="width: 100px" size="small">
|
<el-select v-model="newData.method" slot="prepend" style="width: 100px" size="small" :disabled="true">
|
||||||
<el-option v-for="item in reqOptions" :key="item.id" :label="item.label" :value="item.id"/>
|
<el-option v-for="item in reqOptions" :key="item.id" :label="item.label" :value="item.id"/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-input>
|
</el-input>
|
||||||
|
@ -158,7 +158,7 @@
|
||||||
<el-col :span="8">
|
<el-col :span="8">
|
||||||
<el-form-item :label="$t('api_test.definition.request.responsible')" prop="userId">
|
<el-form-item :label="$t('api_test.definition.request.responsible')" prop="userId">
|
||||||
<el-select v-model="newData.userId"
|
<el-select v-model="newData.userId"
|
||||||
:placeholder="$t('api_test.definition.request.responsible')" filterable size="small"
|
:placeholder="$t('api_test.definition.request.responsible')" filterable size="small" :disabled="true"
|
||||||
class="ms-http-select">
|
class="ms-http-select">
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in maintainerOptions"
|
v-for="item in maintainerOptions"
|
||||||
|
@ -178,7 +178,7 @@
|
||||||
|
|
||||||
<el-col :span="8">
|
<el-col :span="8">
|
||||||
<el-form-item :label="$t('commons.status')" prop="status">
|
<el-form-item :label="$t('commons.status')" prop="status">
|
||||||
<el-select class="ms-http-select" size="small" v-model="newData.status">
|
<el-select class="ms-http-select" size="small" v-model="newData.status" :disabled="true">
|
||||||
<el-option v-for="item in options" :key="item.id" :label="$t(item.label)" :value="item.id"/>
|
<el-option v-for="item in options" :key="item.id" :label="$t(item.label)" :value="item.id"/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
@ -196,7 +196,7 @@
|
||||||
v-model="newData.description"
|
v-model="newData.description"
|
||||||
type="textarea"
|
type="textarea"
|
||||||
:autosize="{ minRows: 1, maxRows: 10}"
|
:autosize="{ minRows: 1, maxRows: 10}"
|
||||||
:rows="1" size="small"/>
|
:rows="1" size="small" :disabled="true"/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
@ -361,6 +361,8 @@ export default{
|
||||||
this.oldColor = "rgb(241,200,196,0.45)"
|
this.oldColor = "rgb(241,200,196,0.45)"
|
||||||
this.newColor = "rgb(121, 225, 153,0.3)";
|
this.newColor = "rgb(121, 225, 153,0.3)";
|
||||||
}
|
}
|
||||||
|
console.log(this.$refs.old)
|
||||||
|
console.log(this.$refs.new)
|
||||||
diff(oldVnode,vnode,this.oldColor,this.newColor);
|
diff(oldVnode,vnode,this.oldColor,this.newColor);
|
||||||
this.isReloadData = false
|
this.isReloadData = false
|
||||||
},
|
},
|
||||||
|
|
|
@ -286,14 +286,22 @@ function diffDetail(oldVnode,newVnode,diffNode){
|
||||||
//剩最后的子节点的时候,分类型做判断(注意,最后的子节点的真实dom里可能还有dom节点)
|
//剩最后的子节点的时候,分类型做判断(注意,最后的子节点的真实dom里可能还有dom节点)
|
||||||
if(isUndef(oldVnode.child)&&isUndef(newVnode.child)&&isUndef(oldVnode.children)&&isUndef(newVnode.children)){
|
if(isUndef(oldVnode.child)&&isUndef(newVnode.child)&&isUndef(oldVnode.children)&&isUndef(newVnode.children)){
|
||||||
//比较真实的dom
|
//比较真实的dom
|
||||||
diffRealNode(oldVnode.elm,newVnode.elm,diffNode);
|
if(oldVnode.elm.parentNode.className==="ms-body"){
|
||||||
|
console.log("到了")
|
||||||
|
}
|
||||||
|
//最子节点比较结果
|
||||||
|
let childDiff=[];
|
||||||
|
diffRealNode(oldVnode.elm,newVnode.elm,diffNode,childDiff);
|
||||||
|
if(childDiff.length===0){
|
||||||
|
diffNodeContext(oldVnode,newVnode,diffNode)
|
||||||
|
}
|
||||||
if(isDef(oldVnode.text)&&isDef(newVnode.text)){
|
if(isDef(oldVnode.text)&&isDef(newVnode.text)){
|
||||||
if(oldVnode.text!==newVnode.text){
|
if(oldVnode.text!==newVnode.text){
|
||||||
diffNode.oldNodeArray.push(oldVnode.elm);
|
diffNode.oldNodeArray.push(oldVnode.elm);
|
||||||
diffNode.nodeArray.push(newVnode.elm);
|
diffNode.nodeArray.push(newVnode.elm);
|
||||||
}
|
}
|
||||||
}else if(isDef(oldVnode.tag)&&isDef(newVnode.tag)){
|
}
|
||||||
|
else if(isDef(oldVnode.tag)&&isDef(newVnode.tag)){
|
||||||
if(oldVnode.tag==='input'&&newVnode.tag==='input'){
|
if(oldVnode.tag==='input'&&newVnode.tag==='input'){
|
||||||
if(oldVnode.elm.value!==newVnode.elm.value){
|
if(oldVnode.elm.value!==newVnode.elm.value){
|
||||||
diffNode.oldNodeArray.push(oldVnode.elm);
|
diffNode.oldNodeArray.push(oldVnode.elm);
|
||||||
|
@ -323,7 +331,24 @@ function diffDetail(oldVnode,newVnode,diffNode){
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function diffRealNode(oldNode,newNode,diffNode){
|
|
||||||
|
function diffNodeContext(oldNode,newNode,diffNode){
|
||||||
|
if(isDef(oldNode.context)&&isDef(newNode.context)){
|
||||||
|
if(isDef(oldNode.context.value)||isDef(newNode.context.value)){
|
||||||
|
if(isDef(oldNode.context.value)&&isDef(newNode.context.value)){
|
||||||
|
if(oldNode.context.value!==newNode.context.value){
|
||||||
|
diffNode.oldNodeArray.push(oldNode.elm);
|
||||||
|
diffNode.nodeArray.push(newNode.elm);
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
diffNode.oldNodeArray.push(oldNode.elm);
|
||||||
|
diffNode.nodeArray.push(newNode.elm);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function diffRealNode(oldNode,newNode,diffNode,childDiff){
|
||||||
let oldNodeLength = oldNode.childNodes.length;
|
let oldNodeLength = oldNode.childNodes.length;
|
||||||
let newNodeLength = newNode.childNodes.length;
|
let newNodeLength = newNode.childNodes.length;
|
||||||
let childrenLength = Math.min(oldNodeLength, newNodeLength);
|
let childrenLength = Math.min(oldNodeLength, newNodeLength);
|
||||||
|
@ -331,9 +356,12 @@ function diffRealNode(oldNode,newNode,diffNode){
|
||||||
let oldnode = oldNode.childNodes[i]
|
let oldnode = oldNode.childNodes[i]
|
||||||
let newnode = newNode.childNodes[i]
|
let newnode = newNode.childNodes[i]
|
||||||
if(oldnode.childNodes.length>0&&newnode.childNodes.length>0){
|
if(oldnode.childNodes.length>0&&newnode.childNodes.length>0){
|
||||||
diffRealNode(oldnode,newnode,diffNode)
|
diffRealNode(oldnode,newnode,diffNode,childDiff);
|
||||||
}else {
|
}else {
|
||||||
diffRealNodeDetail(oldnode,newnode,diffNode);
|
let _isSameChild = diffRealNodeDetail(oldnode,newnode,diffNode);
|
||||||
|
if(!_isSameChild){
|
||||||
|
childDiff.push(_isSameChild)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
for (let i = childrenLength; i < oldNodeLength; i++) {
|
for (let i = childrenLength; i < oldNodeLength; i++) {
|
||||||
|
@ -400,8 +428,13 @@ function diffRealNodeDetail(oldNode,newNode,diffNode){
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
//如果他们都是0,证明比较到这时,都是相同的
|
||||||
|
if(oldNode.childNodes.length===0&&newNode.childNodes.length===0){
|
||||||
|
return true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
function sameVnode (a, b) {
|
function sameVnode (a, b) {
|
||||||
return (
|
return (
|
||||||
|
|
Loading…
Reference in New Issue