✨ feat(设备管理模块):

设备管理模块添加表单

tools/build_out/models/device.py

@@ -32,6 +32,10 @@ class DeviceModel(PrimaryModel):
             'name': self.name,
             'type': self.type,
             'desc': self.desc,
+            "create_by": self.create_by,
+            "update_by": self.update_by,
+            "create_at": self.create_at.strftime("%Y-%m-%d %H:%M:%S") if self.create_at else None,
+            "update_at": self.update_at.strftime("%Y-%m-%d %H:%M:%S") if self.update_at else None,
         }
 
 

tools/build_out/views/device.py

@@ -12,26 +12,31 @@ from webcreator.response import ResponseCode, response_result
 
 class DeviceResourceList(Resource):
     def __init__(self):
-        pass
         # 特殊参数，即不是从json获取参数的接口，可以将这个注释打开
-        # self.parser = RequestParser()
+        self.parser = RequestParser()
 
+    @jwt_required(locations=["headers"])
     def get(self):
         # 特殊参数，即不是从json获取参数的接口，可以将这个注释打开
-        # self.parser.add_argument("page", type=int, location="args", default=1)
-        # self.parser.add_argument("pageSize", type=int, location="args", default=15)
-        # args = self.parser.parse_args()
+        self.parser.add_argument("page", type=int, location="args", default=1)
+        self.parser.add_argument("pageSize", type=int, location="args", default=15)
+        args = self.parser.parse_args()
 
         try:
-            json_payload = request.json
-            logger.warn(json_payload)
-            data = getListDeviceSchema.load(json_payload)
+            data = dict()
+            for key, value in args.items():
+                if value != None:
+                    data[key] = value
+            # json_payload = request.json
+            # logger.warn(json_payload)
+            # data = getListDeviceSchema.load(json_payload)
+            logger.info(data)
             result, message = signalManager.actionGetListDevice.emit(data)
             json_dumps = getListDeviceSchema.dump(result)
             if result:
                 json_dumps = getListDevicesSchema.dump(result.items)
                 logger.warn(json_dumps)
-                return response_result(message, data=json_dumps, count=result.total)
+                return response_result(message, data=json_dumps, total=result.total, pageSize=args.pageSize)
             return response_result(message)
         except Exception as e:
             current_app.logger.error(e)

tools/frontend/src/api/openapi.js

 /*
  * @Author: your name
  * @Date: 2021-07-15 09:33:39
- * @LastEditTime: 2021-07-19 14:58:18
+ * @LastEditTime: 2021-07-19 16:08:16
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: \evm-store\tools\frontend\src\api\openapi.js
@@ -70,3 +70,10 @@ export function updateReview(params) {
     })
 }
 
+export function getDeviceList(params) {
+    return request({
+        url: "/api/v1/device",
+        method: "get",
+        params
+    })
+}

tools/frontend/src/router/index.js

@@ -206,6 +206,10 @@ const router = new Router({
           path: "/device/index",
           component: () => import("@/views/Application/Device"),
         },
+        {
+          path: "/device/form",
+          component: () => import("@/views/Application/DeviceForm"),
+        },
       ],
     },
   ],

tools/frontend/src/views/Application/Device.vue

@@ -6,7 +6,7 @@
           <a-form v-show="!expandForm" layout="inline">
             <a-row :gutter="{ md: 8, lg: 24, xl: 48 }">
               <a-col :md="8" :sm="24">
-                <a-form-item label="设备" v-decorator="['name']">
+                <a-form-item label="设备名" v-decorator="['name']">
                   <a-input placeholder="请输入" />
                 </a-form-item>
               </a-col>
@@ -32,23 +32,23 @@
           <a-form v-show="expandForm" layout="inline">
             <a-row :gutter="{ md: 8, lg: 24, xl: 48 }">
               <a-col :md="8" :sm="24">
-                <a-form-item label="用户" v-decorator="['username']">
+                <a-form-item label="设备名" v-decorator="['name']">
                   <a-input placeholder="请输入" />
                 </a-form-item>
               </a-col>
               <a-col :md="8" :sm="24">
-                <a-form-item label="性别" v-decorator="['gender']">
+                <a-form-item label="IMEI" v-decorator="['imei']">
+                  <a-input placeholder="请输入" />
+                </a-form-item>
+              </a-col>
+              <a-col :md="8" :sm="24">
+                <a-form-item label="设备类型" v-decorator="['type']">
                   <a-select placeholder="请选择" style="width: 100%">
                     <a-option value="male">male</a-option>
                     <a-option value="female">female</a-option>
                   </a-select>
                 </a-form-item>
               </a-col>
-              <a-col :md="8" :sm="24">
-                <a-form-item label="姓名" v-decorator="['name']">
-                  <a-input placeholder="请输入" />
-                </a-form-item>
-              </a-col>
             </a-row>
             <a-row :gutter="{ md: 8, lg: 24, xl: 48 }">
               <a-col :md="8" :sm="24">
@@ -100,8 +100,8 @@
         <a-table
           :columns="columns"
           :rowKey="(record) => record.uuid"
-          :dataSource="users.data"
-          :pagination="users.pagination"
+          :dataSource="tableData.list"
+          :pagination="tableData.pagination"
           :loading="loading"
           @change="handleTableChange"
         >
@@ -132,39 +132,27 @@ import {
   Input,
   Select,
   DatePicker,
+  message,
 } from "ant-design-vue";
 import PageHeaderWrapper from "@/components/PageHeaderWrapper";
 import DescriptionItem from "@/components/DescriptionItem";
 const columns = [
   {
-    title: "用户名",
-    dataIndex: "login",
-    sorter: true,
-    width: "12%",
-    scopedSlots: { customRender: "login" },
-  },
-  {
-    title: "姓名",
-    dataIndex: "name",
-    sorter: true,
+    title: "IMEI",
+    dataIndex: "imei",
     width: "15%",
-    scopedSlots: { customRender: "name" },
   },
   {
-    title: "性别",
-    dataIndex: "gender",
-    filters: [
-      { text: "Male", value: "male" },
-      { text: "Female", value: "female" },
-    ],
+    title: "设备名称",
+    dataIndex: "name",
   },
   {
-    title: "邮箱",
-    dataIndex: "email",
+    title: "设备类型",
+    dataIndex: "type",
   },
   {
-    title: "国籍",
-    dataIndex: "nat",
+    title: "设备描述",
+    dataIndex: "desc",
   },
   {
     title: "Action",
@@ -173,6 +161,9 @@ const columns = [
   },
 ];
 
+import { mapTrim } from "@/utils/index";
+import { getDeviceList } from "@/api/openapi";
+
 export default {
   name: "DeviceIndex",
   data: () => ({
@@ -189,6 +180,23 @@ export default {
     syb: {
       marginBottom: "24px",
     },
+    loading: false,
+    tableData: {
+      list: [],
+      pagination: {
+        total: 0,
+        pageSize: 15,
+      },
+    },
+    query: {
+      imei: null,
+      name: null,
+      type: null,
+    },
+    post: {
+      page: 1,
+      pageSize: 15,
+    },
   }),
   components: {
     APageHeaderWrapper: PageHeaderWrapper,
@@ -221,10 +229,33 @@ export default {
       this.selectedRowKeys = selectedRowKeys;
     },
     handleTableChange(pagination, filters, sorter) {
-      console.log(pagination, filters, sorter)
+      console.log(pagination, filters, sorter);
     },
+    getDataList() {
+      this.loading = true;
+      let opts = mapTrim(this.query);
+      opts = Object.assign(opts, this.post);
+
+      getDeviceList(opts)
+        .then((res) => {
+          message.success(res.msg);
+          if (res.code == 200) {
+            this.tableData.list = res.data;
+            this.tableData.pagination.pageSize = res.pageSize;
+            this.tableData.pagination.total = res.total;
+          }
+        })
+        .catch((err) => {
+          message.error(err.msg);
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+  },
+  created() {
+    this.getDataList();
   },
-  created() {},
 };
 </script>
 <style lang="less">

tools/frontend/src/views/Application/DeviceForm.vue

+<template>
+  <a-card :body-style="{ padding: '24px 32px' }" :bordered="false">
+    <a-form>
+      <a-form-item
+        :label="$t('title')"
+        :labelCol="{ span: 7 }"
+        :wrapperCol="{ span: 10 }"
+      >
+        <a-input :placeholder="$t('titleInput')" />
+      </a-form-item>
+      <a-form-item
+        :label="$t('date')"
+        :labelCol="{ span: 7 }"
+        :wrapperCol="{ span: 10 }"
+      >
+        <a-range-picker style="width: 100%" />
+      </a-form-item>
+      <a-form-item
+        :label="$t('describe')"
+        :labelCol="{ span: 7 }"
+        :wrapperCol="{ span: 10 }"
+      >
+        <a-textarea rows="4" :placeholder="$t('describeInput')" />
+      </a-form-item>
+      <a-form-item
+        :label="$t('metrics')"
+        :labelCol="{ span: 7 }"
+        :wrapperCol="{ span: 10 }"
+      >
+        <a-textarea rows="4" :placeholder="$t('metricsInput')" />
+      </a-form-item>
+      <a-form-item
+        :label="$t('customer')"
+        :labelCol="{ span: 7 }"
+        :wrapperCol="{ span: 10 }"
+        :required="false"
+      >
+        <a-input :placeholder="$t('customerInput')" />
+      </a-form-item>
+      <a-form-item
+        :label="$t('critics')"
+        :labelCol="{ span: 7 }"
+        :wrapperCol="{ span: 10 }"
+        :required="false"
+      >
+        <a-input :placeholder="$t('criticsInput')" />
+      </a-form-item>
+      <a-form-item
+        :label="$t('weight')"
+        :labelCol="{ span: 7 }"
+        :wrapperCol="{ span: 10 }"
+        :required="false"
+      >
+        <a-input-number :min="0" :max="100" />
+        <span>%</span>
+      </a-form-item>
+      <a-form-item
+        :label="$t('disclosure')"
+        :labelCol="{ span: 7 }"
+        :wrapperCol="{ span: 10 }"
+        :required="false"
+        :help="$t('disclosureDesc')"
+      >
+        <a-radio-group v-model="value">
+          <a-radio :value="1">{{ $t("public") }}</a-radio>
+          <a-radio :value="2">{{ $t("partially") }}</a-radio>
+          <a-radio :value="3">{{ $t("private") }}</a-radio>
+        </a-radio-group>
+        <a-select mode="multiple" v-if="value === 2">
+          <a-select-option value="4">{{ $t("colleague1") }}</a-select-option>
+          <a-select-option value="5">{{ $t("colleague2") }}</a-select-option>
+          <a-select-option value="6">{{ $t("colleague3") }}</a-select-option>
+        </a-select>
+      </a-form-item>
+      <a-form-item
+        style="margin-top: 24px"
+        :wrapperCol="{ span: 10, offset: 7 }"
+      >
+        <a-button type="primary">{{ $t("submit") }}</a-button>
+        <a-button style="margin-left: 8px">{{ $t("save") }}</a-button>
+      </a-form-item>
+    </a-form>
+  </a-card>
+</template>
+
+<script>
+import {
+  Avatar,
+  Row,
+  Col,
+  Card,
+  List,
+  Button,
+  Form,
+  Icon,
+  Table,
+  Divider,
+  Dropdown,
+  Input,
+  Select,
+  Radio,
+  Upload,
+  PageHeader,
+  DatePicker,
+  InputNumber,
+  message,
+} from "ant-design-vue";
+import PageHeaderWrapper from "@/components/PageHeaderWrapper";
+import DescriptionItem from "@/components/DescriptionItem";
+
+export default {
+  name: "DeviceForm",
+  components: {
+    Icon,
+    AUpload: Upload,
+    APageHeader: PageHeader,
+    ATextarea: Input.TextArea,
+    ARadio: Radio,
+    ARadioGroup: Radio.Group,
+    ARadioButton: Radio.Button,
+    AInputNumber: InputNumber,
+    AAvatar: Avatar,
+    ARow: Row,
+    ACol: Col,
+    ACard: Card,
+    ACardGrid: Card.Grid,
+    ACardMeta: Card.Meta,
+    AList: List,
+    AButton: Button,
+    AForm: Form,
+    AFormItem: Form.Item,
+    AIcon: Icon,
+    ATable: Table,
+    ADivider: Divider,
+    ADropdown: Dropdown,
+    AInput: Input,
+    ASelect: Select,
+    AUploadDragger: Upload.Dragger,
+    ASelectOption: Select.Option,
+    ADescriptionItem: DescriptionItem,
+    APageHeaderWrapper: PageHeaderWrapper,
+    ARangePicker: DatePicker.RangePicker,
+  },
+  data() {
+    return {
+      value: 1,
+    };
+  },
+  computed: {
+    desc() {
+      return this.$t("pageDesc");
+    },
+  },
+  created() {
+    message.success("success");
+  },
+};
+</script>
+
+<style scoped>
+</style>
\ No newline at end of file