Sfoglia il codice sorgente

完成采购-收货地址档案列表,新增页面静态开发

黄梓星 2 anni fa
parent
commit
c023dae4ec

+ 275 - 0
src/views/purchase/deliveryAddress/add.vue

@@ -0,0 +1,275 @@
+<template>
+  <div id="addAddress">
+    <el-form :model="basicForm" :rules="basicRules" ref="basic" label-width="auto">
+      <el-row :gutter="10">
+        <el-col :span="1.5">
+            <el-form-item label="档案编码">
+              <el-input
+                v-model="basicForm.dabm"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+        <el-col :span="1.5">
+            <el-form-item label="收货地址档案名称">
+              <el-input
+                v-model="basicForm.shdzdamc"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="物料一级大类编码">
+              <el-select v-model="basicForm.wlyjflbm" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="物料一级大类名称">
+              <el-select v-model="basicForm.wlyjflmc" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="仓库">
+              <el-select v-model="basicForm.ck" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="仓库属性">
+              <el-select v-model="basicForm.cksx" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="收货地址信息">
+              <el-input
+                v-model="basicForm.shdzxx"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="收货人">
+              <el-input
+                v-model="basicForm.shr"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="收货人电话">
+              <el-input
+                v-model="basicForm.shrdh"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="启用">
+              <el-select v-model="basicForm.qy" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="是否同步NC">
+              <el-select v-model="basicForm.sftbnc" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="备注">
+              <el-input
+                v-model="basicForm.bz"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="创建人">
+              <el-input
+                v-model="basicForm.cjr"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="创建时间">
+              <el-input
+                v-model="basicForm.cjsj"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="最后修改人">
+              <el-input
+                v-model="basicForm.zhxgr"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="最后修改时间">
+              <el-input
+                v-model="basicForm.zhxgsj"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+      </el-row>
+    </el-form>
+
+    <div class="btn_group">
+      <el-col :span="1.5">
+        <el-button type="primary" size="small" plain @click="save" v-if="pageStu == 'add' || pageStu == 'edit'">保存</el-button>
+      </el-col>
+      <el-col :span="1.5" style="margin: 0 10px;">
+        <el-button type="primary" size="small" plain @click="submit" v-if="pageStu == 'edit'">提交</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button size="small" plain @click="back">返回</el-button>
+      </el-col>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'addAddress',
+  props: ['pageStu'],
+  model: {
+    prop: 'isList',
+    event: 'jugislist'
+  },
+  data() {
+    return {
+      basicForm: {
+        dabm: '',
+        shdzdamc: '',
+        wlyjflbm: '',
+        wlyjflmc: '',
+        ck: '',
+        cksx: '',
+        shdzxx: '',
+        shr: '',
+        shrdh: '',
+        qy: '',
+        sftbnc: '',
+        bz: '',
+        cjr: '',
+        cjsj: '',
+        zhxgr: '',
+        zhxgsj: ''
+      },
+      options: [{
+        value: 0, label: '仓库1'
+      }],
+      basicRules: {}
+    }
+  },
+  methods: {
+    save() {},
+    submit() {},
+    back() {
+      this.$emit('jugislist', true)
+      // let queryParams = {
+      //   pageNum: 1,
+      //   pageSize: 10
+      // }
+      // this.$emit('refresh', queryParams)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.btn_group {
+  width: 100%;
+  margin: 20px 0;
+  display: flex;
+  justify-content: center;
+} 
+</style>

+ 255 - 0
src/views/purchase/deliveryAddress/index.vue

@@ -0,0 +1,255 @@
+<template>
+  <div id="deliveryAddressList">
+    <div v-if="isList">
+      <el-form class="search_area" label-width="auto">
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="仓库">
+              <el-select v-model="queryParams.ck" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="仓库属性">
+              <el-select v-model="queryParams.cksx" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="物料一级分类">
+              <el-select v-model="queryParams.wlyjfl" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="收货地址档案名称">
+            <el-input
+              v-model="queryParams.shdzdamc"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="详细地址">
+            <el-input
+              v-model="queryParams.xxdz"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="联系人">
+            <el-input
+              v-model="queryParams.lxr"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="联系人电话">
+            <el-input
+              v-model="queryParams.lxrdh"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="备注">
+            <el-input
+              v-model="queryParams.bz"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="同步状态">
+            <el-input
+              v-model="queryParams.tbzt"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="启用状态">
+              <el-select v-model="queryParams.qyzt" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="" label-width="20px">
+              <el-button type="primary" size="small" icon="el-icon-search" plain>搜索</el-button>
+              <el-button size="small" icon="el-icon-refresh" plain>重置</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+
+      <el-card>
+        <div class="btn_grooup">
+          <el-button type="primary" size="small" @click="addAddress">新增</el-button>
+
+          <el-dropdown size="small" @command="handleCommand">
+            <el-button size="small" type="primary" style="margin-left: 10px;">
+              导入<i class="el-icon-arrow-down el-icon--right"></i>
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item command="数据导入">数据导入</el-dropdown-item>
+              <el-dropdown-item command="模板下载">模板下载</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+
+          <el-dropdown size="small" @command="handleCommand">
+            <el-button size="small" type="primary" style="margin: 0 10px;">
+              导出<i class="el-icon-arrow-down el-icon--right"></i>
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item command="Excel导出">Excel导出</el-dropdown-item>
+              <el-dropdown-item command="导出明细">导出明细</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+
+          <el-button type="primary" size="small">启用</el-button>
+          <el-button type="primary" size="small">停用</el-button>
+          <el-button type="primary" size="small">同步NC</el-button>
+          <el-button type="primary" size="small">删除</el-button>
+          <el-button type="primary" size="small">打印</el-button>
+        </div>
+        <el-table 
+          :data="tableList" 
+          fit
+          max-height="680"
+          @selection-change="handleSelectionChange"
+        >
+          <el-table-column type="selection" width="55" />
+          <el-table-column label="档案编码" align="center" prop="orgId"/>
+          <el-table-column label="收货地址档案名称" align="center" width="200" prop="orgId" />
+          <el-table-column label="仓库名称" align="center" prop="code" />
+          <el-table-column label="详细地址" align="center" width="150" prop="createTime" />
+          <el-table-column label="物料一级大类" align="center" width="150" prop="status"/>
+          <el-table-column label="联系人" align="center" width="150" prop="materialCode" />
+          <el-table-column label="联系电话" align="center" width="150" prop="materialName" />
+          <!-- <el-table-column label="最后审批人" align="center" width="120" prop="approver" />
+          <el-table-column label="最后审核时间" align="center" width="150" prop="approvalTime" /> -->
+          <el-table-column label="备注" align="center" prop="createByName" />
+          <el-table-column label="同步状态" align="center" width="150" prop="createTime" />
+          <el-table-column label="启用状态" align="center" width="120" prop="updateByName" />
+          <el-table-column label="创建人" align="center" width="150" prop="updateTime" />
+          <el-table-column label="创建时间" align="center" width="150" prop="updateTime" />
+          <el-table-column label="最后修改人" align="center" width="150" prop="updateTime" />
+          <el-table-column label="最后修改时间" align="center" width="150" prop="updateTime" />
+        </el-table>
+      </el-card>
+    </div>
+    <Add v-model="isList" v-if="!isList" :pageStu="page"/>
+  </div>
+</template>
+
+<script>
+import Add from './add.vue'
+export default {
+  name: 'deliveryAddress',
+  components: {
+    Add
+  },
+  data() {
+    return {
+      // 页面配置
+      isList: true,
+      // 页面状态
+      page: '',
+      // 搜索框参数
+      queryParams: {
+        ck: '',
+        cksx: '',
+        wlyjfl: '',
+        shdzdamc: '',
+        xxdz: '',
+        lxr: '',
+        lxrdh: '',
+        bz: '',
+        tbzt: '',
+        qyzt: ''
+      },
+      options: [{
+        value: 0, label: '仓库1'
+      }],
+      tableList: []
+    }
+  },
+  methods: {
+    handleSelectionChange() {},
+    handleCommand(command) {
+      alert(command)
+    },
+    addAddress() {
+      this.isList = false
+      this.page = 'add'
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+#deliveryAddressList {
+  height: calc(100vh - 84px);
+  padding: 12px;
+  box-sizing: border-box;
+}
+.btn_grooup {
+  margin-bottom: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
+</style>