|
@@ -1,15 +1,20 @@
|
|
|
<template>
|
|
|
- <div v-if="showOverlay" style="position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;background-color: rgba(0, 0, 0, 0.5);z-index: 999; "></div>
|
|
|
+ <div v-if="showOverlay"
|
|
|
+ style="position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;background-color: rgba(0, 0, 0, 0.5);z-index: 999; "></div>
|
|
|
<div class="query-index">
|
|
|
- <div data-v-step="1" :style="showOverlay && curStepVal==1?'margin:auto;width:660px;padding:10px; z-index:1000;display:inline-block;height:50px;background:white;':'margin:auto;width: 600px;padding:10px;'" >
|
|
|
- <a-space >
|
|
|
- <QueryHistoryComplete id="keyName" v-model:value="formState.defaultKeyString" style="width: 500px"></QueryHistoryComplete>
|
|
|
+ <div data-v-step="1"
|
|
|
+ :style="showOverlay && curStepVal==1?'margin:auto;width:660px;padding:10px; z-index:1000;display:inline-block;height:50px;background:white;':'margin:auto;width: 600px;padding:10px;'">
|
|
|
+ <a-space>
|
|
|
+ <QueryHistoryComplete id="keyName" v-model:value="formState.defaultKeyString"
|
|
|
+ style="width: 500px"></QueryHistoryComplete>
|
|
|
<a-button type="primary" html-type="submit" @click="getQuery">查询</a-button>
|
|
|
- <a-button @click="() => {formRef.resetFields();}" >重置</a-button>
|
|
|
- <a-divider orientation="center" @click="formState.showMoreQuery=!formState.showMoreQuery;" >
|
|
|
- <template v-if="!formState.showMoreQuery" >
|
|
|
+ <a-button @click="() => {formRef.resetFields();}">重置</a-button>
|
|
|
+ <QuestionCircleOutlined title="查看帮助" @click="showHelp"
|
|
|
+ :style="{fontSize: '20px',display:'contents',cursor:'pointer'}"/>
|
|
|
+ <a-divider orientation="center" @click="formState.showMoreQuery=!formState.showMoreQuery;">
|
|
|
+ <template v-if="!formState.showMoreQuery">
|
|
|
更多查询
|
|
|
- <DoubleRightOutlined rotate="90" />
|
|
|
+ <DoubleRightOutlined rotate="90"/>
|
|
|
</template>
|
|
|
<template v-else>
|
|
|
收 起
|
|
@@ -19,50 +24,51 @@
|
|
|
</a-space>
|
|
|
|
|
|
</div>
|
|
|
- <v-tour name="queryTour" style="z-index: 1000;" :steps="steps" :options="myOptions" :callbacks="myCallbacks"></v-tour>
|
|
|
+ <v-tour name="queryTour" style=" z-index: 1000;" :steps="steps" :options="myOptions"
|
|
|
+ :callbacks="myCallbacks"></v-tour>
|
|
|
|
|
|
<div data-v-step="2" v-show="formState.showMoreQuery"
|
|
|
- :style="showOverlay && curStepVal==2?'margin:auto;width:500px;padding:10px 10px 10px 50px; z-index:1000;display:inline-block;height:390px;background:white;':'margin:auto;width: 500px;padding:10px 10px 10px 50px;'" >
|
|
|
- <a-divider orientation="left" ><b style="color:#4E61D0">1.输入检索控制条件</b></a-divider>
|
|
|
- <a-row :gutter="24">
|
|
|
- <a-col :span="24">
|
|
|
- <div class="col-title">组织单位:</div>
|
|
|
- <a-input v-model:value="formState.org_name_a1" style="width: 400px"></a-input>
|
|
|
- </a-col>
|
|
|
- <a-col :span="24">
|
|
|
- <div class="col-title">作业区/项目部:</div>
|
|
|
- <a-input v-model:value="formState.bz_dwmc" style="width: 400px"></a-input>
|
|
|
- </a-col>
|
|
|
- <a-col :span="24">
|
|
|
- <div class="col-title">井名:</div>
|
|
|
- <a-input v-model:value="formState.well_common_name" style="width: 400px"></a-input>
|
|
|
- </a-col>
|
|
|
- <a-col :span="24">
|
|
|
- <div class="col-title">地层名称:</div>
|
|
|
- <a-input v-model:value="formState.formation_name" style="width: 400px"></a-input>
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
+ :style="showOverlay && curStepVal==2?'margin:auto;width:500px;padding:10px 10px 10px 50px; z-index:1000;display:inline-block;height:390px;background:white;':'margin:auto;width: 500px;padding:10px 10px 10px 50px;'">
|
|
|
+ <a-divider orientation="left"><b style="color:#4E61D0">1.输入检索控制条件</b></a-divider>
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="24">
|
|
|
+ <div class="col-title">组织单位:</div>
|
|
|
+ <a-input v-model:value="formState.org_name_a1" style="width: 400px"></a-input>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24">
|
|
|
+ <div class="col-title">作业区/项目部:</div>
|
|
|
+ <a-input v-model:value="formState.bz_dwmc" style="width: 400px"></a-input>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24">
|
|
|
+ <div class="col-title">井名:</div>
|
|
|
+ <a-input v-model:value="formState.well_common_name" style="width: 400px"></a-input>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24">
|
|
|
+ <div class="col-title">地层名称:</div>
|
|
|
+ <a-input v-model:value="formState.formation_name" style="width: 400px"></a-input>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
</div>
|
|
|
<div data-v-step="3" v-show="formState.showMoreQuery"
|
|
|
- :style="showOverlay && curStepVal==3?'margin:auto;width:500px;padding:10px; z-index:1000;display:inline-block;min-height:200px;background:white;':'margin:auto;width: 500px;padding:10px;'" >
|
|
|
+ :style="showOverlay && curStepVal==3?'margin:auto;width:500px;padding:10px; z-index:1000;display:inline-block;min-height:200px;background:white;':'margin:auto;width: 500px;padding:10px;'">
|
|
|
<a-divider orientation="left"><b style="color:#4E61D0">2.输入检索内容条件</b></a-divider>
|
|
|
<a-row :gutter="24">
|
|
|
- <a-col :span="24" class="query-row" v-for="(it,index) in limiters">
|
|
|
- <div class="col-title">
|
|
|
- <a-select v-model:value="it.relation" :options="operTexts" class="operTexts"></a-select>
|
|
|
- </div>
|
|
|
- <a-select v-model:value="it.fields" :options="fieldList" class="operTexts"></a-select>
|
|
|
- <a-input v-model:value="it.value" style="width: 285px"></a-input>
|
|
|
- <img src="~@/assets/images/add.png" @click="addQuery" v-if="index==0"/>
|
|
|
- <img src="~@/assets/images/sub.png" @click="onDelete(index)" v-if="index>0"/>
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
+ <a-col :span="24" class="query-row" v-for="(it,index) in limiters">
|
|
|
+ <div class="col-title">
|
|
|
+ <a-select v-model:value="it.relation" :options="operTexts" class="operTexts"></a-select>
|
|
|
+ </div>
|
|
|
+ <a-select v-model:value="it.fields" :options="fieldList" class="operTexts"></a-select>
|
|
|
+ <a-input v-model:value="it.value" style="width: 285px"></a-input>
|
|
|
+ <img src="~@/assets/images/add.png" @click="addQuery" v-if="index==0"/>
|
|
|
+ <img src="~@/assets/images/sub.png" @click="onDelete(index)" v-if="index>0"/>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts">
|
|
|
-import {defineComponent, ref,reactive, watch,getCurrentInstance} from 'vue';
|
|
|
+import {defineComponent, ref, reactive, watch, getCurrentInstance} from 'vue';
|
|
|
import {type FormInstance, message, type SelectProps} from "ant-design-vue";
|
|
|
import QueryHistoryComplete from '@/components/basic/querylog/history-complete.vue';
|
|
|
import {show} from "dom7";
|
|
@@ -83,77 +89,77 @@ export default defineComponent({
|
|
|
const curTour = ref({});
|
|
|
const steps = reactive([
|
|
|
{
|
|
|
- target:'[data-v-step="1"]',
|
|
|
- header:{
|
|
|
- title:'<div style="height: 0;border-top: 12px solid transparent; border-bottom: 15px solid transparent;' +
|
|
|
- 'border-left: 15px solid transparent;border-right: 12px solid #4c8dff;' +
|
|
|
- 'position:absolute;right:364px;top:15px;"></div>' +
|
|
|
- '<div style="width:365px;color: white;background: #4c8dff;display:inline-block;' +
|
|
|
- 'font-size: 15px;border-radius:10px 10px 0 0;padding:5px 20px 0 10px;font-weight:bolder;">' +
|
|
|
- '| “一框式”检索<span style="padding-left: 20px;">1/3</span></div>'
|
|
|
+ target: '[data-v-step="1"]',
|
|
|
+ header: {
|
|
|
+ title: '<div style="height: 0;border-top: 12px solid transparent; border-bottom: 15px solid transparent;' +
|
|
|
+ 'border-left: 15px solid transparent;border-right: 12px solid #4c8dff;' +
|
|
|
+ 'position:absolute;right:364px;top:15px;"></div>' +
|
|
|
+ '<div style="width:365px;color: white;background: #4c8dff;display:inline-block;' +
|
|
|
+ 'font-size: 15px;border-radius:10px 10px 0 0;padding:5px 20px 0 10px;font-weight:bolder;">' +
|
|
|
+ '| “一框式”检索<span style="padding-left: 20px;">1/3</span></div>'
|
|
|
},
|
|
|
- content:'<div style="display:inline-block;width:365px;font-size:14px;color: white;background: #4c8dff;' +
|
|
|
- 'border-radius:0 0 10px 10px;padding:5px 15px 0px 15px;position: absolute;top:55px;">' +
|
|
|
- '综合搜索栏,将检索功能浓缩至"一框"中。可直接输入多种类型的' +
|
|
|
- '关键词如井号、井名、生产作业名词到检索框中进行搜索;同时支持输入运算符“大于""等于""少于”“不等于”进行检索词的组合运算<br/>' +
|
|
|
- '<br/>点击“更多查询"可查看更多检索条件</div>',
|
|
|
- params:{
|
|
|
- placement:'right'
|
|
|
+ content: '<div style="display:inline-block;width:365px;font-size:14px;color: white;background: #4c8dff;' +
|
|
|
+ 'border-radius:0 0 10px 10px;padding:5px 15px 0px 15px;position: absolute;top:55px;">' +
|
|
|
+ '综合搜索栏,将检索功能浓缩至"一框"中。可直接输入多种类型的' +
|
|
|
+ '关键词如井号、井名、生产作业名词到检索框中进行搜索;同时支持输入运算符“大于""等于""少于”“不等于”进行检索词的组合运算<br/>' +
|
|
|
+ '<br/>点击“更多查询"可查看更多检索条件</div>',
|
|
|
+ params: {
|
|
|
+ placement: 'right'
|
|
|
}
|
|
|
- },{
|
|
|
- target:'[data-v-step="2"]',
|
|
|
- header:{
|
|
|
- title:'<div style="height: 0;border-top: 12px solid transparent; border-bottom: 15px solid transparent;' +
|
|
|
- 'border-left: 15px solid transparent;border-right: 12px solid #4c8dff;' +
|
|
|
- 'position:absolute;right:369px;top:11px;"></div>' +
|
|
|
- '<div style="width:370px;color: white;background: #4c8dff;display: inline-block;font-size: 15px;' +
|
|
|
- 'border-radius:10px 10px 0 0;padding:5px 20px 0 10px;font-weight:bolder;">' +
|
|
|
- '| 检索控制条件<span style="padding-left: 205px;">2/3</span></div>',
|
|
|
+ }, {
|
|
|
+ target: '[data-v-step="2"]',
|
|
|
+ header: {
|
|
|
+ title: '<div style="height: 0;border-top: 12px solid transparent; border-bottom: 15px solid transparent;' +
|
|
|
+ 'border-left: 15px solid transparent;border-right: 12px solid #4c8dff;' +
|
|
|
+ 'position:absolute;right:369px;top:11px;"></div>' +
|
|
|
+ '<div style="width:370px;color: white;background: #4c8dff;display: inline-block;font-size: 15px;' +
|
|
|
+ 'border-radius:10px 10px 0 0;padding:5px 20px 0 10px;font-weight:bolder;">' +
|
|
|
+ '| 检索控制条件<span style="padding-left: 205px;">2/3</span></div>',
|
|
|
},
|
|
|
- content:'<div style="display:inline-block;width:370px;height:50px;font-size:14px;color: white;background: #4c8dff;' +
|
|
|
- 'border-radius:0 0 10px 10px;padding:5px 15px 0px 15px;position: absolute;top:50px;">' +
|
|
|
- '可选择控件条件进行查询范围的缩窄<br/></div>',
|
|
|
- params:{
|
|
|
- placement:'right'
|
|
|
+ content: '<div style="display:inline-block;width:370px;height:50px;font-size:14px;color: white;background: #4c8dff;' +
|
|
|
+ 'border-radius:0 0 10px 10px;padding:5px 15px 0px 15px;position: absolute;top:50px;">' +
|
|
|
+ '可选择控件条件进行查询范围的缩窄<br/></div>',
|
|
|
+ params: {
|
|
|
+ placement: 'right'
|
|
|
}
|
|
|
- },{
|
|
|
- target:'[data-v-step="3"]',
|
|
|
- header:{
|
|
|
- title:'<div style="height: 0;border-top: 12px solid transparent; border-bottom: 15px solid transparent;' +
|
|
|
- 'border-left: 15px solid transparent;border-right: 12px solid #4c8dff;' +
|
|
|
- 'position:absolute;right:450px;bottom:11px;"></div>' +
|
|
|
- '<div style="color: white;background: #4c8dff;display: inline;font-size: 15px;' +
|
|
|
- 'border-radius:10px 10px 0 0;padding:5px 20px 0 10px;font-weight:bolder;' +
|
|
|
- 'position:relative;bottom:198px;">' +
|
|
|
- '| 多个检索项组合查询<span style="padding-left: 250px;">3/3</span></div>',
|
|
|
+ }, {
|
|
|
+ target: '[data-v-step="3"]',
|
|
|
+ header: {
|
|
|
+ title: '<div style="height: 0;border-top: 12px solid transparent; border-bottom: 15px solid transparent;' +
|
|
|
+ 'border-left: 15px solid transparent;border-right: 12px solid #4c8dff;' +
|
|
|
+ 'position:absolute;right:450px;bottom:11px;"></div>' +
|
|
|
+ '<div style="color: white;background: #4c8dff;display: inline;font-size: 15px;' +
|
|
|
+ 'border-radius:10px 10px 0 0;padding:5px 20px 0 10px;font-weight:bolder;' +
|
|
|
+ 'position:relative;bottom:198px;">' +
|
|
|
+ '| 多个检索项组合查询<span style="padding-left: 250px;">3/3</span></div>',
|
|
|
},
|
|
|
- content:'<div style="color: white;background: #4c8dff;display: inline;width:450px;font-size: 14px;' +
|
|
|
- 'border-radius:0 0 10px 10px;position: absolute;bottom:-89px;padding:5px 15px 0px 15px;">' +
|
|
|
- '1.首先须在下拉框中选择“井号"或“井名"的类别,输入想搜索的井<br/>' +
|
|
|
- '2.再从下拉框中选择其他检索项如“产油量"等,输入该检索项具体<br/>' +
|
|
|
- '要查询的值。例如想查看并号为001的产油量等于100的查询结果。<br/>' +
|
|
|
- '3.支持自由选择检索项间的逻辑关系:<br/>' +
|
|
|
- 'AND(与)、OR(或)、NOT(非)<br/><br/>' +
|
|
|
- '举例:<br/>' +
|
|
|
- '1) 检索井名包含12和产油量为100的结果<br/>' +
|
|
|
- '<span style="padding-left: 20px;">检索式: 井名 12 AND 产油量100</span><br/>' +
|
|
|
- '2) 检索井名包含12但不查地形区为益地的结果<br/>' +
|
|
|
- '<span style="padding-left: 20px;">检索式: 井名 12 NOT 地形区 盆地</span><br/>' +
|
|
|
- '3) 检索井名为12-12或12-44的31<br/>' +
|
|
|
- '<span style="padding-left: 20px;">检索式: 井名 12-12 0R 井名 12-44</span></div>',
|
|
|
- params:{
|
|
|
- placement:'right'
|
|
|
+ content: '<div style="color: white;background: #4c8dff;display: inline;width:450px;font-size: 14px;' +
|
|
|
+ 'border-radius:0 0 10px 10px;position: absolute;bottom:-89px;padding:5px 15px 0px 15px;">' +
|
|
|
+ '1.首先须在下拉框中选择“井号"或“井名"的类别,输入想搜索的井<br/>' +
|
|
|
+ '2.再从下拉框中选择其他检索项如“产油量"等,输入该检索项具体<br/>' +
|
|
|
+ '要查询的值。例如想查看并号为001的产油量等于100的查询结果。<br/>' +
|
|
|
+ '3.支持自由选择检索项间的逻辑关系:<br/>' +
|
|
|
+ 'AND(与)、OR(或)、NOT(非)<br/><br/>' +
|
|
|
+ '举例:<br/>' +
|
|
|
+ '1) 检索井名包含12和产油量为100的结果<br/>' +
|
|
|
+ '<span style="padding-left: 20px;">检索式: 井名 12 AND 产油量100</span><br/>' +
|
|
|
+ '2) 检索井名包含12但不查地形区为益地的结果<br/>' +
|
|
|
+ '<span style="padding-left: 20px;">检索式: 井名 12 NOT 地形区 盆地</span><br/>' +
|
|
|
+ '3) 检索井名为12-12或12-44的31<br/>' +
|
|
|
+ '<span style="padding-left: 20px;">检索式: 井名 12-12 0R 井名 12-44</span></div>',
|
|
|
+ params: {
|
|
|
+ placement: 'right'
|
|
|
}
|
|
|
}
|
|
|
]);
|
|
|
const myOptions = reactive({
|
|
|
- dialogVisible:false,
|
|
|
- useKeyboardNavigation:false,
|
|
|
- labels:{
|
|
|
- buttonSkip:' 跳过引导 ',
|
|
|
- buttonPrevious:' 上一步 ',
|
|
|
- buttonNext:'下一步 ',
|
|
|
- buttonStop:' 明白了 '
|
|
|
+ dialogVisible: false,
|
|
|
+ useKeyboardNavigation: false,
|
|
|
+ labels: {
|
|
|
+ buttonSkip: ' 跳过引导 ',
|
|
|
+ buttonPrevious: ' 上一步 ',
|
|
|
+ buttonNext: '下一步 ',
|
|
|
+ buttonStop: ' 明白了 '
|
|
|
}
|
|
|
});
|
|
|
|
|
@@ -161,14 +167,14 @@ export default defineComponent({
|
|
|
const showOverlay = ref<boolean>(false);
|
|
|
|
|
|
const myCallbacks = ref({
|
|
|
- onPreviousStep(){
|
|
|
+ onPreviousStep() {
|
|
|
curStepVal.value -= 1;
|
|
|
loadStyle();
|
|
|
},
|
|
|
- onNextStep(){
|
|
|
+ onNextStep() {
|
|
|
curStepVal.value += 1;
|
|
|
loadStyle();
|
|
|
- },onStop:async function(){
|
|
|
+ }, onStop: async function () {
|
|
|
curStepVal.value = 1;
|
|
|
showOverlay.value = false;
|
|
|
const $input = document.getElementById('keyName');
|
|
@@ -177,7 +183,6 @@ export default defineComponent({
|
|
|
});
|
|
|
|
|
|
|
|
|
-
|
|
|
const limiters = ref([{
|
|
|
fields: '',
|
|
|
value: '',
|
|
@@ -218,25 +223,25 @@ export default defineComponent({
|
|
|
}, {}
|
|
|
);
|
|
|
|
|
|
- function loadStyle(){
|
|
|
- setTimeout(()=>{
|
|
|
+ function loadStyle() {
|
|
|
+ setTimeout(() => {
|
|
|
const $divs = document.getElementsByClassName("v-step__buttons");
|
|
|
- for(let i=0;i < $divs.length;i++) {
|
|
|
+ for (let i = 0; i < $divs.length; i++) {
|
|
|
const div = $divs[i];
|
|
|
- if(curStepVal.value==3){
|
|
|
- div.setAttribute("style","background-color:#4c8dff;color:white;height:30px;width:100%;" +
|
|
|
+ if (curStepVal.value == 3) {
|
|
|
+ div.setAttribute("style", "background-color:#4c8dff;color:white;height:30px;width:100%;" +
|
|
|
"position: relative;top:-201px;padding-top:4px;");
|
|
|
- }else{
|
|
|
- div.setAttribute("style","background-color:#4c8dff;color:white;height:30px;width:100%;" +
|
|
|
+ } else {
|
|
|
+ div.setAttribute("style", "background-color:#4c8dff;color:white;height:30px;width:100%;" +
|
|
|
"position: relative;top:-1px;padding-top:4px;");
|
|
|
}
|
|
|
}
|
|
|
const $buttons = document.getElementsByClassName("v-step__button");
|
|
|
- for(let i=0;i < $buttons.length;i++) {
|
|
|
+ for (let i = 0; i < $buttons.length; i++) {
|
|
|
const button = $buttons[i];
|
|
|
- button.setAttribute("style","border:1px solid white;margin:0 10px 0 20px;padding:0 4px 0 4px;border-radius:5px;");
|
|
|
+ button.setAttribute("style", "border:1px solid white;margin:0 10px 0 20px;padding:0 4px 0 4px;border-radius:5px;");
|
|
|
}
|
|
|
- },1);
|
|
|
+ }, 1);
|
|
|
}
|
|
|
|
|
|
const formRef = ref<FormInstance>();
|
|
@@ -253,17 +258,17 @@ export default defineComponent({
|
|
|
{value: 'well_purpose', label: '井别'}
|
|
|
] as SelectProps['options'];
|
|
|
|
|
|
- function addQuery() {
|
|
|
+ const addQuery = () => {
|
|
|
limiters.value.push({fields: '', value: '', opreation: '等于', relation: 'AND'});
|
|
|
}
|
|
|
|
|
|
- function onDelete(index) {
|
|
|
+ const onDelete = (index) => {
|
|
|
limiters.value.splice(index, 1);
|
|
|
}
|
|
|
|
|
|
- function getQuery() {
|
|
|
+ const getQuery = () => {
|
|
|
|
|
|
- if(showOverlay.value){
|
|
|
+ if (showOverlay.value) {
|
|
|
message.warn('请退出引导状态再进行操作!');
|
|
|
return false;
|
|
|
}
|
|
@@ -284,22 +289,28 @@ export default defineComponent({
|
|
|
console.log(queryObject);
|
|
|
emit('query', queryObject);
|
|
|
}
|
|
|
-
|
|
|
+ const showHelp = () => {
|
|
|
+ curTour.value = getCurrentInstance()?.appContext.config.globalProperties.$tours;
|
|
|
+ if (curTour.value && curTour.value['queryTour'] && formState.value.showMoreQuery) {
|
|
|
+ (curTour.value['queryTour'] as any).start();
|
|
|
+ showOverlay.value = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
return {
|
|
|
formState, limiters, operTexts, fieldList, addQuery, onDelete, getQuery, formRef,
|
|
|
- steps,myOptions,curTour,curStepVal,showOverlay,loadStyle,myCallbacks
|
|
|
+ steps, myOptions, curTour, curStepVal, showOverlay, loadStyle, myCallbacks,showHelp
|
|
|
};
|
|
|
},
|
|
|
- mounted(){
|
|
|
+ mounted() {
|
|
|
this.curTour = getCurrentInstance()?.appContext.config.globalProperties.$tours;
|
|
|
- if(this.curTour && this.curTour['queryTour'] && this.formState.showMoreQuery){
|
|
|
+ if (this.curTour && this.curTour['queryTour'] && this.formState.showMoreQuery) {
|
|
|
const localData = localStorage.getItem('queryTourShow');
|
|
|
- const curTour = localData?JSON.parse(localData):null;
|
|
|
- if(curTour==null||!curTour.ifShowed){
|
|
|
+ const curTour = localData ? JSON.parse(localData) : null;
|
|
|
+ if (curTour == null || !curTour.ifShowed) {
|
|
|
(this.curTour['queryTour'] as any).start();
|
|
|
this.showOverlay = true;
|
|
|
- const curLocalData = JSON.stringify({ifShowed:true});
|
|
|
- localStorage.setItem('queryTourShow',curLocalData);
|
|
|
+ const curLocalData = JSON.stringify({ifShowed: true});
|
|
|
+ localStorage.setItem('queryTourShow', curLocalData);
|
|
|
}
|
|
|
}
|
|
|
|
|
@@ -321,7 +332,7 @@ export default defineComponent({
|
|
|
position: relative;
|
|
|
}
|
|
|
|
|
|
-.leftTriangle{
|
|
|
+.leftTriangle {
|
|
|
height: 0;
|
|
|
border-top: 12px solid transparent;
|
|
|
border-bottom: 15px solid transparent;
|
|
@@ -329,13 +340,13 @@ export default defineComponent({
|
|
|
border-right: 12px solid #4c8dff;
|
|
|
}
|
|
|
|
|
|
-.tips{
|
|
|
+.tips {
|
|
|
color: white;
|
|
|
background: #4c8dff;
|
|
|
display: inline-block;
|
|
|
font-size: 14px;
|
|
|
- border-radius:0 0 10px 10px;
|
|
|
- padding:5px 15px 0px 15px;
|
|
|
+ border-radius: 0 0 10px 10px;
|
|
|
+ padding: 5px 15px 0px 15px;
|
|
|
}
|
|
|
|
|
|
.ant-row {
|