样式优化

jiangwei
1 parent 052c8f9f
Showing 3 changed files with 39 additions and 41 deletions
src/pages/pms/storage/partShop/components/Filter.tsx
src/pages/pms/storage/partShop/index.tsx
src/pages/pms/transfer/transferPool/comonents/Filiter.tsx
@@ -32,14 +32,14 @@ export default function Filter() {
   return (
     <div>
       <Search
-        style={{ width: 200, marginRight: 10 }}
+        style={{ width: 180, marginRight: 10, marginBottom: 10 }}
         allowClear
         enterButton
         placeholder="配件编码|名称"
         onSearch={v => handleChangeKeywords(v)}
       />
       <PmsSelect
-        style={{ width: 180, marginRight: 10}}
+        style={{ width: 180, marginRight: 10, marginBottom: 10 }}
         allowClear
         value={innerParams.shopId}
         onChange={value => {
@@ -52,7 +52,7 @@ export default function Filter() {
         .map((item: PmsStoragePartShop.Option) => ({value: item.id, label: item.name}))}
       />
       <PmsSelect
-        style={{ width: 150, marginRight: 10}}
+        style={{ width: 180, marginRight: 10, marginBottom: 10 }}
         allowClear
         value={innerParams.storageId}
         onChange={value => {
@@ -66,7 +66,7 @@ export default function Filter() {
       />
       <PmsSelect
         allowClear
-        style={{ width: 150, marginRight: 10}}
+        style={{ width: 180, marginRight: 10, marginBottom: 10 }}
         onChange={(type) => {
           setParams({ ...innerParams, current: 1, type }, true);
         }}
@@ -77,7 +77,7 @@ export default function Filter() {
         allowClear
         placeholder="有无库存筛选"
         onChange={v => isStock(v)}
-        style={{ width: 150, marginRight: 10 }}
+        style={{ width: 180, marginRight: 10, marginBottom: 10 }}
         options={[
           {value: 1, label: "有库存"},
           {value: 0, label: "无库存"},
@@ -87,7 +87,7 @@ export default function Filter() {
         placeholder="排序方式"
         defaultValue={18}
         onChange={v => isSorter(v)}
-        style={{ width: 150 }}
+        style={{ width: 180 }}
         options={[
           {value: 18, label: "总库存降序"},
           {value: 21, label: "锁定库存降序"},
 import React, {useState} from 'react';
-import { PlusOutlined, VerticalAlignBottomOutlined } from '@ant-design/icons';
+import { PlusOutlined, DownloadOutlined, UploadOutlined } from '@ant-design/icons';
 import { Card, Button } from 'antd';
 import { PageHeaderWrapper } from '@ant-design/pro-layout';
 import Filter from './components/Filter';
@@ -20,53 +20,51 @@ function PartShop() {
   return (
     <PageHeaderWrapper title={`服务站配件${fw ? '(霏微)': ''}`}>
       <Card>
-        <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', marginBottom: 20 }}>
+        <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'flex-start', marginBottom: 20 }}>
           <Filter />
-          <div style={{display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center'}}>
+          <div style={{ display: 'flex', alignItems: 'center'}}>
+            <Button
+              type="primary"
+              icon={<PlusOutlined />}
+              onClick={() => { setVisible(true); setIsadd(true); }}
+            >
+              新增
+            </Button>
             {fw && (
-              <>
-                <Button
-                  icon={(<PlusOutlined />)}
-                  type="primary"
-                  onClick={() => setImportVisible(true)}
-                >
-                  导入
-                </Button>
-                <Button
-                  icon={(<PlusOutlined />)}
-                  type="primary"
-                  onClick={() => { setImportVisible(true); setStock(true); }}
-                  style={{marginLeft: 10}}
-                >
-                  调运库存导入
-                </Button>
-              </>
-          )}
-            {/* {!fw && ( */}
             <Button
+              icon={<UploadOutlined />}
               type="primary"
-              icon={<VerticalAlignBottomOutlined />}
-              onClick={() => { setMore(true); setIslock(true); }}
+              onClick={() => setImportVisible(true)}
+              style={{ marginLeft: 10 }}
+            >
+              导入
+            </Button>
+              )}
+            {fw && (
+            <Button
+              icon={<UploadOutlined />}
+              type="primary"
+              onClick={() => { setImportVisible(true); setStock(true); }}
               style={{marginLeft: 10}}
             >
-              锁件批量导出
+              调运库存导入
             </Button>
-            {/* )} */}
+              )}
             <Button
               type="primary"
-              icon={<VerticalAlignBottomOutlined />}
-              onClick={() => setMore(true)}
+              icon={<DownloadOutlined />}
+              onClick={() => { setMore(true); setIslock(true); }}
               style={{marginLeft: 10}}
             >
-              库存批量导出
+              锁件批量导出
             </Button>
             <Button
               type="primary"
-              icon={<PlusOutlined />}
-              onClick={() => { setVisible(true); setIsadd(true); }}
-              style={{ marginLeft: 10}}
+              icon={<DownloadOutlined />}
+              onClick={() => setMore(true)}
+              style={{marginLeft: 10}}
             >
-              新增
+              库存批量导出
             </Button>
           </div>
         </div>
@@ -26,9 +26,9 @@ export default function Index() {
       <Input.Search 
         allowClear
         enterButton
-        placeholder="输入关键词进行搜索"
+        placeholder="输入关键词搜索"
         onSearch={(value, event) => setParams({keywords: value}, true)}
-        style={{ width: 220, marginRight: 10 }}
+        style={{ width: 200, marginRight: 10, marginBottom: 10 }}
       />
       <PmsSelect
         style={{width: 200, marginRight: 10}}