| | |
| | | <template> |
| | | <div class="rightContent"> |
| | | <div class="top"> |
| | | <SearchCommonView :show-add="false" :placeholder="'请输入业务类型'" :amount-view="false" @searchClick="getList" /> |
| | | <SearchCommonView :show-add="false" :placeholder="'请输入业务类型'" |
| | | :amount-view="false" :showSreen="false" :searchTaskMap="SelectClick" |
| | | :screenArray="screenArray" |
| | | @switchKeywords="switchKeywordsList" |
| | | @delSelectClick="delSelectClick" @searchClick="getList" /> |
| | | </div> |
| | | <div class="content"> |
| | | <div class="list-view"> |
| | |
| | | :class="{ |
| | | overview_active: item.baseOperationType === 1, |
| | | overview_done: item.baseOperationType === 2, |
| | | overview_todo: item.baseOperationType === 3 |
| | | overview_todo: item.baseOperationType === 3, |
| | | }" |
| | | @click="labelClick(item)" |
| | | > |
| | |
| | | </div> |
| | | <div class="right"> |
| | | <div class="right_status" @click.stop="statusClick(item, 4)"> |
| | | <span style="cursor: pointer">{{ item.finishCount + " 完成" }}</span> |
| | | <span style="cursor: pointer">{{ item.finishCount + ' 完成' }}</span> |
| | | </div> |
| | | <!-- <div class="right_status" style="margin-top: 5px"> |
| | | <span style="cursor: pointer">4 延期</span> |
| | |
| | | </div> |
| | | <div class="right"> |
| | | <div class="right_status" @click.stop="statusClick(item, 5)"> |
| | | <span style="cursor: pointer">{{ item.cancelCount + " 已取消" }}</span> |
| | | <span style="cursor: pointer">{{ item.cancelCount + ' 已取消' }}</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import pageMixin from "@/components/makepager/pager/mixin/pageMixin" |
| | | import { getOperationType } from "@/api/overview/overview" |
| | | |
| | | export default { |
| | | name: "OverView", |
| | | mixins: [pageMixin], |
| | | props: {}, |
| | | components: {}, |
| | | computed: {}, |
| | | data() { |
| | | return { |
| | | tableList: [], |
| | | editConfig: { |
| | | visible: false, |
| | | title: "新建", |
| | | infomation: {}, |
| | | keyword: "" |
| | | }, |
| | | pageSizes: [30, 45] |
| | | } |
| | | }, |
| | | created() { |
| | | this.pagerOptions.pageSize = 30 |
| | | this.getData() |
| | | }, |
| | | methods: { |
| | | getList(val) { |
| | | console.log(val) |
| | | this.keyword = val |
| | | this.getData() |
| | | }, |
| | | labelClick(item, status) { |
| | | console.log(item) |
| | | this.$router.push({ |
| | | name: "overviewList", |
| | | query: { name: item.name, workType: item.baseOperationType+'', id: item.id+'', status: status,code:item.warehouse.code } |
| | | }) |
| | | }, |
| | | async getData() { |
| | | await getOperationType({ |
| | | keyword: this.keyword, |
| | | page: this.pagerOptions.currPage, |
| | | pageSize: this.pagerOptions.pageSize |
| | | }).then((res) => { |
| | | if (res.code === 200) { |
| | | const list = res.data.map((item) => { |
| | | return { |
| | | ...item |
| | | } |
| | | }) |
| | | this.tableList = list || [] |
| | | this.pagerOptions.totalCount = res.total |
| | | } |
| | | }) |
| | | }, |
| | | handleCommand(val) { |
| | | console.log(val) |
| | | if (val.command === "全部") { |
| | | this.labelClick(val.item, "") |
| | | } else { |
| | | this.labelClick(val.item, val.command) |
| | | import pageMixin from '@/components/makepager/pager/mixin/pageMixin' |
| | | import { getOperationType } from '@/api/overview/overview' |
| | | import { getWarehouseList } from '@/api/warehouseManage/warehouse.js' |
| | | import Cookies from 'js-cookie' |
| | | export default { |
| | | name: 'OverView', |
| | | mixins: [pageMixin], |
| | | props: {}, |
| | | components: {}, |
| | | computed: {}, |
| | | data() { |
| | | return { |
| | | tableList: [], |
| | | editConfig: { |
| | | visible: false, |
| | | title: '新建', |
| | | infomation: {}, |
| | | keyword: '', |
| | | }, |
| | | screenArray: [], |
| | | SelectClick: [], |
| | | pageSizes: [30, 45], |
| | | } |
| | | }, |
| | | // 更多 |
| | | moreClick() {}, |
| | | // 状态 |
| | | statusClick(item, status) { |
| | | console.log(item) |
| | | this.labelClick(item, status) |
| | | } |
| | | created() { |
| | | this.pagerOptions.pageSize = 30 |
| | | this.queryWareHouse() |
| | | const username = Cookies.get('username') |
| | | this.SelectClick = JSON.parse(localStorage.getItem(username) || '[]') |
| | | this.getData() |
| | | }, |
| | | methods: { |
| | | getList(val) { |
| | | console.log(val) |
| | | this.keyword = val |
| | | this.getData() |
| | | }, |
| | | labelClick(item, status) { |
| | | console.log(item) |
| | | this.$router.push({ |
| | | name: 'overviewList', |
| | | query: { name: item.name, warehouseId:item.warehouseId,workType: item.baseOperationType + '', id: item.id + '', status: status, code: item.warehouse.code }, |
| | | }) |
| | | }, |
| | | async getData() { |
| | | //筛选id数组 |
| | | let $arr = []; |
| | | this.SelectClick.forEach((e) => { |
| | | $arr.push(e.id) |
| | | }); |
| | | await getOperationType({ |
| | | keyword: this.keyword, |
| | | page: this.pagerOptions.currPage, |
| | | pageSize: this.pagerOptions.pageSize, |
| | | warehouseIds:$arr.join(',') |
| | | }).then((res) => { |
| | | if (res.code === 200) { |
| | | const list = res.data.map((item) => { |
| | | return { |
| | | ...item, |
| | | } |
| | | }) |
| | | this.tableList = list || [] |
| | | this.pagerOptions.totalCount = res.total |
| | | } |
| | | }) |
| | | }, |
| | | async queryWareHouse() { |
| | | const { code, data } = await getWarehouseList({ page: 0, pageSize: 0, keyword: '' }) |
| | | this.screenArray = [] |
| | | if (code === 200) { |
| | | data.forEach((e) => { |
| | | this.screenArray.push({ |
| | | id: e.id, |
| | | title: e.name, |
| | | }) |
| | | }) |
| | | } |
| | | }, |
| | | handleCommand(val) { |
| | | if (val.command === '全部') { |
| | | this.labelClick(val.item, '') |
| | | } else { |
| | | this.labelClick(val.item, val.command) |
| | | } |
| | | }, |
| | | // 更多 |
| | | moreClick() {}, |
| | | // 状态 |
| | | statusClick(item, status) { |
| | | this.labelClick(item, status) |
| | | }, |
| | | //筛选 |
| | | switchKeywordsList(item) { |
| | | this.SelectClick = item |
| | | const username = Cookies.get('username') |
| | | localStorage.setItem(username, JSON.stringify(item)) |
| | | this.getData() |
| | | }, |
| | | //删除筛选 |
| | | delSelectClick(item) { |
| | | this.SelectClick.forEach((e, i) => { |
| | | if (e.id == item.id) { |
| | | this.SelectClick.splice(i, 1) |
| | | } |
| | | }) |
| | | const username = Cookies.get('username') |
| | | if (this.SelectClick.length > 0) { |
| | | localStorage.setItem(username, JSON.stringify(this.SelectClick)) |
| | | } else { |
| | | localStorage.removeItem(username) |
| | | } |
| | | this.getData() |
| | | }, |
| | | }, |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <!-- Add "scoped" attribute to limit CSS to this component only --> |
| | | <style lang="scss" scoped> |
| | | .content { |
| | | height: calc(100% - 112px); |
| | | background: #fff; |
| | | border-radius: 12px; |
| | | .list-view { |
| | | padding: 20px 0 0px 20px; |
| | | height: calc(100% - 70px); |
| | | overflow: auto; |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | justify-content: flex-start; |
| | | align-content: flex-start; |
| | | .overview-box { |
| | | min-width: 308px; |
| | | height: 140px; |
| | | margin-bottom: 10px; |
| | | margin-right: 20px; |
| | | border: 1px solid #dee2e6; |
| | | box-shadow: inset 0 0 2px #dee2e6; |
| | | -moz-box-shadow: inset 0 0 2px #dee2e6; |
| | | -webkit-box-shadow: inset 0 0 2px #dee2e6; |
| | | cursor: pointer; |
| | | .top { |
| | | height: 35px; |
| | | line-height: 35px; |
| | | display: flex; |
| | | .label { |
| | | margin-left: 20px; |
| | | } |
| | | .set { |
| | | margin-left: auto; |
| | | margin-right: 20px; |
| | | font-size: 20px; |
| | | // cursor: no-drop; |
| | | color: #000; |
| | | transform: rotate(-90deg); |
| | | -moz-transform: rotate(-90deg); |
| | | -webkit-transform: rotate(-90deg); |
| | | } |
| | | } |
| | | .bottom { |
| | | display: flex; |
| | | font-size: 13px; |
| | | margin-top: 30px; |
| | | .left { |
| | | width: 50%; |
| | | // background: #1d80e2; |
| | | .left_view { |
| | | .content { |
| | | height: calc(100% - 112px); |
| | | background: #fff; |
| | | border-radius: 12px; |
| | | .list-view { |
| | | padding: 20px 0 0px 20px; |
| | | height: calc(100% - 70px); |
| | | overflow: auto; |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | justify-content: flex-start; |
| | | align-content: flex-start; |
| | | .overview-box { |
| | | min-width: 308px; |
| | | height: 140px; |
| | | margin-bottom: 10px; |
| | | margin-right: 20px; |
| | | border: 1px solid #dee2e6; |
| | | box-shadow: inset 0 0 2px #dee2e6; |
| | | -moz-box-shadow: inset 0 0 2px #dee2e6; |
| | | -webkit-box-shadow: inset 0 0 2px #dee2e6; |
| | | cursor: pointer; |
| | | .top { |
| | | height: 35px; |
| | | line-height: 35px; |
| | | display: flex; |
| | | .label { |
| | | margin-left: 20px; |
| | | height: 30px; |
| | | line-height: 30px; |
| | | padding: 0 5px; |
| | | width: 70px; |
| | | text-align: center; |
| | | color: #fff; |
| | | background: #081e44; |
| | | border-radius: 4px; |
| | | cursor: pointer; |
| | | } |
| | | .set { |
| | | margin-left: auto; |
| | | margin-right: 20px; |
| | | font-size: 20px; |
| | | // cursor: no-drop; |
| | | color: #000; |
| | | transform: rotate(-90deg); |
| | | -moz-transform: rotate(-90deg); |
| | | -webkit-transform: rotate(-90deg); |
| | | } |
| | | } |
| | | .right { |
| | | width: 25%; |
| | | .right_status { |
| | | margin-top: 5px; |
| | | .bottom { |
| | | display: flex; |
| | | font-size: 13px; |
| | | margin-top: 30px; |
| | | .left { |
| | | width: 50%; |
| | | // background: #1d80e2; |
| | | .left_view { |
| | | margin-left: 20px; |
| | | height: 30px; |
| | | line-height: 30px; |
| | | padding: 0 5px; |
| | | width: 70px; |
| | | text-align: center; |
| | | color: #fff; |
| | | background: #081e44; |
| | | border-radius: 4px; |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | .right { |
| | | width: 25%; |
| | | .right_status { |
| | | margin-top: 5px; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | .overview_active { |
| | | border-left: 4px solid #1d80e2; |
| | | } |
| | | .overview_done { |
| | | border-left: 4px solid #1de27f; |
| | | } |
| | | .overview_todo { |
| | | border-left: 4px solid #e2441d; |
| | | .overview_active { |
| | | border-left: 4px solid #1d80e2; |
| | | } |
| | | .overview_done { |
| | | border-left: 4px solid #1de27f; |
| | | } |
| | | .overview_todo { |
| | | border-left: 4px solid #e2441d; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | .btn-pager { |
| | | margin-top: 0; |
| | | } |
| | | .btn-pager { |
| | | margin-top: 0; |
| | | } |
| | | </style> |