|
|
@@ -37,40 +37,88 @@
|
|
|
<div class="fullscreen-content-select">
|
|
|
<div class="fullscreen-content-select-block">
|
|
|
<Button
|
|
|
- @click="handleSelection(ordernoObj)"
|
|
|
+ @click="handleSelection(ordernoObj, 1)"
|
|
|
size="large"
|
|
|
type="primary"
|
|
|
+ style="margin-right:10px"
|
|
|
>
|
|
|
项目选择
|
|
|
</Button>
|
|
|
+ <div class="icon-wrapper" v-show="selectedInfo.order_no">
|
|
|
+ <Icon
|
|
|
+ class="icon-close"
|
|
|
+ @click="handleCancelSelected('order_no')"
|
|
|
+ size="24"
|
|
|
+ type="md-close"
|
|
|
+ />
|
|
|
+ <div>
|
|
|
+ <span>订单编号：</span>
|
|
|
+ <span>{{ selectedInfo.order_no }}</span>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>项目名称：</span>
|
|
|
+ <span>{{ selectedInfo.project_name }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="fullscreen-content-select-block">
|
|
|
- <Button @click="handleSelection(urlObj)" size="large" type="primary">
|
|
|
+ <Button
|
|
|
+ @click="handleSelection(urlObj, 2)"
|
|
|
+ size="large"
|
|
|
+ type="primary"
|
|
|
+ style="margin-right:10px"
|
|
|
+ >
|
|
|
图号选择
|
|
|
</Button>
|
|
|
+ <div style="display: flex;align-items: center">
|
|
|
+ <div class="icon-wrapper">
|
|
|
+ <div v-show="selectedInfo.url_no">
|
|
|
+ <Icon
|
|
|
+ class="icon-close"
|
|
|
+ @click="handleCancelSelected('url_no')"
|
|
|
+ size="24"
|
|
|
+ type="md-close"
|
|
|
+ />
|
|
|
+ <span>图号：</span>
|
|
|
+ <span>{{ selectedInfo.url_no }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="fullscreen-content-select-block">
|
|
|
<Button
|
|
|
@click="handleSelectionRowno(rownoObj)"
|
|
|
size="large"
|
|
|
type="primary"
|
|
|
+ style="margin-right:10px"
|
|
|
>
|
|
|
行号选择
|
|
|
</Button>
|
|
|
+ <div
|
|
|
+ class="icon-wrapper"
|
|
|
+ v-show="selectedInfo.row_no.length != 0"
|
|
|
+ style="display: flex;align-items: center"
|
|
|
+ >
|
|
|
+ <span>行号：</span>
|
|
|
+ <div style="display:flex;justify-content: flex-start;">
|
|
|
+ <div v-for="(item, index) in selectedInfo.row_no" :key="item.key">
|
|
|
+ <div class="icon-wrapper" style="margin-right:0.35rem">
|
|
|
+ <Icon
|
|
|
+ class="icon-close"
|
|
|
+ @click="handleCancelSelected(index, 1)"
|
|
|
+ size="24"
|
|
|
+ type="md-close"
|
|
|
+ />
|
|
|
+ <span style="display:inline-block"
|
|
|
+ >{{ item.start }}-{{ item.end }}</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="fullscreen-content-choose">
|
|
|
- <swiper
|
|
|
- :slides-per-view="3"
|
|
|
- :space-between="50"
|
|
|
- @swiper="onSwiper"
|
|
|
- @slideChange="onSlideChange"
|
|
|
- >
|
|
|
- <swiper-slide>Slide 1</swiper-slide>
|
|
|
- <swiper-slide>Slide 2</swiper-slide>
|
|
|
- <swiper-slide>Slide 3</swiper-slide>
|
|
|
- ...
|
|
|
- </swiper>
|
|
|
<div
|
|
|
:class="[
|
|
|
choose.isChoosed
|
|
|
@@ -111,6 +159,14 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class="fullscreen-content-page">
|
|
|
+ <Page
|
|
|
+ @on-change="changePage"
|
|
|
+ :current="page_index"
|
|
|
+ show-total
|
|
|
+ :total="total"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div slot="footer"></div>
|
|
|
<Modal
|
|
|
@@ -120,8 +176,18 @@
|
|
|
width="80%"
|
|
|
>
|
|
|
<div class="selection-modal-top">
|
|
|
- <Input :placeholder="currencySelectedObj.title" style="width: 80%">
|
|
|
- <Icon type="ios-search" slot="suffix" />
|
|
|
+ <Input
|
|
|
+ :placeholder="currencySelectedObj.title"
|
|
|
+ v-model="currentSearchValue"
|
|
|
+ style="width: 80%"
|
|
|
+ >
|
|
|
+ <Icon
|
|
|
+ @click="
|
|
|
+ handleCurrentSearch(currencySelectedObj, currentSearchValue)
|
|
|
+ "
|
|
|
+ type="ios-search"
|
|
|
+ slot="suffix"
|
|
|
+ />
|
|
|
</Input>
|
|
|
</div>
|
|
|
<div class="selection-modal-body">
|
|
|
@@ -146,7 +212,7 @@
|
|
|
返回
|
|
|
</Button>
|
|
|
<Button @click="back" type="primary">
|
|
|
- 返回
|
|
|
+ 确认
|
|
|
</Button>
|
|
|
</div>
|
|
|
</Modal>
|
|
|
@@ -158,11 +224,18 @@
|
|
|
>
|
|
|
<div class="selection-rowno-modal-body"></div>
|
|
|
<div slot="footer">
|
|
|
- <Button @click="back" type="primary" style="margin-right:10px">
|
|
|
+ <Button
|
|
|
+ @click="selectionModal = false"
|
|
|
+ type="primary"
|
|
|
+ style="margin-right:10px"
|
|
|
+ >
|
|
|
返回
|
|
|
</Button>
|
|
|
- <Button @click="back" type="primary">
|
|
|
- 返回
|
|
|
+ <Button
|
|
|
+ @click="handleSelectionComfirm(currencySelectedObj)"
|
|
|
+ type="primary"
|
|
|
+ >
|
|
|
+ 确认
|
|
|
</Button>
|
|
|
</div>
|
|
|
</Modal>
|
|
|
@@ -172,15 +245,12 @@
|
|
|
<script>
|
|
|
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
|
|
|
// 例如：import 《组件名称》 from '《组件路径》';
|
|
|
-import { Swiper, SwiperSlide } from "swiper/vue";
|
|
|
-import "swiper/css";
|
|
|
+
|
|
|
+import "swiper/css/swiper.css";
|
|
|
|
|
|
export default {
|
|
|
name: "",
|
|
|
- components: {
|
|
|
- Swiper,
|
|
|
- SwiperSlide,
|
|
|
- },
|
|
|
+ components: {},
|
|
|
props: {},
|
|
|
// import引入的组件需要注入到对象中才能使用
|
|
|
data() {
|
|
|
@@ -265,42 +335,6 @@ export default {
|
|
|
num: 3,
|
|
|
isChoosed: false,
|
|
|
},
|
|
|
- {
|
|
|
- row: 9,
|
|
|
- part_title: "部件名称1",
|
|
|
- detail_part_title: "零部件名称1",
|
|
|
- wool_size: "1*2*3",
|
|
|
- measure_size: "11*22*33",
|
|
|
- num: 3,
|
|
|
- isChoosed: false,
|
|
|
- },
|
|
|
- {
|
|
|
- row: 10,
|
|
|
- part_title: "部件名称1",
|
|
|
- detail_part_title: "零部件名称1",
|
|
|
- wool_size: "1*2*3",
|
|
|
- measure_size: "11*22*33",
|
|
|
- num: 3,
|
|
|
- isChoosed: false,
|
|
|
- },
|
|
|
- {
|
|
|
- row: 11,
|
|
|
- part_title: "部件名称1",
|
|
|
- detail_part_title: "零部件名称1",
|
|
|
- wool_size: "1*2*3",
|
|
|
- measure_size: "11*22*33",
|
|
|
- num: 3,
|
|
|
- isChoosed: false,
|
|
|
- },
|
|
|
- {
|
|
|
- row: 12,
|
|
|
- part_title: "部件名称1",
|
|
|
- detail_part_title: "零部件名称1",
|
|
|
- wool_size: "1*2*3",
|
|
|
- measure_size: "11*22*33",
|
|
|
- num: 3,
|
|
|
- isChoosed: false,
|
|
|
- },
|
|
|
],
|
|
|
selectedObj: [],
|
|
|
ordernoObj: {
|
|
|
@@ -355,11 +389,39 @@ export default {
|
|
|
],
|
|
|
hasChild: true,
|
|
|
},
|
|
|
- rownoObj: {},
|
|
|
+ rownoObj: {
|
|
|
+ order_no: "20211010",
|
|
|
+ project_name: "2",
|
|
|
+ url_no: "3",
|
|
|
+ row_no: [],
|
|
|
+ },
|
|
|
currencySelectedObj: {
|
|
|
title: "订单编号/项目名称选择",
|
|
|
+ type: 1,
|
|
|
list: [],
|
|
|
},
|
|
|
+ selectedInfo: {
|
|
|
+ order_no: "20211010",
|
|
|
+ project_name: "2",
|
|
|
+ url_no: "3",
|
|
|
+ row_no: [
|
|
|
+ { start: 1, end: 2, key: "1" },
|
|
|
+ { start: 1, end: 3, key: "2" },
|
|
|
+ { start: 1, end: 3, key: "3" },
|
|
|
+ { start: 1, end: 3, key: "4" },
|
|
|
+ { start: 1, end: 3, key: "5" },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ swiperOptions: {
|
|
|
+ pagination: {
|
|
|
+ el: ".swiper-pagination",
|
|
|
+ },
|
|
|
+ // Some Swiper option/callback...
|
|
|
+ },
|
|
|
+ page_index: 1,
|
|
|
+ page_size: 12,
|
|
|
+ total: 0,
|
|
|
+ currentSearchValue: "",
|
|
|
};
|
|
|
},
|
|
|
// 生命周期 - 创建完成（可以访问当前this实例）
|
|
|
@@ -370,11 +432,28 @@ export default {
|
|
|
back() {
|
|
|
this.$router.go(-1);
|
|
|
},
|
|
|
- handleSelection(obj) {
|
|
|
+ handleSelection(obj, type) {
|
|
|
this.currencySelectedObj = obj;
|
|
|
this.selectionModal = true;
|
|
|
+ this.currencySelectedObj.type = type;
|
|
|
+ if (this.currencySelectedObj.list.length == 0) {
|
|
|
+ this.handleCurrentSearch(
|
|
|
+ this.currencySelectedObj,
|
|
|
+ this.currentSearchValue
|
|
|
+ );
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleSelectionRowno(row) {
|
|
|
+ console.log(`row`, row);
|
|
|
+ this.selectionRownolModal = true;
|
|
|
+ },
|
|
|
+ handleCancelSelected(v, type) {
|
|
|
+ if (type) {
|
|
|
+ this.selectedInfo.row_no.splice(v, 1);
|
|
|
+ } else {
|
|
|
+ this.selectedInfo[v] = "";
|
|
|
+ }
|
|
|
},
|
|
|
- handleSelectionRowno() {},
|
|
|
handleChooseBlockClick(row) {
|
|
|
if (row.isChoosed) {
|
|
|
row.isChoosed = false;
|
|
|
@@ -440,6 +519,45 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
+ handleCurrentSearch(row, val) {
|
|
|
+ console.log(`row`, row);
|
|
|
+ //type 1项目选择 2图号选择
|
|
|
+ let api = row.type == 1 ? "api1" : "api2";
|
|
|
+ this.axios({
|
|
|
+ method: "get",
|
|
|
+ url: "/api/todo",
|
|
|
+ params: {
|
|
|
+ todoval: val,
|
|
|
+ },
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ row.list = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleSelectionComfirm(row) {
|
|
|
+ // 这里需要把弹框关闭之后赋值到selectedInfo上
|
|
|
+ this.selectedInfo.order_no;
|
|
|
+ // order_no: "20211010",
|
|
|
+ // project_name: "2",
|
|
|
+ // url_no: "3",
|
|
|
+ // row_no: [],
|
|
|
+ },
|
|
|
+ handleGetPrintInfo(row) {
|
|
|
+ this.axios({
|
|
|
+ method: "get",
|
|
|
+ url: "/api/todo",
|
|
|
+ params: { ...row },
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ // todo
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ changePage(e) {
|
|
|
+ this.pageIndex = e;
|
|
|
+ // this.initData();
|
|
|
+ },
|
|
|
},
|
|
|
// 监听属性 类似于data概念
|
|
|
computed: {},
|
|
|
@@ -467,6 +585,17 @@ export default {
|
|
|
justify-content: space-around;
|
|
|
padding-bottom: 16px;
|
|
|
border-bottom: 1px solid #e8eaec;
|
|
|
+ .fullscreen-content-select-block {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .fullscreen-content-select-block:nth-child(1),
|
|
|
+ .fullscreen-content-select-block:nth-child(2) {
|
|
|
+ width: 25%;
|
|
|
+ }
|
|
|
+ .fullscreen-content-select-block:nth-child(3) {
|
|
|
+ }
|
|
|
}
|
|
|
.fullscreen-content-choose {
|
|
|
display: flex;
|
|
|
@@ -492,6 +621,10 @@ export default {
|
|
|
background-color: white;
|
|
|
}
|
|
|
}
|
|
|
+ .fullscreen-content-page {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
}
|
|
|
.selection-modal {
|
|
|
.selection-modal-top {
|
|
|
@@ -518,4 +651,31 @@ export default {
|
|
|
.selection-rowno-modal-body {
|
|
|
}
|
|
|
}
|
|
|
+.icon-wrapper {
|
|
|
+ position: relative;
|
|
|
+ font-size: 0.5rem;
|
|
|
+}
|
|
|
+.icon-close {
|
|
|
+ position: absolute;
|
|
|
+ right: -0.35rem;
|
|
|
+ top: -0.2rem;
|
|
|
+}
|
|
|
+/deep/.ivu-page-item {
|
|
|
+ display: inline-block;
|
|
|
+ font-size: 0.5rem;
|
|
|
+ height: 0.8rem;
|
|
|
+ line-height: 0.8rem;
|
|
|
+ width: 0.8rem;
|
|
|
+}
|
|
|
+/deep/.ivu-page-prev,
|
|
|
+/deep/.ivu-page-next {
|
|
|
+ display: inline-block;
|
|
|
+ font-size: 0.5rem;
|
|
|
+ height: 0.8rem;
|
|
|
+ line-height: 0.8rem;
|
|
|
+ width: 0.8rem;
|
|
|
+ a {
|
|
|
+ font-size: 0.5rem;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
Andy