Skip to content

R
Repair-app
Commit 25ddf61a authored by chaiwat's avatar chaiwat
Browse files
Options

add Table show detail

parent a7286e74
Show whitespace changes
Inline Side-by-side
Showing with 905 additions and 211 deletions
package-lock.json
View file @ 25ddf61a
...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
"@testing-library/user-event": "^12.1.10", "@testing-library/user-event": "^12.1.10",
"antd": "^4.18.2", "antd": "^4.18.2",
"axios": "^0.24.0", "axios": "^0.24.0",
"canvasjs-react-charts": "^1.0.5",
"craco-less": "^2.0.0", "craco-less": "^2.0.0",
"react": "^17.0.2", "react": "^17.0.2",
"react-dom": "^17.0.2", "react-dom": "^17.0.2",
...@@ -8374,6 +8375,11 @@ ...@@ -8374,6 +8375,11 @@
"integrity": "sha512-C1ZxgkuA4/bUEdMbU5WrGY4+UhMFFiXrgNAfxiMIqWgFTWfv/xsZCS2xEHT2LMq7xAZfuAnu6mcqyDl0ZR6wLQ==", "integrity": "sha512-C1ZxgkuA4/bUEdMbU5WrGY4+UhMFFiXrgNAfxiMIqWgFTWfv/xsZCS2xEHT2LMq7xAZfuAnu6mcqyDl0ZR6wLQ==",
"license": "CC-BY-4.0" "license": "CC-BY-4.0"
}, },
"node_modules/canvasjs-react-charts": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/canvasjs-react-charts/-/canvasjs-react-charts-1.0.5.tgz",
"integrity": "sha512-8P3KnAvCqftmqf4O/xG6PlIDcTr0IvzuE4l6ACXIOROKtFmnmUu/xPEeq+0vI9Xvh7zXjzZvRqw0p1uxXr034g=="
},
"node_modules/capture-exit": { "node_modules/capture-exit": {
"version": "2.0.0", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/capture-exit/-/capture-exit-2.0.0.tgz", "resolved": "https://registry.npmjs.org/capture-exit/-/capture-exit-2.0.0.tgz",
...@@ -33403,6 +33409,11 @@ ...@@ -33403,6 +33409,11 @@
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001035.tgz", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001035.tgz",
"integrity": "sha512-C1ZxgkuA4/bUEdMbU5WrGY4+UhMFFiXrgNAfxiMIqWgFTWfv/xsZCS2xEHT2LMq7xAZfuAnu6mcqyDl0ZR6wLQ==" "integrity": "sha512-C1ZxgkuA4/bUEdMbU5WrGY4+UhMFFiXrgNAfxiMIqWgFTWfv/xsZCS2xEHT2LMq7xAZfuAnu6mcqyDl0ZR6wLQ=="
}, },
"canvasjs-react-charts": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/canvasjs-react-charts/-/canvasjs-react-charts-1.0.5.tgz",
"integrity": "sha512-8P3KnAvCqftmqf4O/xG6PlIDcTr0IvzuE4l6ACXIOROKtFmnmUu/xPEeq+0vI9Xvh7zXjzZvRqw0p1uxXr034g=="
},
"capture-exit": { "capture-exit": {
"version": "2.0.0", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/capture-exit/-/capture-exit-2.0.0.tgz", "resolved": "https://registry.npmjs.org/capture-exit/-/capture-exit-2.0.0.tgz",
package.json
View file @ 25ddf61a
...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
"@testing-library/user-event": "^12.1.10", "@testing-library/user-event": "^12.1.10",
"antd": "^4.18.2", "antd": "^4.18.2",
"axios": "^0.24.0", "axios": "^0.24.0",
"canvasjs-react-charts": "^1.0.5",
"craco-less": "^2.0.0", "craco-less": "^2.0.0",
"react": "^17.0.2", "react": "^17.0.2",
"react-dom": "^17.0.2", "react-dom": "^17.0.2",
......
src/Layouts/VerticalLayout.jsx
View file @ 25ddf61a
...@@ -8,7 +8,6 @@ import HeaderTap from "./Header/tabHeader"; ...@@ -8,7 +8,6 @@ import HeaderTap from "./Header/tabHeader";
import MenuList from "./Menu/menulist"; import MenuList from "./Menu/menulist";
import MenuDashboard from "./Menu/menuDashboard"; import MenuDashboard from "./Menu/menuDashboard";
const { Content, Footer } = Layout; const { Content, Footer } = Layout;
export default function VerticalLayout(props) { export default function VerticalLayout(props) {
...@@ -16,6 +15,7 @@ export default function VerticalLayout(props) { ...@@ -16,6 +15,7 @@ export default function VerticalLayout(props) {
// let test = ""; // let test = "";
const history = useHistory(); const history = useHistory();
const [checkLocal, setChechLocal] = useState(null); const [checkLocal, setChechLocal] = useState(null);
useEffect(() => { useEffect(() => {
...@@ -26,7 +26,10 @@ export default function VerticalLayout(props) { ...@@ -26,7 +26,10 @@ export default function VerticalLayout(props) {
if (checkLocal === null) { if (checkLocal === null) {
history.push("/"); history.push("/");
} else { } else {
history.push("/dashboard"); history.push({
pathname: "/dashboard",
state: checkLocal.userData.userId
});
} }
// console.log(checkLocal); // console.log(checkLocal);
......
src/assets/less/pages/dashboard/index.less
View file @ 25ddf61a
...@@ -6,8 +6,6 @@ ...@@ -6,8 +6,6 @@
// background-color: #a3b4c8; // background-color: #a3b4c8;
} }
.main-select-repair { .main-select-repair {
padding: 10px; padding: 10px;
// border: 1px solid #333; // border: 1px solid #333;
...@@ -33,7 +31,58 @@ ...@@ -33,7 +31,58 @@
display: flex; display: flex;
} }
.test-box { .test-box {
border: 1px solid #333; border: 1px solid #333;
} }
.display-flex-main {
display: flex;
justify-content: center;
height: auto;
// border: 1px solid #333;
}
.div-content-chart {
width: 70%;
}
.content-chart {
display: flex;
// border: 1px solid #333;
}
.div-title-detail {
background-color: #001529;
height: auto;
}
.title-show-detail {
padding: 10px;
}
.color-fff {
color: aliceblue;
}
.color-fff-hover {
color: aliceblue;
}
.color-fff-hover:hover {
color: rgb(0, 0, 0);
}
.color-bfbf {
color: #bfbfbf;
}
.div-p-5 {
padding: 5%;
// border: 1px solid #001529;
}
.border {
border: 1px solid #001529;
}
src/assets/less/theme.less
View file @ 25ddf61a
...@@ -5,3 +5,10 @@ ...@@ -5,3 +5,10 @@
@font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, @font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
'Noto Color Emoji'; 'Noto Color Emoji';
.bt-them {
background-color: #001529;
color: aliceblue;
}
\ No newline at end of file
src/router/Routers.jsx
View file @ 25ddf61a
...@@ -20,13 +20,6 @@ import FullLayout from "../Layouts/FullLayout"; ...@@ -20,13 +20,6 @@ import FullLayout from "../Layouts/FullLayout";
import ProtectedRoute from "../ProtectdRoute"; import ProtectedRoute from "../ProtectdRoute";
export default function Routers() { export default function Routers() {
// const history = useHistory();
// const [checkLocal, setChechLocal] = useState(null);
// useEffect(() => {
// console.log("local", localStorage.getItem("user") === null);
// setChechLocal(JSON.parse(localStorage.getItem("user")));
// }, []);
// Default Layout // Default Layout
...@@ -35,7 +28,6 @@ export default function Routers() { ...@@ -35,7 +28,6 @@ export default function Routers() {
// All of the available layouts // All of the available layouts
const Layouts = { VerticalLayout, FullLayout }; const Layouts = { VerticalLayout, FullLayout };
// const LayoutsDashboard = { DashboardLayout, FullLayout };
// Return Filtered Array of Routes & Paths for default page // Return Filtered Array of Routes & Paths for default page
const LayoutRoutesAndPaths = (layout) => { const LayoutRoutesAndPaths = (layout) => {
...@@ -53,22 +45,6 @@ export default function Routers() { ...@@ -53,22 +45,6 @@ export default function Routers() {
return { LayoutRoutes, LayoutPaths }; return { LayoutRoutes, LayoutPaths };
}; };
// Return Filtered Array of Routes & Paths for dashboard page
// const LayoutRoutesAndPathsDashboard = (layout) => {
// const LayoutRoutes2 = [];
// const LayoutPaths2 = [];
// if (Routes) {
// // Checks if Route layout or Default layout matches current layout
// Routes.filter(
// (route) =>
// (route.layout === layout || DefaultLayout === layout) &&
// (LayoutRoutes2.push(route), LayoutPaths2.push(route.path))
// );
// }
// return { LayoutRoutes2, LayoutPaths2 };
// };
// Return Route to Render // Return Route to Render
......
src/router/routes/Pages.jsx
View file @ 25ddf61a
...@@ -52,17 +52,33 @@ const PagesRoutes = [ ...@@ -52,17 +52,33 @@ const PagesRoutes = [
layout: "VerticalLayout", layout: "VerticalLayout",
}, },
// pages 404 // Dashboard
{ {
path: '/dashboard', path: '/dashboard',
component: lazy(() => import('../../view/Dashboards/repairDashboard/repairAdd/index')), component: lazy(() => import('../../view/Dashboards/ecommerce/index')),
layout: 'VerticalLayout', layout: 'VerticalLayout',
}, },
// add-detail
{ {
path: '/dashboard/add-detail', path: '/dashboard/add-detail',
component: lazy(() => import('../../view/Dashboards/repairDashboard/repairAdd/index')), component: lazy(() => import('../../view/Dashboards/repairDashboard/repairAdd/index')),
layout: 'VerticalLayout', layout: 'VerticalLayout',
}, },
// all-repair
{
path: '/dashboard/all-repair',
component: lazy(() => import('../../view/Dashboards/repairDashboard/repairList/index')),
layout: 'VerticalLayout',
},
// show-repair
{
path: '/dashboard/all-repair/detail',
component: lazy(() => import('../../view/Dashboards/repairDashboard/repairList/ShowDetail')),
layout: 'VerticalLayout',
},
]; ];
export default PagesRoutes; export default PagesRoutes;
src/services/index.js
View file @ 25ddf61a
...@@ -67,3 +67,45 @@ export const FetchMemberTel = () => { ...@@ -67,3 +67,45 @@ export const FetchMemberTel = () => {
console.log(err); console.log(err);
}); });
}; };
// send data to InsertDetails
export const InsertDetails = (data) => {
return axios
.post(process.env.REACT_APP_SECRET_API + "/repairdetail/insert", data)
.then((response) => response.data)
.catch((err) => {
console.log(err);
});
};
// get data FetctDetailByGarage
export const FetctDetailByGarage = (data) => {
// console.log('fetdata', data)
return (
axios
// .get(process.env.REACT_APP_SECRET_API + "/repairdetail/getbygarage", data)
.get(process.env.REACT_APP_SECRET_API + "/repairdetail/getbygarage", {
params: data,
})
.then((response) => response.data)
.catch((err) => {
console.log(err);
})
);
};
// get data FetctDetailByGarageID
export const FetctDetailByGarageID = (data) => {
// console.log('fetdata', data)
return (
axios
// .get(process.env.REACT_APP_SECRET_API + "/repairdetail/getbygarage", data)
.get(process.env.REACT_APP_SECRET_API + "/repairdetail/getbydetailID", {
params: data,
})
.then((response) => response.data)
.catch((err) => {
console.log(err);
})
);
};
src/view/Dashboards/component/SpareAdd.jsx 0 → 100644
View file @ 25ddf61a
import React, { useState, useEffect } from "react";
import {
// Row,
// Col,
Modal,
Button,
Input,
Divider,
Table,
Typography,
} from "antd";
import { PlusCircleFilled } from "@ant-design/icons";
// import Service
import { FetctDetailByGarageID } from '../../../services'
const { Column, ColumnGroup } = Table;
const { Text } = Typography;
// const data = [
// // {
// // key: "1",
// // name: "ยางใน",
// // age: 32,
// // address: "New York No. 1 Lake Park",
// // tags: ["nice", "developer"],
// // },
// // {
// // key: "2",
// // name: "น้ำมันเครื่อง",
// // age: 42,
// // address: "London No. 1 Lake Park",
// // tags: ["loser"],
// // },
// // {
// // key: "3",
// // name: "test",
// // age: 32,
// // address: "Sidney No. 1 Lake Park",
// // tags: ["cool", "teacher"],
// // },
// ];
export default function SpareAdd(props) {
const detailID = props;
// console.log(detailID);
// Set State
const [visible, setVisible] = useState(false);
const [confirmLoading, setConfirmLoading] = useState(false);
const [ datas, setDatas ] = useState([])
// const [modalText, setModalText] = useState("Content of the modal");
useEffect(() => {
const getDetailByGarage = async () => {
await FetctDetailByGarageID(detailID).then(async (response) => {
await setDatas(response.data);
// console.log('data', response.data)
});
};
getDetailByGarage();
}, [detailID]);
const showModal = () => {
setVisible(true);
};
const handleOk = () => {
// setModalText("The modal will be closed after two seconds");
setConfirmLoading(true);
setTimeout(() => {
setVisible(false);
setConfirmLoading(false);
}, 2000);
};
const handleCancel = () => {
console.log("Clicked cancel button");
setVisible(false);
};
return (
<>
<Divider />
{/* <div className="div-p-5">
<Row gutter={[0, 32]}>
<Col xs={24} md={{ span: 11, offset: 1 }} lg={{ span: 7, offset: 1 }}>
test
</Col>
<Col xs={24} md={{ span: 11, offset: 1 }} lg={{ span: 7, offset: 1 }}>
test
</Col>
<Col xs={24} md={{ span: 11, offset: 1 }} lg={{ span: 7, offset: 1 }}>
test
</Col>
</Row>
</div> */}
<div className="div-p-5">
<Button className="bt-them" onClick={showModal}>
<Text className="color-fff-hover">
<PlusCircleFilled /> เพิ่มรายการอะไหล่
</Text>
</Button>
<Table dataSource={datas} scroll={{ x: 400 }} className="border">
<ColumnGroup title="รายละเอียดการซ่อม">
<Column
title="ลำดับ"
dataIndex="key"
key="member_name"
width={"10%"}
/>
<Column
title="รายการอะไหล่"
dataIndex="name"
key="member_tel"
width={"60%"}
/>
<Column
title="จำนวน"
dataIndex="device_type"
key="device_type"
width={"10%"}
/>
<Column
title="ราคาต่อหน่วย"
dataIndex="device_type"
key="device_type"
width={"10%"}
/>
<Column
title="ราคาประเมิน"
dataIndex="device_type"
key="device_type"
width={"10%"}
/>
</ColumnGroup>
</Table>
</div>
<Modal
title="Title"
visible={visible}
onOk={handleOk}
confirmLoading={confirmLoading}
onCancel={handleCancel}
width={1000}
>
<Input />
</Modal>
</>
);
}
src/view/Dashboards/component/TitleShowDetail.jsx 0 → 100644
View file @ 25ddf61a
import React, { useEffect, useState } from "react";
import { Col, Row, Typography } from "antd";
import { MobileOutlined, DollarOutlined } from "@ant-design/icons";
// import Service
import { FetctDetailByGarageID } from "../../../services";
// import { useLocation } from "react-router-dom";
const { Text, Title } = Typography;
export default function App(props) {
const detailID = props;
//set useState
const [datas, setDatas] = useState([]);
useEffect(() => {
const getDetailByGarage = async () => {
await FetctDetailByGarageID(detailID).then(async (response) => {
await setDatas(response.data[0]);
// console.log('data', response.data[0])
});
};
getDetailByGarage();
}, [detailID]);
console.log(datas);
return (
<>
<div className="div-title-detail">
<Row gutter={[0, 32]} className="title-show-detail">
<Col xs={24} md={{ span: 11, offset: 1 }} lg={{ span: 7, offset: 1 }}>
<Text className="color-bfbf">ชื่ออุปกรณ์</Text>
<Title level={4} className="color-fff">
{/* <Text className="color-fff">{datas.brand} {datas.model}</Text> */}
{datas.device_type === "รถจักรยานยนต์" ||
datas.device_type === "รถยนต์" ? (
<>
<Text className="color-fff">
{datas.brand} {datas.model}
</Text>
</>
) : (
<>
<Text className="color-fff">{datas.equipment}</Text>
</>
)}
</Title>
<Text className="color-fff">{datas.device_type}</Text>
</Col>
<Col xs={24} md={{ span: 11, offset: 1 }} lg={{ span: 7, offset: 1 }}>
<Text className="color-bfbf">ทะเบียน / ชนิด</Text>
{/* <Title level={4} className="color-fff">
<Text className="color-fff">{datas.car_number}</Text>
</Title>
<Text className="color-fff">{datas.car_province}</Text> */}
{datas.device_type === "รถจักรยานยนต์" ||
datas.device_type === "รถยนต์" ? (
<>
<Title level={4} className="color-fff">
<Text className="color-fff">{datas.car_number}</Text>
</Title>
<Text className="color-fff">{datas.car_province}</Text>
</>
) : (
<>
<Title level={4} className="color-fff">
<Text className="color-fff">{datas.equipment}</Text>
</Title>
</>
)}
</Col>
<Col xs={24} md={{ span: 11, offset: 1 }} lg={{ span: 7, offset: 1 }}>
<Text className="color-bfbf">ลูกค้า</Text>
<Title level={4} className="color-fff">
<Text className="color-fff">คุณ {datas.member_name}</Text>
</Title>
<Text className="color-fff">
<MobileOutlined />
{datas.member_tel}
</Text>
</Col>
<Col xs={24} md={{ span: 11, offset: 1 }} lg={{ span: 7, offset: 1 }}>
<Text className="color-bfbf">วันที่รับซ่อม</Text>
<Title level={4} className="color-fff">
<Text className="color-fff">{datas.repair_date}</Text>
</Title>
</Col>
<Col xs={24} md={{ span: 11, offset: 1 }} lg={{ span: 7, offset: 1 }}>
<Text className="color-bfbf">สถานะการซ่อม</Text>
<Title level={4} className="color-fff">
<Text className="color-fff">{datas.status}</Text>
</Title>
</Col>
<Col xs={24} md={{ span: 11, offset: 1 }} lg={{ span: 7, offset: 1 }}>
<Text className="color-bfbf">ยอดสุทธิ(บ.)</Text>
<Title level={4} className="color-fff">
<Text className="color-fff">{datas.price}</Text>
</Title>
<Text className="color-fff">
<DollarOutlined /> {datas.status_payment}
</Text>
</Col>
</Row>
</div>
</>
);
}
src/view/Dashboards/repairDashboard/repairAdd/component/agriculture.jsx → src/view/Dashboards/component/agriculture.jsx
View file @ 25ddf61a
...@@ -6,36 +6,23 @@ import { ...@@ -6,36 +6,23 @@ import {
Form, Form,
Input, Input,
Button, Button,
Select,
Divider, Divider,
DatePicker, DatePicker,
Modal,
} from "antd"; } from "antd";
// import services // import services
import { FetchThaiAddress, FetchMemberTel } from "../../../../../services"; import { FetchMemberTel, InsertDetails } from "../../../services";
import Brand from "../data/brand.json";
// const { Title, Text } = Typography; // const { Title, Text } = Typography;
const { Option } = Select;
export default function App(props) { export default function App(props) {
const { typeSelect, checkLocal } = props; const { typeSelect, checkLocal } = props;
// UseState // UseState
const [province, setProvinec] = useState([]);
const [member, setMember] = useState([]); const [member, setMember] = useState([]);
useEffect(() => { useEffect(() => {
const getThaiAddress = async () => {
await FetchThaiAddress().then((response) => {
if (response) {
setProvinec(response.data);
}
});
};
getThaiAddress();
const getMemberTel = async () => { const getMemberTel = async () => {
await FetchMemberTel().then((response) => { await FetchMemberTel().then((response) => {
if (response) { if (response) {
...@@ -64,19 +51,33 @@ export default function App(props) { ...@@ -64,19 +51,33 @@ export default function App(props) {
garageID: checkLocal.userData.userId, garageID: checkLocal.userData.userId,
member_tel: values.member_tel, member_tel: values.member_tel,
device_type: typeSelect, device_type: typeSelect,
car_number: values.car_number, equipment: values.equipment,
car_province: values.car_province,
brand: values.brand, brand: values.brand,
model: values.model,
kilo_number: values.kilo_number,
repair_date: newDate, repair_date: newDate,
repair_detail: values.repair_detail, repair_details: values.repair_details,
car_number: null,
car_province: null,
model: null,
kilo_number: null,
status: "อยู่ระหว่างการซ่อม",
price: 0,
spare_parts_list: null,
status_payment: "ยังไม่ได้ชำระ",
}; };
// console.log('test data', data)
if (member.includes(values.member_tel) === true) { if (member.includes(values.member_tel) === true) {
console.log("datas", data); InsertDetails(data).then((response) => {
console.log("response", response);
});
window.location.reload(false)
} else { } else {
alert(`หมายเลข ${values.member_tel} นี้ ยังไม่ได้สมัครสมาชิก กรุณาสมัครสมาชิกก่อนเพิ่มการซ่อม`) Modal.info({
title: "ลูกค้ายังไม่ได้สมัครสมาชิก",
content: `หมายเลข ${values.member_tel} นี้ ยังไม่ได้สมัครสมาชิก กรุณาสมัครสมาชิกก่อนเพิ่มการซ่อม `,
});
} }
}; };
...@@ -120,16 +121,16 @@ export default function App(props) { ...@@ -120,16 +121,16 @@ export default function App(props) {
</Col> </Col>
<Row gutter={[0, 16]}> <Row gutter={[0, 16]}>
{/* หมายเลขทะเบียนรถ */} {/* ชนิดของอุปกรณ์ */}
<Col <Col
xs={24} xs={24}
md={{ span: 11, offset: 1 }} md={{ span: 11, offset: 1 }}
xl={{ span: 7, offset: 1 }} xl={{ span: 7, offset: 1 }}
> >
<Form.Item <Form.Item
name="car_number" name="equipment"
label="ทะเบียนรถ" label="ประเภทอุปกรณ์"
tooltip="หมายเลขทะเบียนรถ" tooltip="ประเภทของอุปกรณ์ เช่น เครื่องสูบน้ำ หรือเครื่องตัดหญ้า"
rules={[ rules={[
{ {
required: true, required: true,
...@@ -142,45 +143,6 @@ export default function App(props) { ...@@ -142,45 +143,6 @@ export default function App(props) {
</Form.Item> </Form.Item>
</Col> </Col>
{/* จังหวัด */}
<Col
xs={24}
md={{ span: 11, offset: 1 }}
xl={{ span: 7, offset: 1 }}
>
<Form.Item
name="car_province"
label="จังหวัด"
tooltip="ทะเบียนจังหวัด"
rules={[
{
required: true,
message: "กรุณาเลือกทะเบียนจังหวัด!",
whitespace: true,
},
]}
>
<Select
allowClear
style={{ width: "100%" }}
placeholder="เลือกจังหวัด"
// onChange={(e) => {
// setTypeSelect(e);
// }}
>
{province.length !== 0 ? (
<>
{province.map((api, index) => (
<Option key={index} value={api.province}>
{api.province}
</Option>
))}
</>
) : null}
</Select>
</Form.Item>
</Col>
{/* ยี่ห้อ */} {/* ยี่ห้อ */}
<Col <Col
xs={24} xs={24}
...@@ -190,69 +152,11 @@ export default function App(props) { ...@@ -190,69 +152,11 @@ export default function App(props) {
<Form.Item <Form.Item
name="brand" name="brand"
label="ยี่ห้อ" label="ยี่ห้อ"
tooltip="ยี่ห้อของรถ" tooltip="ยี่ห้อของอุปกรณ์การเกษตร"
rules={[
{
required: true,
message: "กรุณาเลือกยี่ห้อของรถ!",
whitespace: true,
},
]}
>
<Select
allowClear
style={{ width: "100%" }}
placeholder="เลือกยี่ห้อ"
>
{Brand.length !== 0 ? (
<>
{Brand.type.car.map((brand, index) => (
<Option key={index} value={brand}>
{brand}
</Option>
))}
</>
) : null}
</Select>
</Form.Item>
</Col>
{/* รุ่น Model */}
<Col
xs={24}
md={{ span: 11, offset: 1 }}
xl={{ span: 7, offset: 1 }}
>
<Form.Item
name="model"
label="รุ่น"
tooltip="รุ่นของรถ"
rules={[
{
required: true,
message: "กรุณากรอกรุ่นของรถ!",
whitespace: true,
},
]}
>
<Input />
</Form.Item>
</Col>
{/* รุ่น Kilo Number */}
<Col
xs={24}
md={{ span: 11, offset: 1 }}
xl={{ span: 7, offset: 1 }}
>
<Form.Item
name="kilo_number"
label="หมายเลขกิโล"
tooltip="หมายเลขกิโลของรถ ณ วันที่ซ่อม"
rules={[ rules={[
{ {
required: true, required: true,
message: "กรุณากรอกหมายเลขกิโล!", message: "กรุณาระบุยี่ห้อของอุปกรณ์การเกษตร!",
whitespace: true, whitespace: true,
}, },
]} ]}
...@@ -268,9 +172,9 @@ export default function App(props) { ...@@ -268,9 +172,9 @@ export default function App(props) {
xl={{ span: 7, offset: 1 }} xl={{ span: 7, offset: 1 }}
> >
<Form.Item <Form.Item
label="วันที่รับรถ" label="วันที่รับซ่อม"
name="repair_date" name="repair_date"
tooltip="เลือกวันที่รับรถ" tooltip="เลือกวันที่รับซ่อม"
> >
<DatePicker /> <DatePicker />
</Form.Item> </Form.Item>
...@@ -280,14 +184,14 @@ export default function App(props) { ...@@ -280,14 +184,14 @@ export default function App(props) {
<Col xs={4} md={4} xl={4}></Col> <Col xs={4} md={4} xl={4}></Col>
<Col xs={16} md={16} xl={16}> <Col xs={16} md={16} xl={16}>
<Form.Item <Form.Item
name="repair_detail" name="repair_details"
label="รายละเอียดการซ่อมเบื้องต้น" label="รายละเอียดการซ่อมเบื้องต้น"
tooltip="รายละเอียดการซ่อมเบื้องต้น" tooltip="รายละเอียดการซ่อมเบื้องต้น"
> >
<Input.TextArea /> <Input.TextArea />
</Form.Item> </Form.Item>
<Form.Item> <Form.Item>
<Button type="primary" htmlType="submit"> <Button className="bt-them" htmlType="submit">
เพิ่มการซ่อม เพิ่มการซ่อม
</Button> </Button>
</Form.Item> </Form.Item>
......
src/view/Dashboards/repairDashboard/repairAdd/component/car.jsx → src/view/Dashboards/component/car.jsx
View file @ 25ddf61a
...@@ -8,13 +8,18 @@ import { ...@@ -8,13 +8,18 @@ import {
Button, Button,
Select, Select,
Divider, Divider,
Modal,
DatePicker, DatePicker,
} from "antd"; } from "antd";
// import services // import services
import { FetchThaiAddress, FetchMemberTel } from "../../../../../services"; import {
FetchThaiAddress,
FetchMemberTel,
InsertDetails,
} from "../../../services";
import Brand from "../data/brand.json"; import Brand from "../repairDashboard/repairAdd/data/brand.json";
// const { Title, Text } = Typography; // const { Title, Text } = Typography;
const { Option } = Select; const { Option } = Select;
...@@ -70,13 +75,25 @@ export default function App(props) { ...@@ -70,13 +75,25 @@ export default function App(props) {
model: values.model, model: values.model,
kilo_number: values.kilo_number, kilo_number: values.kilo_number,
repair_date: newDate, repair_date: newDate,
repair_detail: values.repair_detail, repair_details: values.repair_details,
status: "อยู่ระหว่างการซ่อม",
price: 0,
spare_parts_list: null,
status_payment: "ยังไม่ได้ชำระ",
equipment: null,
}; };
if (member.includes(values.member_tel) === true) { if (member.includes(values.member_tel) === true) {
console.log("datas", data); InsertDetails(data).then((response) => {
console.log("response", response);
});
window.location.reload(false)
} else { } else {
alert(`หมายเลข ${values.member_tel} นี้ ยังไม่ได้สมัครสมาชิก กรุณาสมัครสมาชิกก่อนเพิ่มการซ่อม`) Modal.info({
title: "ลูกค้ายังไม่ได้สมัครสมาชิก",
content: `หมายเลข ${values.member_tel} นี้ ยังไม่ได้สมัครสมาชิก กรุณาสมัครสมาชิกก่อนเพิ่มการซ่อม `,
});
} }
}; };
...@@ -280,14 +297,14 @@ export default function App(props) { ...@@ -280,14 +297,14 @@ export default function App(props) {
<Col xs={4} md={4} xl={4}></Col> <Col xs={4} md={4} xl={4}></Col>
<Col xs={16} md={16} xl={16}> <Col xs={16} md={16} xl={16}>
<Form.Item <Form.Item
name="repair_detail" name="repair_details"
label="รายละเอียดการซ่อมเบื้องต้น" label="รายละเอียดการซ่อมเบื้องต้น"
tooltip="รายละเอียดการซ่อมเบื้องต้น" tooltip="รายละเอียดการซ่อมเบื้องต้น"
> >
<Input.TextArea /> <Input.TextArea />
</Form.Item> </Form.Item>
<Form.Item> <Form.Item>
<Button type="primary" htmlType="submit"> <Button className="bt-them" htmlType="submit">
เพิ่มการซ่อม เพิ่มการซ่อม
</Button> </Button>
</Form.Item> </Form.Item>
......
src/view/Dashboards/repairDashboard/repairAdd/component/motorcycle.jsx → src/view/Dashboards/component/motorcycle.jsx
View file @ 25ddf61a
...@@ -9,12 +9,13 @@ import { ...@@ -9,12 +9,13 @@ import {
Select, Select,
Divider, Divider,
DatePicker, DatePicker,
Modal,
} from "antd"; } from "antd";
// import services // import services
import { FetchThaiAddress, FetchMemberTel } from "../../../../../services"; import { FetchThaiAddress, FetchMemberTel, InsertDetails } from "../../../services";
import Brand from "../data/brand.json"; import Brand from "../repairDashboard/repairAdd/data/brand.json";
// const { Title, Text } = Typography; // const { Title, Text } = Typography;
const { Option } = Select; const { Option } = Select;
...@@ -70,13 +71,25 @@ export default function App(props) { ...@@ -70,13 +71,25 @@ export default function App(props) {
model: values.model, model: values.model,
kilo_number: values.kilo_number, kilo_number: values.kilo_number,
repair_date: newDate, repair_date: newDate,
repair_detail: values.repair_detail, repair_details: values.repair_details,
status: "อยู่ระหว่างการซ่อม",
price: 0,
spare_parts_list: null,
status_payment: "ยังไม่ได้ชำระ",
equipment: null,
}; };
if (member.includes(values.member_tel) === true) { if (member.includes(values.member_tel) === true) {
console.log("datas", data); InsertDetails(data).then((response) => {
console.log("response", response);
});
window.location.reload(false)
} else { } else {
alert(`หมายเลข ${values.member_tel} นี้ ยังไม่ได้สมัครสมาชิก กรุณาสมัครสมาชิกก่อนเพิ่มการซ่อม`) Modal.info({
title: "ลูกค้ายังไม่ได้สมัครสมาชิก",
content: `หมายเลข ${values.member_tel} นี้ ยังไม่ได้สมัครสมาชิก กรุณาสมัครสมาชิกก่อนเพิ่มการซ่อม `,
});
} }
}; };
...@@ -280,14 +293,14 @@ export default function App(props) { ...@@ -280,14 +293,14 @@ export default function App(props) {
<Col xs={4} md={4} xl={4}></Col> <Col xs={4} md={4} xl={4}></Col>
<Col xs={16} md={16} xl={16}> <Col xs={16} md={16} xl={16}>
<Form.Item <Form.Item
name="repair_detail" name="repair_details"
label="รายละเอียดการซ่อมเบื้องต้น" label="รายละเอียดการซ่อมเบื้องต้น"
tooltip="รายละเอียดการซ่อมเบื้องต้น" tooltip="รายละเอียดการซ่อมเบื้องต้น"
> >
<Input.TextArea /> <Input.TextArea />
</Form.Item> </Form.Item>
<Form.Item> <Form.Item>
<Button type="primary" htmlType="submit"> <Button className="bt-them" htmlType="submit">
เพิ่มการซ่อม เพิ่มการซ่อม
</Button> </Button>
</Form.Item> </Form.Item>
......
src/view/Dashboards/ecommerce/index.jsx
View file @ 25ddf61a
import { React } from "react"; import { React, useEffect, useState } from "react";
import { Layout } from "antd";
import HeaderTap from "../../../Layouts/tabHeader"; import { Link } from "react-router-dom";
import MenuList from "../../../Layouts/menulist";
const { Content, Footer } = Layout; // Import services
import { FetctDetailByGarage } from "../../../services";
// import { useLocation } from "react-router-dom";
import { Row, Col, Divider, Result, Button } from "antd";
//import Widget
import CanvasJSChart from "../../widget/widgetPie";
// import ColumnJSChart from "../../widget/widgetColumn";
// const { Header } = Layout;
export default function Ecommerce() { export default function Ecommerce() {
// let location = useLocation();
const [datas, setDatas] = useState([]);
// const detailID = location.state
// console.log(detailID)
// console.log("datas", datas);
useEffect(() => {
const getDetailByGarage = async () => {
let local = {
garageID: JSON.parse(localStorage.getItem("user")).userData.userId,
};
// console.log("local", local);
// console.log(local);
await FetctDetailByGarage(local).then(async (response) => {
await setDatas(response.data);
});
};
getDetailByGarage();
}, []);
return ( return (
<> <>
<HeaderTap className="site-layout-background" style={{ padding: 0 }} /> {datas !== null ? (
<Layout style={{ minHeight: "100vh", paddingTop: "2vh" }}> <>
<MenuList /> <div className="display-flex-main">
<div className="div-content-chart">
<Layout className="site-layout"> <Row className="content-chart">
<Content style={{ margin: "0 16px" }}> <Col xs={24} lg={24} className="chart">
<div <CanvasJSChart />
className="site-layout-background" </Col>
style={{ padding: 24, minHeight: 360 }} </Row>
> </div>
Bill is a cat.
</div> </div>
</Content> </>
<Footer style={{ textAlign: "center" }}> ) : (
Ant Design ©2018 Created by Ant UED <>
</Footer> <div className="display-flex-main">
</Layout> <div className="div-content-chart">
</Layout> <Row className="content-chart">
<Col xs={24} lg={24} className="chart">
<Result
title="ร้านของคุณยังไม่มีการซ่อม"
extra={
<Button className="bt-them" key="console">
<Link to={"/dashboard/add-detail"}>เพิ่มการซ่อม</Link>
</Button>
}
/>
</Col>
</Row>
</div>
</div>
</>
)}
<Divider />
{/* <CanvasJSChart className="chart" data={location.state} /> */}
</> </>
); );
} }
src/view/Dashboards/repairDashboard/repairAdd/index.jsx
View file @ 25ddf61a
...@@ -3,9 +3,9 @@ import React, { useEffect, useState } from "react"; ...@@ -3,9 +3,9 @@ import React, { useEffect, useState } from "react";
import { Row, Col, Typography, Select } from "antd"; import { Row, Col, Typography, Select } from "antd";
// import Component // import Component
import Car from "./component/car"; import Car from "../../component/car";
import Agriculture from "./component/agriculture"; import Agriculture from "../../component/agriculture";
import Motorcycle from "./component/motorcycle"; import Motorcycle from "../../component/motorcycle";
const { Title, Text } = Typography; const { Title, Text } = Typography;
const { Option } = Select; const { Option } = Select;
......
src/view/Dashboards/repairDashboard/repairList/ShowDetail.jsx 0 → 100644
View file @ 25ddf61a
import React from "react";
// import { Modal, Button, Input } from "antd";
// import { MobileOutlined, DollarOutlined } from "@ant-design/icons";
import { useLocation } from "react-router-dom";
// Import Component
import TitleShowDetail from "../../component/TitleShowDetail";
import SpareAdd from "../../component/SpareAdd";
// const { Meta } = Card;
// const { Text, Title } = Typography;
export default function ShowDetail() {
let location = useLocation();
//use State
const detailID = location.state;
// console.log(detailID);
return (
<>
<TitleShowDetail detailID={detailID.detailsID} />
{/* Show Repair id = {detailID.detailsID} */}
<SpareAdd detailID={detailID.detailsID} />
</>
);
}
src/view/Dashboards/repairDashboard/repairList/index.jsx
View file @ 25ddf61a
import React from 'react'
// Import Component
import RepairTables from '../../../widget/RepairTable'
export default function App() {
return (
<>
<RepairTables />
</>
)
}
\ No newline at end of file
src/view/Login/Login.jsx
View file @ 25ddf61a
...@@ -49,10 +49,7 @@ function App() { ...@@ -49,10 +49,7 @@ function App() {
}); });
}; };
// const removestr = () => {
// sendLogout();
// window.location.reload(false);
// }
return ( return (
<div className="h-100" ref={myRef}> <div className="h-100" ref={myRef}>
...@@ -122,7 +119,7 @@ function App() { ...@@ -122,7 +119,7 @@ function App() {
span: 16, span: 16,
}} }}
> >
<Button type="primary" htmlType="submit"> <Button className="bt-them" htmlType="submit" >
ยืนยัน ยืนยัน
</Button> </Button>
</Form.Item> </Form.Item>
......
src/view/Pages/Register/index.jsx
View file @ 25ddf61a
import React, { useState } from "react"; import React, { useState } from "react";
import { Row, Col, Typography, Checkbox, Form } from "antd"; import { Row, Col, Typography, Checkbox, Form, Modal, Button } from "antd";
import { useHistory } from "react-router-dom"; import { useHistory } from "react-router-dom";
...@@ -13,7 +13,11 @@ export default function App() { ...@@ -13,7 +13,11 @@ export default function App() {
const handleSubmit = () => { const handleSubmit = () => {
if (chechBox === false) { if (chechBox === false) {
alert("กรุณาอ่านข้อกำหนดและเงื่อนไขในการให้บริการ!!"); // alert("กรุณาอ่านข้อกำหนดและเงื่อนไขในการให้บริการ!!");
Modal.info({
title: "ข้อกำหนดและเงื่อนไข",
content: `กรุณาอ่านข้อกำหนดและเงื่อนไขในการใช้บริการ`,
});
} else { } else {
history.push("/register/registion"); history.push("/register/registion");
} }
...@@ -82,7 +86,11 @@ export default function App() { ...@@ -82,7 +86,11 @@ export default function App() {
validator: (_, value) => validator: (_, value) =>
value value
? Promise.resolve() ? Promise.resolve()
: Promise.reject(new Error("กรุณาคลิ๊กที่ช่องว่าง เพื่อยอมรับข้อตกลง")), : Promise.reject(
new Error(
"กรุณาคลิ๊กที่ช่องว่าง เพื่อยอมรับข้อตกลง"
)
),
}, },
]} ]}
> >
...@@ -97,9 +105,10 @@ export default function App() { ...@@ -97,9 +105,10 @@ export default function App() {
</Form> </Form>
</div> </div>
<div className="div-button-submit"> <div className="div-button-submit">
<div className="button-submit" onClick={handleSubmit}>
ถัดไป <Button className="bt-them" onClick={handleSubmit}>
</div> ยืนยัน
</Button>
</div> </div>
</div> </div>
</Col> </Col>
......
src/view/Registion/Registion.jsx
View file @ 25ddf61a
...@@ -492,7 +492,7 @@ export default function RegistrationForm() { ...@@ -492,7 +492,7 @@ export default function RegistrationForm() {
<Form.Item {...tailFormItemLayout}> <Form.Item {...tailFormItemLayout}>
<Button <Button
type="primary" className="bt-them"
htmlType="submit" htmlType="submit"
style={{ marginTop: "30px" }} style={{ marginTop: "30px" }}
> >
......
src/view/widget/RepairTable.jsx 0 → 100644
View file @ 25ddf61a
import React, { useState, useEffect } from "react";
import { Table, Space, Typography } from "antd";
import { Link } from "react-router-dom";
// Import services
import { FetctDetailByGarage } from "../../services";
const { Column, ColumnGroup } = Table;
const { Text } = Typography;
export default function App() {
const [datas, setDatas] = useState([]);
useEffect(() => {
const getDetailByGarage = async () => {
let local = {
garageID: JSON.parse(localStorage.getItem("user")).userData.userId,
};
// console.log("local", local);
// console.log(local);
await FetctDetailByGarage(local).then(async (response) => {
await setDatas(response.data);
});
};
getDetailByGarage();
}, []);
// console.log("datas", datas);
// const clickMore = (key) => {
// console.log("key", key);
// };
return (
<>
<Table dataSource={datas} scroll={{ x: 1000, y: 400 }}>
<ColumnGroup title="ลูกค้า">
<Column
title="ชื่อลูกค้า"
dataIndex="member_name"
key="member_name"
/>
<Column title="รหัสลูกค้า" dataIndex="member_tel" key="member_tel" />
</ColumnGroup>
<ColumnGroup title="รายละเอียด">
<Column
title="ประเภทการซ่อม"
dataIndex="device_type"
key="device_type"
/>
<Column
title="ทะเบียน/ชนิด"
key="detailsID"
render={(text, record) => (
<>
{record.device_type === "รถจักรยานยนต์" ||
record.device_type === "รถยนต์" ? (
<>
<Space size="small">
<Text style={{ fontWeight: "bold" }}>
{record.car_number}
</Text>
</Space>
{<br />}
<Text>{record.car_province}</Text>
</>
) : (
<>
<Text>
{record.equipment}
</Text>
</>
)}
</>
)}
/>
<Column
title="รายละเอียดการซ่อมเบื้องต้น"
dataIndex="repair_details"
key="repair_details"
/>
<Column
title="วันที่รับซ่อม"
dataIndex="repair_date"
key="repair_date"
/>
<Column title="สถานะ" dataIndex="status" key="status" />
<Column
title="เพิ่มเติม"
key="detailsID"
render={(text, record) => (
<Space size="middle">
<Link
to={{
pathname: "/dashboard/all-repair/detail",
state: { detailsID: record.detailsID },
}}
>
<Text style={{ color: "blue" }}>จัดการ</Text>
</Link>
</Space>
)}
/>
</ColumnGroup>
</Table>
</>
);
}
src/view/widget/widgetColumn.jsx 0 → 100644
View file @ 25ddf61a
import React, { useEffect, useState } from "react";
import { CanvasJSChart } from "canvasjs-react-charts";
// Import services
import { FetctDetailByGarage } from "../../services";
export default function Ecommerce(props) {
const [datas, setDatas] = useState([]);
useEffect(() => {
const getDetailByGarage = async () => {
let local = {
garageID: JSON.parse(localStorage.getItem("user")).userData.userId,
};
// console.log("local", local);
// console.log(local);
await FetctDetailByGarage(local).then(async (response) => {
await setDatas(response.data);
});
};
getDetailByGarage();
}, []);
// console.log("datas", datas.length);
let carlist = [];
let motolist = [];
let agirculturelist = [];
for (let i = 0; i < datas.length; i++) {
if (datas[i].device_type === "รถยนต์") {
// console.log(datas[i].device_type);
carlist.push(datas[i].device_type);
}
if (datas[i].device_type === "รถจักรยานยนต์") {
motolist.push(datas[i].device_type);
}
if (datas[i].device_type === "อุปกรณ์การเกษตร") {
agirculturelist.push(datas[i].device_type);
}
}
const options = {
animationEnabled: true,
theme: "light1", // "light1", "dark1", "dark2"
title: {
text: "รายการซ่อมทั้งหมด",
},
data: [
{
type: "column",
// indexLabel: "{label}: {y}%",
startAngle: 60,
dataPoints: [
{ y: carlist.length, label: "รถยนต์" },
{ y: motolist.length, label: "รถจักรยานยนต์" },
{ y: agirculturelist.length, label: "อุปกรณ์การเกษตร" },
{ y: carlist.length, label: "รถยนต์" },
{ y: motolist.length, label: "รถจักรยานยนต์" },
{ y: agirculturelist.length, label: "อุปกรณ์การเกษตร" },
{ y: carlist.length, label: "รถยนต์" },
],
},
],
};
return (
<>
<CanvasJSChart
options={options}
/* onRef={ref => this.chart = ref} */
/>
</>
);
}
src/view/widget/widgetPie.jsx 0 → 100644
View file @ 25ddf61a
import React, { useEffect, useState } from "react";
import {Typography} from 'antd'
import { CanvasJSChart } from "canvasjs-react-charts";
// Import services
import { FetctDetailByGarage } from "../../services";
const { Title } = Typography
export default function Ecommerce(props) {
const [datas, setDatas] = useState([]);
useEffect(() => {
const getDetailByGarage = async () => {
let local = {
garageID: JSON.parse(localStorage.getItem("user")).userData.userId,
};
// console.log("local", local);
// console.log(local);
await FetctDetailByGarage(local).then(async (response) => {
await setDatas(response.data);
});
};
getDetailByGarage();
}, []);
// console.log("datas", datas);
// console.log("datas", datas.length);
let carlist = [];
let motolist = [];
let agirculturelist = [];
let totol = []
if (datas !== null) {
for (let i = 0; i < datas.length; i++) {
if (datas[i].device_type === "รถยนต์") {
// console.log(datas[i].device_type);
carlist.push(datas[i].device_type);
}
if (datas[i].device_type === "รถจักรยานยนต์") {
motolist.push(datas[i].device_type);
}
if (datas[i].device_type === "อุปกรณ์การเกษตร") {
agirculturelist.push(datas[i].device_type);
}
totol.push(datas[i])
}
} else {
// console.log('data is null', datas)
}
// console.log("datas", carlist,motolist, agirculturelist );
const options = {
animationEnabled: true,
theme: "light1", // "light1", "dark1", "dark2"
title: {
text: "รายการซ่อมทั้งหมด",
},
data: [
{
type: "doughnut", //doughnut
startAngle: -90,
// style={{width: '50px'}},
dataPoints: [
{ y: carlist.length, label: "รถยนต์" },
{ y: motolist.length, label: "รถจักรยานยนต์" },
{ y: agirculturelist.length, label: "อุปกรณ์การเกษตร" },
],
},
],
};
return (
<div style={{ heigth: "200px" }}>
<CanvasJSChart
options={options}
/* onRef={ref => this.chart = ref} */
/>
<Title level={5}>การซ่อมทั้งหมด {totol.length} รายการ</Title>
</div>
);
}
yarn.lock
View file @ 25ddf61a
...@@ -4416,6 +4416,11 @@ ...@@ -4416,6 +4416,11 @@
"resolved" "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001282.tgz" "resolved" "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001282.tgz"
"version" "1.0.30001282" "version" "1.0.30001282"
"canvasjs-react-charts@^1.0.5":
"integrity" "sha512-8P3KnAvCqftmqf4O/xG6PlIDcTr0IvzuE4l6ACXIOROKtFmnmUu/xPEeq+0vI9Xvh7zXjzZvRqw0p1uxXr034g=="
"resolved" "https://registry.npmjs.org/canvasjs-react-charts/-/canvasjs-react-charts-1.0.5.tgz"
"version" "1.0.5"
"capture-exit@^2.0.0": "capture-exit@^2.0.0":
"integrity" "sha512-PiT/hQmTonHhl/HFGN+Lx3JJUznrVYJ3+AQsnthneZbvW7x+f08Tk7yLJTLEOUvBTbduLeeBkxEaYXUOUrRq6g==" "integrity" "sha512-PiT/hQmTonHhl/HFGN+Lx3JJUznrVYJ3+AQsnthneZbvW7x+f08Tk7yLJTLEOUvBTbduLeeBkxEaYXUOUrRq6g=="
"resolved" "https://registry.npmjs.org/capture-exit/-/capture-exit-2.0.0.tgz" "resolved" "https://registry.npmjs.org/capture-exit/-/capture-exit-2.0.0.tgz"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment