From 7e460156de73171f9660ce48f80703e79f8b478d Mon Sep 17 00:00:00 2001
From: Crunchy <3114200645@qq.com>
Date: 星期六, 14 六月 2025 11:48:26 +0800
Subject: [PATCH] 初始化提交
---
src/views/out_operation/manual/index.vue | 327 +++++++++++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 321 insertions(+), 6 deletions(-)
diff --git a/src/views/out_operation/manual/index.vue b/src/views/out_operation/manual/index.vue
index 2013519..aed6df7 100644
--- a/src/views/out_operation/manual/index.vue
+++ b/src/views/out_operation/manual/index.vue
@@ -1,15 +1,330 @@
<template>
- <div class="manual">
- 鎵嬪姩鍑哄簱
+ <div class="outOperation">
+ <div class="outOperation-main">
+ <el-row type="flex" align="middle" class="main-top">
+ <el-col :span="2">鍑哄簱鍙拌处</el-col>
+ <el-col :span="20">
+ <div class="table-search">
+ <el-form
+ v-model="queryParams"
+ ref="queryForm"
+ size="small"
+ :inline="true"
+ label-width="68px"
+ >
+ <el-form-item label="鏃ユ湡锛�">
+ <el-date-picker
+ v-model="queryParams.date"
+ type="datetimerange"
+ :picker-options="pickerOptions"
+ range-separator="鑷�"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ align="right"
+ >
+ </el-date-picker>
+ </el-form-item>
+ <el-form-item label="瀹㈡埛鍚嶇О">
+ <el-select v-model="queryParams.type" placeholder="瑙勬牸鍨嬪彿" clearable style="width: 240px">
+ <el-option
+ v-for="item in options"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value">
+ </el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="el-icon-search" size="mini"
+ @click="search">鎼滅储</el-button>
+ <el-button icon="el-icon-refresh" size="mini">瀵煎嚭</el-button>
+ </el-form-item>
+ </el-form>
+ </div>
+ </el-col>
+ </el-row>
+ <el-table
+ :stripe="true"
+ :data="tableData"
+ :cell-style="{ textAlign: 'center' }"
+ :header-cell-style="{ textAlign: 'center' }"
+ :border="true"
+ header-row-class-name="table-header"
+ >
+ <el-table-column
+ type="selection"
+ width="55">
+ </el-table-column>
+ <el-table-column
+ prop="name"
+ label="浜у搧缂栫爜">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="浜у搧鍚嶇О">
+ </el-table-column>
+ <el-table-column
+ prop="date"
+ label="瑙勬牸鍨嬪彿">
+ </el-table-column>
+ <el-table-column
+ prop="date"
+ label="鍗曚綅">
+ </el-table-column>
+ <el-table-column
+ prop="date"
+ label="鍑哄簱鏁伴噺">
+ </el-table-column>
+ <el-table-column
+ prop="date"
+ label="鍙戣揣浜�">
+ </el-table-column>
+ <el-table-column
+ prop="date"
+ label="鍑哄簱鏃ユ湡">
+ </el-table-column>
+ </el-table>
+ </div>
+ <div class="outOperation-foot">
+ <el-pagination
+ :current-page="searchModel.pageNo"
+ :page-sizes="[10, 15, 20, 25]"
+ :page-size="searchModel.pageSize"
+ layout="->, total, sizes, prev, pager, next, jumper"
+ :total="total"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ >
+ </el-pagination>
+ </div>
+ <el-dialog title="鎶艰繍鍗曟墦鍗�" :visible.sync="orderFormVisible">
+ <el-form label-position="left" :model="orderParams">
+ <el-row :gutter="20">
+ <el-col :span="12">
+ <el-form-item label="璁㈠崟鍙�" :label-width="formLabelWidth">
+ <el-input v-model="orderParams.number" autocomplete="off"></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鎶艰繍鍗曠紪鍙�" :label-width="formLabelWidth">
+ <el-input v-model="orderParams.noId" autocomplete="off"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row :gutter="20">
+ <el-col :span="12">
+ <el-form-item label="瀹㈡埛璁㈠崟鍙�" :label-width="formLabelWidth">
+ <el-input v-model="orderParams.clientNumber" autocomplete="off"></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鍙戣揣鏃ユ湡" :label-width="formLabelWidth">
+ <el-input v-model="orderParams.date" autocomplete="off"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row :gutter="20">
+ <el-col :span="12">
+ <el-form-item label="瀹㈡埛鍚嶇О" :label-width="formLabelWidth">
+ <el-input v-model="orderParams.clientName" autocomplete="off"></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鍙戣揣浜�" :label-width="formLabelWidth">
+ <el-input v-model="orderParams.consigner" autocomplete="off"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row :gutter="20">
+ <el-col>
+ <el-form-item label="鍒拌揣鍦板潃" :label-width="formLabelWidth">
+ <el-input v-model="orderParams.address" autocomplete="off"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row :gutter="20">
+ <el-col>
+ <el-form-item label="鏀惰揣鑱旂郴浜�" :label-width="formLabelWidth">
+ <el-input v-model="orderParams.consignee" autocomplete="off"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row :gutter="20">
+ <el-col>
+ <el-form-item label="鎵嬫満鍙�" :label-width="formLabelWidth">
+ <el-input v-model="orderParams.phoneNumber" autocomplete="off"></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row :gutter="20">
+ <el-col>
+ <el-form-item>
+ <el-table :data="tableData" header-row-class-name="table-header">
+ <el-table-column property="date" label="浜у搧鍚嶇О" ></el-table-column>
+ <el-table-column property="name" label="瑙勬牸鍨嬪彿"></el-table-column>
+ <el-table-column property="address" label="鍗曚綅"></el-table-column>
+ <el-table-column property="number" label="鍙戝簱鏁伴噺"></el-table-column>
+ </el-table>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ <div slot="footer" class="dialog-footer" >
+ <el-button type="primary" @click="print">纭� 瀹�</el-button>
+ <el-button @click="addFormVisible = false" >鍙� 娑�</el-button>
+ </div>
+ </el-dialog>
</div>
</template>
<script>
+import { getList } from '@/api/table'
+import TableSearch from '@/components/TableSearch'
export default {
-
+ filters: {
+ statusFilter(status) {
+ const statusMap = {
+ published: 'success',
+ draft: 'gray',
+ deleted: 'danger'
+ }
+ return statusMap[status]
+ }
+ },
+ data() {
+ return {
+ formLabelWidth: '120px',
+ orderFormVisible: false,
+ orderParams: {
+ number: '',//璁㈠崟鍙�
+ noId: '', //鎶艰繍鍗曠紪鍙�
+ orderParams: '', //瀹㈡埛璁㈠崟鍙�
+ date: '',
+ clientName: '',
+ consigner: '',
+ address: '',
+ consignee: '',
+ phoneNumber: ''
+ },
+ total: 0,
+ searchModel: {
+ pageNo: 1,
+ pageSize: 10
+ },
+ tableData: [
+ {
+ date: '2016-05-02',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�',
+ number: ''
+ },
+ {
+ date: '2016-05-02',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�',
+ number: ''
+ },
+ {
+ date: '2016-05-02',
+ name: '鐜嬪皬铏�',
+ address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�',
+ number: ''
+ }
+ ],
+ queryParams: {
+ date: '',
+ type: ''
+ },
+ pickerOptions: {
+ shortcuts: [{
+ text: '鏈�杩戜竴鍛�',
+ onClick(picker) {
+ const end = new Date();
+ const start = new Date();
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+ picker.$emit('pick', [start, end]);
+ }
+ }, {
+ text: '鏈�杩戜竴涓湀',
+ onClick(picker) {
+ const end = new Date();
+ const start = new Date();
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+ picker.$emit('pick', [start, end]);
+ }
+ }, {
+ text: '鏈�杩戜笁涓湀',
+ onClick(picker) {
+ const end = new Date();
+ const start = new Date();
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+ picker.$emit('pick', [start, end]);
+ }
+ }]
+ },
+ options: [
+ {
+ value: '绗竴绉嶅瀷鍙�',
+ label: '绗竴绉嶅瀷鍙�'
+ }
+ ]
+ }
+ },
+ created() {
+ this.fetchData()
+ },
+ components: {
+ TableSearch
+ },
+ methods: {
+ print() {
+ //璐ц繍鍗曟墦鍗板弬鏁�
+ console.log(this.orderParams)
+ },
+ fetchData() {
+ this.listLoading = true
+ getList().then(response => {
+ this.list = response.data.items
+ this.listLoading = false
+ })
+ },
+ handleSizeChange(val) {
+ console.log(`姣忛〉 ${val} 鏉)
+ },
+ handleCurrentChange(val) {
+ console.log(`褰撳墠椤�: ${val}`)
+ },
+ search() {
+ // "鏌ヨ鏉′欢锛�"鏃堕棿闇�瑕佹牸寮忓寲鎴恲yyy-mm-dd hh-mm-ss
+ console.log(this.queryParams)
+ }
+ }
}
</script>
-<style>
-
-</style>
\ No newline at end of file
+<style lang="scss" scoped>
+@import '../../../styles/variables.scss';
+.outOperation {
+ min-height: calc(100vh - 50px);
+ padding: 25px;
+ background: $mainBg;
+ .dialog-footer{
+ text-align: center;
+ }
+ .outOperation-main{
+ background: #fff;
+ padding: 20px;
+ .main-top{}
+ .table-header{
+ background: #6095FB;
+ }
+ }
+ .outOperation-foot{
+ margin-top: 25px;
+ .el-pagination{
+ display: flex;
+ justify-content: center;
+ }
+ }
+}
+</style>
--
Gitblit v1.9.3