资产管理、用品管理

src/views/administrative-management/asset-management/assetAdd.vue

@@ -0,0 +1,196 @@
+<template>
+  <div>
+    <a-drawer
+      title="新增"
+      placement="right"
+      :closable="false"
+      :visible="visible"
+      width="600"
+      :maskClosable="false"
+    >
+      <a-form-model ref="ruleForm" :model="form" :rules="rules">
+        <a-row :gutter="24">
+          <a-col :span="24">
+            <a-form-model-item
+              :label-col="labelCol"
+              :wrapper-col="wrapperCol"
+              label="名称"
+              prop="name"
+              style="width:100%"
+            >
+              <a-input v-model="form.name" placeholder="请输入名称" />
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="24">
+            <a-form-model-item
+              :label-col="labelCol"
+              :wrapper-col="wrapperCol"
+              label="类别"
+              style="width:100%"
+            >
+              <a-select show-search placeholder="请选择类别" style="width: 100%" v-model="form.type">
+                <a-select-option value="电脑类">电脑类</a-select-option>
+                <a-select-option value="电器类">电器类</a-select-option>
+                <a-select-option value="电子档案">电子档案</a-select-option>
+                <a-select-option value="电子设备">电子设备</a-select-option>
+                <a-select-option value="房屋建筑">房屋建筑</a-select-option>
+                <a-select-option value="机器设备">机器设备</a-select-option>
+                <a-select-option value="家具用具">家具用具</a-select-option>
+                <a-select-option value="其他物品">其他物品</a-select-option>
+              </a-select>
+            </a-form-model-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24">
+          <a-col :span="24">
+            <a-form-model-item
+              :label-col="labelCol"
+              :wrapper-col="wrapperCol"
+              label="编号"
+              prop="code"
+              style="width:100%"
+            >
+              <a-input v-model="form.code" placeholder="请输入编号" />
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="24">
+            <a-form-model-item
+              :label-col="labelCol"
+              :wrapper-col="wrapperCol"
+              label="来源"
+              placeholder="请选择来源"
+              style="width:100%"
+            >
+              <a-select show-search placeholder="请选择" style="width: 100%" v-model="form.source">
+                <a-select-option value="电脑类">电脑类</a-select-option>
+                <a-select-option value="电器类">电器类</a-select-option>
+                <a-select-option value="电子档案">电子档案</a-select-option>
+                <a-select-option value="电子设备">电子设备</a-select-option>
+                <a-select-option value="房屋建筑">房屋建筑</a-select-option>
+                <a-select-option value="机器设备">机器设备</a-select-option>
+                <a-select-option value="家具用具">家具用具</a-select-option>
+                <a-select-option value="其他物品">其他物品</a-select-option>
+              </a-select>
+            </a-form-model-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24">
+          <a-col :span="24">
+            <a-form-model-item
+              :label-col="labelCol"
+              :wrapper-col="wrapperCol"
+              label="单价"
+              style="width:100%"
+            >
+              <a-input-number
+                placeholder="请输入单价"
+                :default-value="0"
+                :formatter="value => `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')"
+                :parser="value => value.replace(/\$\s?|(,*)/g, '')"
+                v-model="form.unitPrice"
+                :min="0"
+              />
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="24">
+            <a-form-model-item
+              :label-col="labelCol"
+              :wrapper-col="wrapperCol"
+              label="状态"
+              style="width:100%"
+            >
+              <a-select show-search placeholder="请选择" style="width: 100%" v-model="form.state">
+                <a-select-option value="正常">正常</a-select-option>
+                <a-select-option value="维修">维修</a-select-option>
+                <a-select-option value="报废">报废</a-select-option>
+              </a-select>
+            </a-form-model-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24">
+          <a-col :span="24">
+            <a-form-model-item
+              :label-col="labelCol"
+              :wrapper-col="wrapperCol"
+              label="领用人"
+              style="width:100%"
+            >
+              <a-input v-model="form.receiver" placeholder="请输入领用人" />
+            </a-form-model-item>
+          </a-col>
+        </a-row>
+      </a-form-model>
+      <!-- 底部按钮 -->
+      <div
+        :style="{
+          position: 'absolute',
+          right: 0,
+          bottom: 0,
+          width: '100%',
+          borderTop: '1px solid #e9e9e9',
+          padding: '10px 16px',
+          background: '#fff',
+          textAlign: 'right',
+          zIndex: 1,
+        }"
+      >
+        <a-button :style="{ marginRight: '8px' }" @click="close">关闭</a-button>
+        <a-button type="primary" @click="save">保存</a-button>
+      </div>
+    </a-drawer>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 }
+      },
+      visible: false,
+      //表单属性
+      form: {
+        name: '',
+        type: '',
+        code: '',
+        source: '',
+        unitPrice: '',
+        state: '',
+        receiver: ''
+      },
+      //表单校验
+      rules: {
+        name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
+        code: [{ required: true, message: '请输入编码', trigger: 'blur' }]
+      }
+    }
+  },
+  methods: {
+    //打开抽屉
+    showDrawer() {
+      this.visible = true
+    },
+    //保存按钮
+    save() {
+      this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          //校验成功
+          console.log(this.form)
+        } else {
+          return false
+        }
+      })
+    },
+    //关闭按钮
+    close() {
+      this.$refs.ruleForm.resetFields()
+      this.visible = false
+    }
+  }
+}
+</script>

src/views/administrative-management/assetAdd.vue

@@ -1,104 +0,0 @@
-<template>
-  <div>
-    <a-drawer
-      title="新增"
-      placement="right"
-      :closable="false"
-      :visible="visible"
-      width="800"
-      :maskClosable="false"
-    >
-      <a-form-model layout="inline" ref="ruleForm" :model="form" :rules="rules">
-        <a-row :gutter="24">
-          <a-col :span="12">
-            <a-form-model-item
-              :label-col="{span:8}"
-              :wrapper-col="{ span: 16}"
-              label="名称"
-              prop="name"
-              style="width:100%"
-            >
-              <a-input v-model="form.name" />
-            </a-form-model-item>
-          </a-col>
-          <a-col :span="12">
-            <a-form-model-item
-              :label-col="{span:8}"
-              :wrapper-col="{ span: 16}"
-              label="类别"
-              style="width:100%"
-            >
-              <a-select show-search placeholder="请选择" style="width: 100%" v-model="form.type">
-                <a-select-option value="电脑类">电脑类</a-select-option>
-                <a-select-option value="电器类">电器类</a-select-option>
-                <a-select-option value="电子档案">电子档案</a-select-option>
-                <a-select-option value="电子设备">电子设备</a-select-option>
-                <a-select-option value="房屋建筑">房屋建筑</a-select-option>
-                <a-select-option value="机器设备">机器设备</a-select-option>
-                <a-select-option value="家具用具">家具用具</a-select-option>
-                <a-select-option value="其他物品">其他物品</a-select-option>
-              </a-select>
-            </a-form-model-item>
-          </a-col>
-        </a-row>
-      </a-form-model>
-      <!-- 底部按钮 -->
-      <div
-        :style="{
-          position: 'absolute',
-          right: 0,
-          bottom: 0,
-          width: '100%',
-          borderTop: '1px solid #e9e9e9',
-          padding: '10px 16px',
-          background: '#fff',
-          textAlign: 'right',
-          zIndex: 1,
-        }"
-      >
-        <a-button :style="{ marginRight: '8px' }" @click="close">关闭</a-button>
-        <a-button type="primary" @click="save">保存</a-button>
-      </div>
-    </a-drawer>
-  </div>
-</template>
-<script>
-export default {
-  data() {
-    return {
-      visible: false,
-      //表单属性
-      form: {
-        name: '',
-        type: ''
-      },
-      //表单校验
-      rules: {
-        name: [{ required: true, message: '请输入名称', trigger: 'blur' }]
-      }
-    }
-  },
-  methods: {
-    //打开抽屉
-    showDrawer() {
-      this.visible = true
-    },
-    //保存按钮
-    save() {
-      this.$refs.ruleForm.validate(valid => {
-        if (valid) {
-          //校验成功
-          console.log(this.form)
-        } else {
-          return false
-        }
-      })
-    },
-    //关闭按钮
-    close() {
-      //   this.$refs.ruleForm.resetFields()
-      this.visible = false
-    }
-  }
-}
-</script>

src/views/administrative-management/supplies-management/supplies-list/suppliesAdd.vue

@@ -0,0 +1,156 @@
+<template>
+  <div>
+    <a-drawer
+      title="新增"
+      placement="right"
+      :closable="false"
+      :visible="visible"
+      width="600"
+      :maskClosable="false"
+    >
+      <a-form-model ref="ruleForm" :model="form" :rules="rules">
+        <a-row :gutter="24">
+          <a-col :span="24">
+            <a-form-model-item
+              :label-col="labelCol"
+              :wrapper-col="wrapperCol"
+              label="名称"
+              prop="name"
+              style="width:100%"
+            >
+              <a-input v-model="form.name" placeholder="请输入名称" />
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="24">
+            <a-form-model-item
+              :label-col="labelCol"
+              :wrapper-col="wrapperCol"
+              label="类别"
+              style="width:100%"
+            >
+              <a-select show-search placeholder="请选择类别" style="width: 100%" v-model="form.type">
+                <a-select-option value="办公耗材">办公耗材</a-select-option>
+                <a-select-option value="办公生活用品">办公生活用品</a-select-option>
+                <a-select-option value="金融用品">金融用品</a-select-option>
+                <a-select-option value="书写工具">书写工具</a-select-option>
+                <a-select-option value="文件管理用品">文件管理用品</a-select-option>
+                <a-select-option value="纸质品">纸质品</a-select-option>
+                <a-select-option value="桌面办公文具">桌面办公文具</a-select-option>
+                <a-select-option value="其他物品">其他物品</a-select-option>
+              </a-select>
+            </a-form-model-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24">
+          <a-col :span="24">
+            <a-form-model-item
+              :label-col="labelCol"
+              :wrapper-col="wrapperCol"
+              label="编号"
+              prop="code"
+              style="width:100%"
+            >
+              <a-input v-model="form.code" placeholder="请输入编号" />
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="24">
+            <a-form-model-item
+              :label-col="labelCol"
+              :wrapper-col="wrapperCol"
+              label="规格"
+              style="width:100%"
+            >
+              <a-input v-model="form.specifications" placeholder="请输入规格" />
+            </a-form-model-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24">
+          <a-col :span="24">
+            <a-form-model-item
+              :label-col="labelCol"
+              :wrapper-col="wrapperCol"
+              label="库存数量"
+              style="width:100%"
+            >
+              <a-input-number
+                placeholder="请输入库存数量"
+                :default-value="0"
+                v-model="form.inventoryQuantity"
+                :min="0"
+              />
+            </a-form-model-item>
+          </a-col>
+        </a-row>
+      </a-form-model>
+      <!-- 底部按钮 -->
+      <div
+        :style="{
+          position: 'absolute',
+          right: 0,
+          bottom: 0,
+          width: '100%',
+          borderTop: '1px solid #e9e9e9',
+          padding: '10px 16px',
+          background: '#fff',
+          textAlign: 'right',
+          zIndex: 1,
+        }"
+      >
+        <a-button :style="{ marginRight: '8px' }" @click="close">关闭</a-button>
+        <a-button type="primary" @click="save">保存</a-button>
+      </div>
+    </a-drawer>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 }
+      },
+      visible: false,
+      //表单属性
+      form: {
+        name: '',
+        type: '',
+        code: '',
+        specifications: '',
+        inventoryQuantity: ''
+      },
+      //表单校验
+      rules: {
+        name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
+        code: [{ required: true, message: '请输入编码', trigger: 'blur' }]
+      }
+    }
+  },
+  methods: {
+    //打开抽屉
+    showDrawer() {
+      this.visible = true
+    },
+    //保存按钮
+    save() {
+      this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          //校验成功
+          console.log(this.form)
+        } else {
+          return false
+        }
+      })
+    },
+    //关闭按钮
+    close() {
+      this.$refs.ruleForm.resetFields()
+      this.visible = false
+    }
+  }
+}
+</script>

src/views/administrative-management/supplies-management/supplies-list/suppliesList.vue

@@ -0,0 +1,161 @@
+<template>
+  <div>
+    <!-- 查询区域 -->
+    <a-row :gutter="24">
+      <a-col :span="24" style="padding:5px">
+        <a-card>
+          <div class="table-page-search-wrapper">
+            <a-form layout="inline" @keyup.enter.native="searchQuery">
+              <a-row :gutter="24">
+                <a-col :span="6">
+                  <a-form-item label="名称">
+                    <a-input placeholder="请输入名称查询" v-model="queryParam.name"></a-input>
+                  </a-form-item>
+                </a-col>
+                <a-col :span="18">
+                  <a-button type="primary" @click="searchQuery">查询</a-button>
+                </a-col>
+              </a-row>
+            </a-form>
+          </div>
+        </a-card>
+      </a-col>
+    </a-row>
+    <!-- 表格 -->
+    <a-row :gutter="24">
+      <a-col :span="24" style="padding:5px">
+        <a-card>
+          <!-- 操作按钮区域 -->
+          <div class="table-operator" style="border-top: 5px">
+            <a-button @click="add" type="primary">新增</a-button>
+          </div>
+          <!-- 表格区域 -->
+          <a-table
+            :columns="columns"
+            :row-key="record => record.id"
+            :data-source="dataPageList"
+            :pagination="pagination"
+            :loading="loading"
+            @change="handleTableChange"
+          >
+            <!-- 操作 -->
+            <span slot="actionSlot" slot-scope="text, record">
+              <a @click="edit(record)">编辑</a>
+              <a-divider type="vertical" />
+              <!-- 更多 -->
+              <a-dropdown>
+                <a class="ant-dropdown-link">
+                  更多
+                  <a-icon type="down" />
+                </a>
+                <a-menu slot="overlay">
+                  <a-menu-item>
+                    <a href="javascript:;" @click="detail(record)">详情</a>
+                  </a-menu-item>
+                  <a-menu-item>
+                    <a-popconfirm title="确定删除吗?" @confirm="() => delete(record.id)">
+                      <a>删除</a>
+                    </a-popconfirm>
+                  </a-menu-item>
+                </a-menu>
+              </a-dropdown>
+            </span>
+          </a-table>
+        </a-card>
+      </a-col>
+    </a-row>
+    <suppliesAdd ref="suppliesAdd"></suppliesAdd>
+  </div>
+</template>
+
+<script>
+import suppliesAdd from './suppliesAdd'
+export default {
+  components:{
+    suppliesAdd
+  },
+  data() {
+    return {
+      columns: [
+        {
+          title: '名称',
+          dataIndex: 'name',
+          // sorter: true,
+          width: '20%'
+          // scopedSlots: { customRender: 'name' }
+        },
+        {
+          title: '类别',
+          dataIndex: 'type',
+          // filters: [
+          //   { text: 'Male', value: 'male' },
+          //   { text: 'Female', value: 'female' }
+          // ],
+          width: '20%'
+        },
+        {
+          title: '编号',
+          dataIndex: 'code'
+        },
+        {
+          title: '规格',
+          dataIndex: 'specifications'
+        },
+        {
+          title: '库存数量',
+          dataIndex: 'inventoryQuantity'
+        },
+        {
+          title: '操作',
+          dataIndex: 'action',
+          scopedSlots: { customRender: 'actionSlot' }
+        }
+      ],
+      dataPageList: [
+        {
+          id: '123',
+          name: '长尾文件夹',
+          type: '桌面办公文具',
+          code: '1002',
+          specifications: '中号',
+          inventoryQuantity: '98',
+        },
+        {
+          id: '234',
+          name: 'A4打印纸',
+          type: '纸制品',
+          code: '1002',
+          specifications: '幸运鸟',
+          inventoryQuantity: '15',
+        },
+      ], //表格数据集合
+      loading: false, //表格加载
+      pagination: {}, //分页
+      queryParam: {} //查询条件参数对象
+    }
+  },
+  created() {},
+  computed: {},
+  mounted() {},
+  methods: {
+    handleTableChange(pagination, filters, sorter) {
+    },
+    //新增
+    add() {
+      this.$refs.suppliesAdd.showDrawer();
+    },
+    //编辑
+    edit() {},
+    //详情
+    detail() {},
+    //删除
+    delete() {},
+    //查询
+    searchQuery() {
+      this.loading = true
+    }
+  }
+}
+</script>
+<style lang="less" scoped>
+</style>