ZheJiangNingBo
/
pingAnQiYeWeb
7
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity
Labels Milestones
New Pull Request

lukeyan #137

Merged
lukeyan merged 4 commits from lukeyan into master 1 year ago
Conversation 0 Commits 4 Files Changed 13
13 changed files with 1102 additions and 20 deletions
Show Stats Download Patch File Download Diff File

2
public/static/map.html
Unescape View File

@ -26,7 +26,7 @@
// 创建地图实例 // 创建地图实例
var map = new BMapGL.Map("container"); // 创建地图实例 var map = new BMapGL.Map("container"); // 创建地图实例
var point = new BMapGL.Point(121.619401, 30.046348); // 创建点坐标 var point = new BMapGL.Point(121.619401, 30.046348); // 创建点坐标
map.centerAndZoom(point, 15); // 初始化地图，设置中心点坐标和地图级别 map.centerAndZoom(point, 17); // 初始化地图，设置中心点坐标和地图级别
map.enableScrollWheelZoom(true); map.enableScrollWheelZoom(true);
map.setMapType(BMAP_SATELLITE_MAP); map.setMapType(BMAP_SATELLITE_MAP);
// map.setHeading(64.5); // map.setHeading(64.5);

BIN
src/assets/companyFile/point01.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 26 KiB

BIN
src/assets/companyFile/point02.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 26 KiB

BIN
src/assets/companyFile/point03.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 26 KiB

8
src/views/closeLoopDispose/components/backlogDetail.vue
Unescape View File

@ -9,9 +9,9 @@
@back_home_page="back_home_page" @back_home_page="back_home_page"
></BacklogDetailForm> ></BacklogDetailForm>
</el-tab-pane> </el-tab-pane>
<!-- <el-tab-pane label="流程图" name="second"> <el-tab-pane label="流程图" name="second">
<BacklogDetailPicture ref="backlogDetailPicture"></BacklogDetailPicture> <BacklogDetailPicture ref="backlogDetailPicture"></BacklogDetailPicture>
</el-tab-pane> --> </el-tab-pane>
<el-tab-pane label="流转记录" name="third"> <el-tab-pane label="流转记录" name="third">
<BacklogDetailRecords <BacklogDetailRecords
ref="backlogDetailRecords" ref="backlogDetailRecords"
@ -23,13 +23,13 @@
</template> </template>
<script> <script>
import BacklogDetailForm from "./backlogDetailForm"; import BacklogDetailForm from "./backlogDetailForm";
// import BacklogDetailPicture from "./backlogDetailPicture"; import BacklogDetailPicture from "./backlogDetailPicture";
import BacklogDetailRecords from "./backlogDetailRecords"; import BacklogDetailRecords from "./backlogDetailRecords";
export default { export default {
name: "BacklogDetail", name: "BacklogDetail",
components: { components: {
BacklogDetailForm, BacklogDetailForm,
// BacklogDetailPicture, BacklogDetailPicture,
BacklogDetailRecords, BacklogDetailRecords,
}, },
props: { props: {

270
src/views/closeLoopDispose/components/backlogDetailPicture.vue
Unescape View File

@ -24,6 +24,57 @@
<div class="picture_text_five">未经过的出口</div> <div class="picture_text_five">未经过的出口</div>
</div> </div>
</div> </div>
<div class="picture_item">
<div class="start_point">
<div class="start_point_item">
<div class="start_point_item_text">1.转处置任务治安大队</div>
</div>
</div>
<div class="line_one">
<div class="line_item"></div>
</div>
<div class="line_two">
<div class="line_item_one"></div>
<div class="line_item_two"></div>
</div>
<!-- 箭头 -->
<div class="arrow_one">
<div class="arrow_item_one"></div>
<div class="arrow_item_two"></div>
<div class="arrow_item_three"></div>
</div>
<!-- 流程点 -->
<div class="next_point">
<div class="next_point_item_one">
<div class="next_point_item_one_text">1.转处置任务治安大队</div>
</div>
<div class="next_point_item_two">
<div class="next_point_item_two_text">1.转处置任务治安大队</div>
</div>
<div class="next_point_item_three">
<div class="next_point_item_three_text">1.转处置任务治安大队</div>
</div>
</div>
<!-- 流程线 -->
<div class="line_three">
<div class="line_item_one"></div>
<div class="line_item_two"></div>
</div>
<!-- 流程线 -->
<div class="line_four">
<div class="line_item"></div>
</div>
<!-- 箭头 -->
<div class="arrow_two">
<div class="arrow_item"></div>
</div>
<!-- 流程终结点 -->
<div class="end_point">
<div class="end_point_item">
<div class="end_point_item_text">1.转处置任务治安大队</div>
</div>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
@ -126,5 +177,224 @@ export default {
} }
} }
} }
.picture_item {
width: 94vw;
height: 60vh;
margin-left: 1vw;
margin-top: 1vh;
display: flex;
.start_point {
width: 15vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.start_point_item {
width: 15vw;
height: 10vh;
// margin-top: 18vh;
background: url("~@/assets/companyFile/point01.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
}
.start_point_item_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
.line_one {
width: 10vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.line_item {
width: 10vw;
height: 2px;
background: #278961;
}
}
.line_two {
width: 8vw;
height: 60vh;
display: flex;
flex-direction: column-reverse;
justify-content: center;
.line_item_one {
width: 8vw;
height: 15vh;
border-left: 2px solid #278961;
border-bottom: 2px solid #278961;
border-top: 1px solid #278961;
}
.line_item_two {
width: 8vw;
height: 15vh;
border-left: 2px solid #278961;
border-top: 2px solid #278961;
border-bottom: 1px solid #278961;
}
}
.arrow_one {
width: 1.5vw;
height: 60vh;
display: flex;
flex-direction: column;
.arrow_item_one {
width: 1.5vw;
height: 2vh;
margin-top: 14vh;
background: url("~@/assets/companyFile/rightarrow.png") no-repeat !important;
background-size: 100% 100% !important;
}
.arrow_item_two {
width: 1.5vw;
height: 2vh;
margin-top: 13vh;
background: url("~@/assets/companyFile/rightarrow.png") no-repeat !important;
background-size: 100% 100% !important;
}
.arrow_item_three {
width: 1.5vw;
height: 2vh;
margin-top: 13vh;
background: url("~@/assets/companyFile/rightarrow.png") no-repeat !important;
background-size: 100% 100% !important;
}
}
.next_point {
width: 15vw;
height: 60vh;
display: flex;
flex-direction: column;
.next_point_item_one {
width: 15vw;
height: 10vh;
margin-top: 10vh;
background: url("~@/assets/companyFile/point01.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.next_point_item_one_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
.next_point_item_two {
width: 15vw;
height: 10vh;
margin-top: 5vh;
background: url("~@/assets/companyFile/point02.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.next_point_item_two_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
.next_point_item_three {
width: 15vw;
height: 10vh;
margin-top: 5vh;
background: url("~@/assets/companyFile/point03.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.next_point_item_three_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
}
.line_three {
width: 8vw;
height: 60vh;
display: flex;
flex-direction: column-reverse;
justify-content: center;
.line_item_one {
width: 8vw;
height: 15vh;
border-right: 2px solid #747b7e;
border-bottom: 2px solid #747b7e;
border-top: 1px solid #747b7e;
}
.line_item_two {
width: 8vw;
height: 15vh;
border-right: 2px solid #747b7e;
border-top: 2px solid #747b7e;
border-bottom: 1px solid #747b7e;
}
}
.line_four {
width: 10vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.line_item {
width: 10vw;
height: 2px;
background: #747b7e;
}
}
.arrow_two {
width: 1.5vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.arrow_item {
width: 1.5vw;
height: 2vh;
// border: 0.1px solid #3f5564;
background: url("~@/assets/companyFile/rightarrow02.png") no-repeat !important;
background-size: 100% 100% !important;
}
}
.end_point {
width: 15vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.end_point_item {
width: 15vw;
height: 10vh;
// margin-top: 18vh;
background: url("~@/assets/companyFile/point03.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.end_point_item_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
}
}
} }
</style> </style>

8
src/views/closeLoopDispose/components/completeDetail.vue
Unescape View File

@ -8,9 +8,9 @@
ref="completeDetailForm" ref="completeDetailForm"
></CompleteDetailForm> ></CompleteDetailForm>
</el-tab-pane> </el-tab-pane>
<!-- <el-tab-pane label="流程图" name="second"> <el-tab-pane label="流程图" name="second">
<CompleteDetailPicture ref="copyDetailPicture"></CompleteDetailPicture> <CompleteDetailPicture ref="copyDetailPicture"></CompleteDetailPicture>
</el-tab-pane> --> </el-tab-pane>
<el-tab-pane label="流转记录" name="third"> <el-tab-pane label="流转记录" name="third">
<CompleteDetailRecords <CompleteDetailRecords
:complete_detail="complete_detail" :complete_detail="complete_detail"
@ -22,13 +22,13 @@
</template> </template>
<script> <script>
import CompleteDetailForm from "./completeDetailForm"; import CompleteDetailForm from "./completeDetailForm";
// import CompleteDetailPicture from "./completeDetailPicture"; import CompleteDetailPicture from "./completeDetailPicture";
import CompleteDetailRecords from "./completeDetailRecords"; import CompleteDetailRecords from "./completeDetailRecords";
export default { export default {
name: "CompleteDetail", name: "CompleteDetail",
components: { components: {
CompleteDetailForm, CompleteDetailForm,
// CompleteDetailPicture, CompleteDetailPicture,
CompleteDetailRecords, CompleteDetailRecords,
}, },
props: { props: {

270
src/views/closeLoopDispose/components/completeDetailPicture.vue
Unescape View File

@ -24,6 +24,57 @@
<div class="picture_text_five">未经过的出口</div> <div class="picture_text_five">未经过的出口</div>
</div> </div>
</div> </div>
<div class="picture_item">
<div class="start_point">
<div class="start_point_item">
<div class="start_point_item_text">1.转处置任务治安大队</div>
</div>
</div>
<div class="line_one">
<div class="line_item"></div>
</div>
<div class="line_two">
<div class="line_item_one"></div>
<div class="line_item_two"></div>
</div>
<!-- 箭头 -->
<div class="arrow_one">
<div class="arrow_item_one"></div>
<div class="arrow_item_two"></div>
<div class="arrow_item_three"></div>
</div>
<!-- 流程点 -->
<div class="next_point">
<div class="next_point_item_one">
<div class="next_point_item_one_text">1.转处置任务治安大队</div>
</div>
<div class="next_point_item_two">
<div class="next_point_item_two_text">1.转处置任务治安大队</div>
</div>
<div class="next_point_item_three">
<div class="next_point_item_three_text">1.转处置任务治安大队</div>
</div>
</div>
<!-- 流程线 -->
<div class="line_three">
<div class="line_item_one"></div>
<div class="line_item_two"></div>
</div>
<!-- 流程线 -->
<div class="line_four">
<div class="line_item"></div>
</div>
<!-- 箭头 -->
<div class="arrow_two">
<div class="arrow_item"></div>
</div>
<!-- 流程终结点 -->
<div class="end_point">
<div class="end_point_item">
<div class="end_point_item_text">1.转处置任务治安大队</div>
</div>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
@ -126,5 +177,224 @@ export default {
} }
} }
} }
.picture_item {
width: 94vw;
height: 60vh;
margin-left: 1vw;
margin-top: 1vh;
display: flex;
.start_point {
width: 15vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.start_point_item {
width: 15vw;
height: 10vh;
// margin-top: 18vh;
background: url("~@/assets/companyFile/point01.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
}
.start_point_item_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
.line_one {
width: 10vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.line_item {
width: 10vw;
height: 2px;
background: #278961;
}
}
.line_two {
width: 8vw;
height: 60vh;
display: flex;
flex-direction: column-reverse;
justify-content: center;
.line_item_one {
width: 8vw;
height: 15vh;
border-left: 2px solid #278961;
border-bottom: 2px solid #278961;
border-top: 1px solid #278961;
}
.line_item_two {
width: 8vw;
height: 15vh;
border-left: 2px solid #278961;
border-top: 2px solid #278961;
border-bottom: 1px solid #278961;
}
}
.arrow_one {
width: 1.5vw;
height: 60vh;
display: flex;
flex-direction: column;
.arrow_item_one {
width: 1.5vw;
height: 2vh;
margin-top: 14vh;
background: url("~@/assets/companyFile/rightarrow.png") no-repeat !important;
background-size: 100% 100% !important;
}
.arrow_item_two {
width: 1.5vw;
height: 2vh;
margin-top: 13vh;
background: url("~@/assets/companyFile/rightarrow.png") no-repeat !important;
background-size: 100% 100% !important;
}
.arrow_item_three {
width: 1.5vw;
height: 2vh;
margin-top: 13vh;
background: url("~@/assets/companyFile/rightarrow.png") no-repeat !important;
background-size: 100% 100% !important;
}
}
.next_point {
width: 15vw;
height: 60vh;
display: flex;
flex-direction: column;
.next_point_item_one {
width: 15vw;
height: 10vh;
margin-top: 10vh;
background: url("~@/assets/companyFile/point01.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.next_point_item_one_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
.next_point_item_two {
width: 15vw;
height: 10vh;
margin-top: 5vh;
background: url("~@/assets/companyFile/point02.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.next_point_item_two_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
.next_point_item_three {
width: 15vw;
height: 10vh;
margin-top: 5vh;
background: url("~@/assets/companyFile/point03.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.next_point_item_three_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
}
.line_three {
width: 8vw;
height: 60vh;
display: flex;
flex-direction: column-reverse;
justify-content: center;
.line_item_one {
width: 8vw;
height: 15vh;
border-right: 2px solid #747b7e;
border-bottom: 2px solid #747b7e;
border-top: 1px solid #747b7e;
}
.line_item_two {
width: 8vw;
height: 15vh;
border-right: 2px solid #747b7e;
border-top: 2px solid #747b7e;
border-bottom: 1px solid #747b7e;
}
}
.line_four {
width: 10vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.line_item {
width: 10vw;
height: 2px;
background: #747b7e;
}
}
.arrow_two {
width: 1.5vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.arrow_item {
width: 1.5vw;
height: 2vh;
// border: 0.1px solid #3f5564;
background: url("~@/assets/companyFile/rightarrow02.png") no-repeat !important;
background-size: 100% 100% !important;
}
}
.end_point {
width: 15vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.end_point_item {
width: 15vw;
height: 10vh;
// margin-top: 18vh;
background: url("~@/assets/companyFile/point03.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.end_point_item_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
}
}
} }
</style> </style>

8
src/views/closeLoopDispose/components/copyDetail.vue
Unescape View File

@ -8,9 +8,9 @@
:copy_detail="copy_detail" :copy_detail="copy_detail"
></CopyDetailForm> ></CopyDetailForm>
</el-tab-pane> </el-tab-pane>
<!-- <el-tab-pane label="流程图" name="second"> <el-tab-pane label="流程图" name="second">
<CopyDetailPicture ref="copyDetailPicture"></CopyDetailPicture> <CopyDetailPicture ref="copyDetailPicture"></CopyDetailPicture>
</el-tab-pane> --> </el-tab-pane>
<el-tab-pane label="流转记录" name="third"> <el-tab-pane label="流转记录" name="third">
<CopyDetailRecords <CopyDetailRecords
ref="copyDetailRecords" ref="copyDetailRecords"
@ -22,13 +22,13 @@
</template> </template>
<script> <script>
import CopyDetailForm from "./copyDetailForm"; import CopyDetailForm from "./copyDetailForm";
// import CopyDetailPicture from "./copyDetailPicture"; import CopyDetailPicture from "./copyDetailPicture";
import CopyDetailRecords from "./copyDetailRecords"; import CopyDetailRecords from "./copyDetailRecords";
export default { export default {
name: "copyDetail", name: "copyDetail",
components: { components: {
CopyDetailForm, CopyDetailForm,
// CopyDetailPicture, CopyDetailPicture,
CopyDetailRecords, CopyDetailRecords,
}, },
props: { props: {

270
src/views/closeLoopDispose/components/copyDetailPicture.vue
Unescape View File

@ -24,6 +24,57 @@
<div class="picture_text_five">未经过的出口</div> <div class="picture_text_five">未经过的出口</div>
</div> </div>
</div> </div>
<div class="picture_item">
<div class="start_point">
<div class="start_point_item">
<div class="start_point_item_text">1.转处置任务治安大队</div>
</div>
</div>
<div class="line_one">
<div class="line_item"></div>
</div>
<div class="line_two">
<div class="line_item_one"></div>
<div class="line_item_two"></div>
</div>
<!-- 箭头 -->
<div class="arrow_one">
<div class="arrow_item_one"></div>
<div class="arrow_item_two"></div>
<div class="arrow_item_three"></div>
</div>
<!-- 流程点 -->
<div class="next_point">
<div class="next_point_item_one">
<div class="next_point_item_one_text">1.转处置任务治安大队</div>
</div>
<div class="next_point_item_two">
<div class="next_point_item_two_text">1.转处置任务治安大队</div>
</div>
<div class="next_point_item_three">
<div class="next_point_item_three_text">1.转处置任务治安大队</div>
</div>
</div>
<!-- 流程线 -->
<div class="line_three">
<div class="line_item_one"></div>
<div class="line_item_two"></div>
</div>
<!-- 流程线 -->
<div class="line_four">
<div class="line_item"></div>
</div>
<!-- 箭头 -->
<div class="arrow_two">
<div class="arrow_item"></div>
</div>
<!-- 流程终结点 -->
<div class="end_point">
<div class="end_point_item">
<div class="end_point_item_text">1.转处置任务治安大队</div>
</div>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
@ -126,5 +177,224 @@ export default {
} }
} }
} }
.picture_item {
width: 94vw;
height: 60vh;
margin-left: 1vw;
margin-top: 1vh;
display: flex;
.start_point {
width: 15vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.start_point_item {
width: 15vw;
height: 10vh;
// margin-top: 18vh;
background: url("~@/assets/companyFile/point01.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
}
.start_point_item_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
.line_one {
width: 10vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.line_item {
width: 10vw;
height: 2px;
background: #278961;
}
}
.line_two {
width: 8vw;
height: 60vh;
display: flex;
flex-direction: column-reverse;
justify-content: center;
.line_item_one {
width: 8vw;
height: 15vh;
border-left: 2px solid #278961;
border-bottom: 2px solid #278961;
border-top: 1px solid #278961;
}
.line_item_two {
width: 8vw;
height: 15vh;
border-left: 2px solid #278961;
border-top: 2px solid #278961;
border-bottom: 1px solid #278961;
}
}
.arrow_one {
width: 1.5vw;
height: 60vh;
display: flex;
flex-direction: column;
.arrow_item_one {
width: 1.5vw;
height: 2vh;
margin-top: 14vh;
background: url("~@/assets/companyFile/rightarrow.png") no-repeat !important;
background-size: 100% 100% !important;
}
.arrow_item_two {
width: 1.5vw;
height: 2vh;
margin-top: 13vh;
background: url("~@/assets/companyFile/rightarrow.png") no-repeat !important;
background-size: 100% 100% !important;
}
.arrow_item_three {
width: 1.5vw;
height: 2vh;
margin-top: 13vh;
background: url("~@/assets/companyFile/rightarrow.png") no-repeat !important;
background-size: 100% 100% !important;
}
}
.next_point {
width: 15vw;
height: 60vh;
display: flex;
flex-direction: column;
.next_point_item_one {
width: 15vw;
height: 10vh;
margin-top: 10vh;
background: url("~@/assets/companyFile/point01.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.next_point_item_one_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
.next_point_item_two {
width: 15vw;
height: 10vh;
margin-top: 5vh;
background: url("~@/assets/companyFile/point02.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.next_point_item_two_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
.next_point_item_three {
width: 15vw;
height: 10vh;
margin-top: 5vh;
background: url("~@/assets/companyFile/point03.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.next_point_item_three_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
}
.line_three {
width: 8vw;
height: 60vh;
display: flex;
flex-direction: column-reverse;
justify-content: center;
.line_item_one {
width: 8vw;
height: 15vh;
border-right: 2px solid #747b7e;
border-bottom: 2px solid #747b7e;
border-top: 1px solid #747b7e;
}
.line_item_two {
width: 8vw;
height: 15vh;
border-right: 2px solid #747b7e;
border-top: 2px solid #747b7e;
border-bottom: 1px solid #747b7e;
}
}
.line_four {
width: 10vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.line_item {
width: 10vw;
height: 2px;
background: #747b7e;
}
}
.arrow_two {
width: 1.5vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.arrow_item {
width: 1.5vw;
height: 2vh;
// border: 0.1px solid #3f5564;
background: url("~@/assets/companyFile/rightarrow02.png") no-repeat !important;
background-size: 100% 100% !important;
}
}
.end_point {
width: 15vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.end_point_item {
width: 15vw;
height: 10vh;
// margin-top: 18vh;
background: url("~@/assets/companyFile/point03.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.end_point_item_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
}
}
} }
</style> </style>

8
src/views/closeLoopDispose/components/myCourseDetail.vue
Unescape View File

@ -5,9 +5,9 @@
<el-tab-pane label="表单信息" name="first"> <el-tab-pane label="表单信息" name="first">
<MyCourseDetailForm ref="myCourseDetailForm" :send_detail="send_detail"></MyCourseDetailForm> <MyCourseDetailForm ref="myCourseDetailForm" :send_detail="send_detail"></MyCourseDetailForm>
</el-tab-pane> </el-tab-pane>
<!-- <el-tab-pane label="流程图" name="second"> <el-tab-pane label="流程图" name="second">
<MyCourseDetailPicture ref="myCourseDetailPicture"></MyCourseDetailPicture> <MyCourseDetailPicture ref="myCourseDetailPicture"></MyCourseDetailPicture>
</el-tab-pane> --> </el-tab-pane>
<el-tab-pane label="流转记录" name="third"> <el-tab-pane label="流转记录" name="third">
<MyCourseDetailRecords ref="myCourseDetailRecords" :send_detail="send_detail"></MyCourseDetailRecords> <MyCourseDetailRecords ref="myCourseDetailRecords" :send_detail="send_detail"></MyCourseDetailRecords>
</el-tab-pane> </el-tab-pane>
@ -16,13 +16,13 @@
</template> </template>
<script> <script>
import MyCourseDetailForm from "./myCourseDetailForm"; import MyCourseDetailForm from "./myCourseDetailForm";
// import MyCourseDetailPicture from "./myCourseDetailPicture"; import MyCourseDetailPicture from "./myCourseDetailPicture";
import MyCourseDetailRecords from './myCourseDetailRecords' import MyCourseDetailRecords from './myCourseDetailRecords'
export default { export default {
name: "MyCourseDetail", name: "MyCourseDetail",
components:{ components:{
MyCourseDetailForm, MyCourseDetailForm,
// MyCourseDetailPicture, MyCourseDetailPicture,
MyCourseDetailRecords MyCourseDetailRecords
}, },
props:{ props:{

270
src/views/closeLoopDispose/components/myCourseDetailPicture.vue
Unescape View File

@ -24,6 +24,57 @@
<div class="picture_text_five">未经过的出口</div> <div class="picture_text_five">未经过的出口</div>
</div> </div>
</div> </div>
<div class="picture_item">
<div class="start_point">
<div class="start_point_item">
<div class="start_point_item_text">1.转处置任务治安大队</div>
</div>
</div>
<div class="line_one">
<div class="line_item"></div>
</div>
<div class="line_two">
<div class="line_item_one"></div>
<div class="line_item_two"></div>
</div>
<!-- 箭头 -->
<div class="arrow_one">
<div class="arrow_item_one"></div>
<div class="arrow_item_two"></div>
<div class="arrow_item_three"></div>
</div>
<!-- 流程点 -->
<div class="next_point">
<div class="next_point_item_one">
<div class="next_point_item_one_text">1.转处置任务治安大队</div>
</div>
<div class="next_point_item_two">
<div class="next_point_item_two_text">1.转处置任务治安大队</div>
</div>
<div class="next_point_item_three">
<div class="next_point_item_three_text">1.转处置任务治安大队</div>
</div>
</div>
<!-- 流程线 -->
<div class="line_three">
<div class="line_item_one"></div>
<div class="line_item_two"></div>
</div>
<!-- 流程线 -->
<div class="line_four">
<div class="line_item"></div>
</div>
<!-- 箭头 -->
<div class="arrow_two">
<div class="arrow_item"></div>
</div>
<!-- 流程终结点 -->
<div class="end_point">
<div class="end_point_item">
<div class="end_point_item_text">1.转处置任务治安大队</div>
</div>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
@ -126,5 +177,224 @@ export default {
} }
} }
} }
.picture_item {
width: 94vw;
height: 60vh;
margin-left: 1vw;
margin-top: 1vh;
display: flex;
.start_point {
width: 15vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.start_point_item {
width: 15vw;
height: 10vh;
// margin-top: 18vh;
background: url("~@/assets/companyFile/point01.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
}
.start_point_item_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
.line_one {
width: 10vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.line_item {
width: 10vw;
height: 2px;
background: #278961;
}
}
.line_two {
width: 8vw;
height: 60vh;
display: flex;
flex-direction: column-reverse;
justify-content: center;
.line_item_one {
width: 8vw;
height: 15vh;
border-left: 2px solid #278961;
border-bottom: 2px solid #278961;
border-top: 1px solid #278961;
}
.line_item_two {
width: 8vw;
height: 15vh;
border-left: 2px solid #278961;
border-top: 2px solid #278961;
border-bottom: 1px solid #278961;
}
}
.arrow_one {
width: 1.5vw;
height: 60vh;
display: flex;
flex-direction: column;
.arrow_item_one {
width: 1.5vw;
height: 2vh;
margin-top: 14vh;
background: url("~@/assets/companyFile/rightarrow.png") no-repeat !important;
background-size: 100% 100% !important;
}
.arrow_item_two {
width: 1.5vw;
height: 2vh;
margin-top: 13vh;
background: url("~@/assets/companyFile/rightarrow.png") no-repeat !important;
background-size: 100% 100% !important;
}
.arrow_item_three {
width: 1.5vw;
height: 2vh;
margin-top: 13vh;
background: url("~@/assets/companyFile/rightarrow.png") no-repeat !important;
background-size: 100% 100% !important;
}
}
.next_point {
width: 15vw;
height: 60vh;
display: flex;
flex-direction: column;
.next_point_item_one {
width: 15vw;
height: 10vh;
margin-top: 10vh;
background: url("~@/assets/companyFile/point01.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.next_point_item_one_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
.next_point_item_two {
width: 15vw;
height: 10vh;
margin-top: 5vh;
background: url("~@/assets/companyFile/point02.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.next_point_item_two_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
.next_point_item_three {
width: 15vw;
height: 10vh;
margin-top: 5vh;
background: url("~@/assets/companyFile/point03.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.next_point_item_three_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
}
.line_three {
width: 8vw;
height: 60vh;
display: flex;
flex-direction: column-reverse;
justify-content: center;
.line_item_one {
width: 8vw;
height: 15vh;
border-right: 2px solid #747b7e;
border-bottom: 2px solid #747b7e;
border-top: 1px solid #747b7e;
}
.line_item_two {
width: 8vw;
height: 15vh;
border-right: 2px solid #747b7e;
border-top: 2px solid #747b7e;
border-bottom: 1px solid #747b7e;
}
}
.line_four {
width: 10vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.line_item {
width: 10vw;
height: 2px;
background: #747b7e;
}
}
.arrow_two {
width: 1.5vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.arrow_item {
width: 1.5vw;
height: 2vh;
// border: 0.1px solid #3f5564;
background: url("~@/assets/companyFile/rightarrow02.png") no-repeat !important;
background-size: 100% 100% !important;
}
}
.end_point {
width: 15vw;
height: 60vh;
display: flex;
justify-content: center;
align-items: center;
.end_point_item {
width: 15vw;
height: 10vh;
// margin-top: 18vh;
background: url("~@/assets/companyFile/point03.png") no-repeat !important;
background-size: 100% 100% !important;
display: flex;
justify-content: center;
align-items: center;
.end_point_item_text {
width: 15vw;
height: 5vh;
color: #c8c8c8;
text-align: center;
line-height: 5vh;
}
}
}
}
} }
</style> </style>

8
src/views/enterpriseArchives/componets/cardBox.vue
Unescape View File

@ -12,7 +12,7 @@
</div> </div>
<!-- 企业图片展示区域 --> <!-- 企业图片展示区域 -->
<div class="card_company"> <div class="card_company">
<img :src="i.picUrl" alt="" @error="setDefaultImage" /> <img :src="i.picUrl ? i.picUrl : ''" alt="" @error="setDefaultImage" />
<!-- 企业类型标签 --> <!-- 企业类型标签 -->
<div class="company_type"> <div class="company_type">
<div <div
@ -113,11 +113,13 @@ export default {
overflow: hidden; overflow: hidden;
} }
.card_company { .card_company {
width: 17.5vw; margin-left: 0.25vw;
margin-right: 0.25vw;
width: 17vw;
height: 15vh; height: 15vh;
position: relative; position: relative;
img { img {
width: 17.5vw; width: 17vw;
height: 15vh; height: 15vh;
} }
.company_type { .company_type {

Write Preview
Loading…
Cancel
Save