box

package.json

@@ -47,6 +47,7 @@
   ],
   "dependencies": {
     "@amap/amap-jsapi-loader": "^1.0.1",
+    "@ant-design/charts": "^1.3.5",
     "@ant-design/icons": "^4.7.0",
     "@ant-design/pro-card": "^1.18.34",
     "@ant-design/pro-descriptions": "^1.10.0",

src/components/ScreenBox/SquareBox/index.jsx

@@ -0,0 +1,19 @@
+
+
+import './style.less'
+export default (props) => {
+
+
+  return (
+    <div className="win">
+      <div className="border_corner border_corner_left_top" />
+      <div className="border_corner border_corner_right_top" />
+      <div className="border_corner border_corner_left_bottom" />
+      <div className="border_corner border_corner_right_bottom" />
+      {/* 内容 */}
+      <div className="main">
+        {props.children}
+      </div>
+    </div>
+  )
+}

src/components/ScreenBox/SquareBox/style.less

@@ -0,0 +1,41 @@
+.win {
+  position: relative;
+  display: inline-block;
+  margin: 20px;
+}
+.main {
+  color: #fff;
+  border: 1px solid rgba(61, 129, 240, 0.5);
+  border-radius: 4px;
+}
+.border_corner {
+  position: absolute;
+  width: 4px;
+  height: 4px;
+  background-color: #67ffff;
+  border-radius: 50%;
+}
+.border_corner_left_top {
+  top: 0;
+  left: -2px;
+  border-right: none;
+  border-bottom: none;
+}
+.border_corner_right_top {
+  top: 0;
+  right: -2px;
+  border-bottom: none;
+  border-left: none;
+}
+.border_corner_left_bottom {
+  bottom: 0;
+  left: -2px;
+  border-top: none;
+  border-right: none;
+}
+.border_corner_right_bottom {
+  right: -2px;
+  bottom: 0;
+  border-top: none;
+  border-left: none;
+}

src/components/ScreenBox/TitleBox/index.jsx

@@ -0,0 +1,13 @@
+
+
+import './style.less'
+
+export default (props) => {
+  const { value } = props
+  return (
+    <div className='TitleBox'>
+      <div className='TitleBox-ListBox' />
+      <span>{value}</span>
+    </div>
+  )
+}

src/components/ScreenBox/TitleBox/style.less

@@ -0,0 +1,22 @@
+.TitleBox {
+  display: flex;
+  align-items: center;
+  width: 163px;
+  padding: 11px 9px 9px 11px;
+  border-radius: 4px;
+  box-shadow: 0px 0px 10px 0px #3d81f0 inset;
+
+  .TitleBox-ListBox {
+    width: 13px;
+    height: 13px;
+    margin-right: 10px;
+    background: linear-gradient(0deg, #0c49c6, #3bd6e8);
+  }
+  > span {
+    color: transparent;
+    font-weight: 800;
+    font-size: 17px;
+    background: linear-gradient(0deg, #0c49c6, #3bd6e8);
+    background-clip: text;
+  }
+}

src/pages/SystemManagement/UserRights/index.jsx

@@ -1,7 +1,54 @@
 
 
+
+import SquareBox from '@/components/ScreenBox/SquareBox'
+import TitleBox from '@/components/ScreenBox/TitleBox'
+import { Bar } from '@ant-design/plots';
+// import ba from './a.png'
+
 export default (props) => {
+
+
+  const style = {
+    bgd: {
+      color: 'rgba(0,0,0,.25)',
+      height: '100vh',
+      // backgroundImage: `url(${ba})`,
+      backgroundSize: '100%,100%',
+      padding: '5em 10em'
+    }
+  }
+  const data = [
+    {
+      year: '收割机',
+      value: 200,
+    },
+    {
+      year: '播种机',
+      value: 150,
+    },
+    {
+      year: '农药机',
+      value: 50,
+    },
+  ];
+  const config = {
+    data,
+    xField: 'value',
+    yField: 'year',
+    seriesField: 'year',
+    legend: {
+      position: 'top-left',
+    },
+    color: [' #FB9900', '#23E8AE', '#E63404'],
+  };
+
   return (
-    <div>用户权限</div>
+    <div style={style.bgd} >
+      <TitleBox value='农机类型统计' />
+      <SquareBox>
+        <Bar  {...config} />
+      </SquareBox>
+    </div>
   )
 }

src/services/PlatformMessageManagement.js

@@ -0,0 +1,28 @@
+
+/**
+ * @表格展示
+ * 
+ */
+
+
+
+
+/**
+ * @增加
+ * 
+ */
+
+
+
+/**
+ * @删除
+ * 
+ */
+
+
+
+
+/**
+ * @修改
+ * 
+ */

src/services/swagger/pet.js

@@ -4,7 +4,7 @@
 import { request } from 'umi';
 /** Update an existing pet PUT /pet */
 
-export async function updatePet(body, options) {
+export async function updatePet (body, options) {
   return request('/pet', {
     method: 'PUT',
     headers: {
@@ -16,7 +16,7 @@ export async function updatePet(body, options) {
 }
 /** Add a new pet to the store POST /pet */
 
-export async function addPet(body, options) {
+export async function addPet (body, options) {
   return request('/pet', {
     method: 'POST',
     headers: {
@@ -28,7 +28,7 @@ export async function addPet(body, options) {
 }
 /** Finds Pets by status Multiple status values can be provided with comma separated strings GET /pet/findByStatus */
 
-export async function findPetsByStatus(params, options) {
+export async function findPetsByStatus (params, options) {
   return request('/pet/findByStatus', {
     method: 'GET',
     params: { ...params },
@@ -37,7 +37,7 @@ export async function findPetsByStatus(params, options) {
 }
 /** Finds Pets by tags Muliple tags can be provided with comma separated strings. Use         tag1, tag2, tag3 for testing. GET /pet/findByTags */
 
-export async function findPetsByTags(params, options) {
+export async function findPetsByTags (params, options) {
   return request('/pet/findByTags', {
     method: 'GET',
     params: { ...params },
@@ -46,7 +46,7 @@ export async function findPetsByTags(params, options) {
 }
 /** Find pet by ID Returns a single pet GET /pet/${param0} */
 
-export async function getPetById(params, options) {
+export async function getPetById (params, options) {
   const { petId: param0 } = params;
   return request(`/pet/${param0}`, {
     method: 'GET',
@@ -56,7 +56,7 @@ export async function getPetById(params, options) {
 }
 /** Updates a pet in the store with form data POST /pet/${param0} */
 
-export async function updatePetWithForm(params, body, options) {
+export async function updatePetWithForm (params, body, options) {
   const { petId: param0 } = params;
   const formData = new FormData();
   Object.keys(body).forEach((ele) => {
@@ -78,7 +78,7 @@ export async function updatePetWithForm(params, body, options) {
 }
 /** Deletes a pet DELETE /pet/${param0} */
 
-export async function deletePet(params, options) {
+export async function deletePet (params, options) {
   const { petId: param0 } = params;
   return request(`/pet/${param0}`, {
     method: 'DELETE',
@@ -88,7 +88,7 @@ export async function deletePet(params, options) {
 }
 /** uploads an image POST /pet/${param0}/uploadImage */
 
-export async function uploadFile(params, body, options) {
+export async function uploadFile (params, body, options) {
   const { petId: param0 } = params;
   const formData = new FormData();
   Object.keys(body).forEach((ele) => {