upp

src/pages/ALookPage/A2DS/index.module.scss

@@ -1,4 +1,55 @@
 .A2DS {
+  position: absolute;
+  z-index: 10;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: #fff;
+  border-radius: 10px;
+  padding: 15px 24px;
   :global {
+    .lookDSBtn {
+      text-align: end;
+      margin-bottom: 10px;
+      padding-right: 45px;
+    }
+
+    .lookDSBox {
+      width: 100%;
+      height: calc(100% - 42px);
+      position: relative;
+      overflow-y: auto;
+      .lookTit {
+        width: calc(100% - 30px);
+        font-weight: 700;
+        color: var(--themeColor);
+        font-size: 18px;
+        padding: 12px 0;
+        border-top: 1px solid #ccc;
+      }
+      .lookTit {
+        display: flex;
+        width: 1000px;
+        justify-content: space-between;
+      }
+    }
+
+    .lookDSBoxAdd {
+      position: absolute;
+      top: 0;
+      left: 0;
+      z-index: 100;
+      width: 100%;
+      height: 100%;
+      padding: 50px;
+      background-color: rgba(0, 0, 0, 0.6);
+      border-radius: 10px;
+      & > div {
+        position: relative;
+        width: 100%;
+        height: 100%;
+      }
+    }
   }
 }

src/pages/ALookPage/A2DS/index.tsx

@@ -1,9 +1,141 @@
-import React from 'react'
+import React, { useCallback, useEffect, useMemo, useState } from 'react'
 import styles from './index.module.scss'
+import { useParams } from 'react-router-dom'
+import { A2A_APIgetInfo, A2A_APIremove } from '@/store/action/A2Abusiness'
+import { Button } from 'antd'
+import MyPopconfirm from '@/components/MyPopconfirm'
+import { A1addType } from '@/pages/A1Camera/data'
+import { MessageFu } from '@/utils/message'
+import history from '@/utils/history'
+import { A2AListCamerasType, A2AListType } from '@/types'
+import AddBusiness from '@/pages/A2Abusiness/AddBusiness'
+import LookTxt from '../components/LookTxt'
+import { A2AtopTypeObj } from '@/pages/A2Abusiness/data'
+import LookTxt2 from '../components/LookTxt2'
+import LookTable from '../components/LookTable'
+import { lookTable2 } from '../components/LookTable/tableData'
+
 function A2DS() {
+  const urlObj: any = useParams()
+
+  const [urlId, setUrlId] = useState(0)
+
+  const [info, setInfo] = useState({} as A2AListType)
+
+  // 获取地址栏参数
+  useEffect(() => {
+    setUrlId(Number(urlObj.id))
+  }, [urlObj])
+
+  // 通过id获取详情
+  const getInfoFu = useCallback(async (id: number) => {
+    const res = await A2A_APIgetInfo(id)
+    if (res.code === 0) {
+      const data = res.data
+
+      const rtf = data.rtf || '{"isSection":"true","txtArr":[{"txt":"<p></p>"}]}'
+      const refObj = JSON.parse(rtf)
+
+      const rtfDesc = data.rtfDesc || '{"isSection":"true","txtArr":[{"txt":"<p></p>"}]}'
+      const rtfDescObj = JSON.parse(rtfDesc)
+      setInfo({
+        ...data,
+        cameras: data.cameras || [],
+        files: data.files || [],
+        rtf: refObj,
+        rtfDesc: rtfDescObj
+      })
+    }
+  }, [])
+
+  // 进页面发送请求
+  useEffect(() => {
+    if (urlId) {
+      getInfoFu(urlId)
+    }
+  }, [getInfoFu, urlId])
+
+  // 点击删除
+  const delFu = useCallback(async () => {
+    const res = await A2A_APIremove(urlId)
+    if (res.code === 0) {
+      MessageFu.success('删除成功!')
+      history.go(-1)
+    }
+  }, [urlId])
+
+  // 点击编辑
+  const [openInfo, setOpenInfo] = useState<A1addType>({ id: 0, txt: '' })
+
+  // 第二个信息标题
+  const tit2 = useMemo(() => {
+    return Reflect.get(A2AtopTypeObj, info.type)
+  }, [info.type])
+
   return (
     <div className={styles.A2DS}>
-      <div className='pageTitle'>业务订单-查看（租赁）</div>
+      <div className='pageTitle'>业务订单-查看（定损）</div>
+
+      <div className='lookDSBtn'>
+        <Button type='primary' onClick={() => setOpenInfo({ id: urlId, txt: '编辑' })}>
+          编辑
+        </Button>
+        &emsp;
+        <MyPopconfirm
+          txtK='删除'
+          loc='bottom'
+          onConfirm={() => delFu()}
+          Dom={<Button danger>删除</Button>}
+        />
+      </div>
+
+      {info.id ? (
+        <div className='lookDSBox'>
+          <div className='lookTit'>订单信息</div>
+
+          <LookTxt info={info} />
+
+          <div className='lookTit'>{tit2}信息</div>
+
+          <LookTxt2 info={info} tit2={tit2} />
+
+          <div className='lookTit'>相机清单</div>
+
+          <LookTable
+            list={info.cameras}
+            columnsTemp={lookTable2}
+            lastBtn={[
+              {
+                title: '操作',
+                render: (item: A2AListCamerasType) => (
+                  <Button
+                    size='small'
+                    type='text'
+                    onClick={() => history.push(`/lookList/${item.id}`)}
+                  >
+                    查看
+                  </Button>
+                )
+              }
+            ]}
+          />
+        </div>
+      ) : null}
+
+      {/* 编辑 出来的页面 */}
+      {openInfo.id ? (
+        <div className='lookDSBoxAdd'>
+          <div>
+            <AddBusiness
+              topType={info.type}
+              openInfo={openInfo}
+              closeFu={() => setOpenInfo({ id: 0, txt: '' })}
+              upTableFu={() => getInfoFu(urlId)}
+              addTableFu={() => {}}
+            />
+          </div>
+        </div>
+      ) : null}
     </div>
   )
 }

src/pages/ALookPage/components/LookTxt/index.module.scss

@@ -5,7 +5,7 @@
       width: 100%;
       margin-bottom: 10px;
       .lLtxtLeft {
-        width: 110px;
+        width: 120px;
         text-align: right;
         font-weight: 700;
         span {
@@ -13,7 +13,7 @@
         }
       }
       .lLtxtRight {
-        width: calc(100% - 110px);
+        width: calc(100% - 120px);
         img {
           max-width: 300px;
           max-height: 300px;

src/pages/ALookPage/components/LookTxt/index.tsx

@@ -56,9 +56,9 @@ function LookTxt({ info }: Props) {
         </div>
       ) : null}
 
-      {['BX'].includes(info.type) ? (
+      {['BX', 'DS'].includes(info.type) ? (
         <div className='lLtxt'>
-          <div className='lLtxtLeft'>问题描述：</div>
+          <div className='lLtxtLeft'>{info.type === 'BX' ? '问题描述' : '定损结果'}：</div>
           <div
             className='lLtxtRight'
             dangerouslySetInnerHTML={{
@@ -68,6 +68,22 @@ function LookTxt({ info }: Props) {
         </div>
       ) : null}
 
+      {['DS'].includes(info.type) ? (
+        <>
+          <div className='lLtxt'>
+            <div className='lLtxtLeft'>
+              <span>*</span> 定损报价：
+            </div>
+            <div className='lLtxtRight'>{info.price || '（空）'}</div>
+          </div>
+
+          <div className='lLtxt'>
+            <div className='lLtxtLeft'>定损单发送对象：</div>
+            <div className='lLtxtRight'>{info.user || '（空）'}</div>
+          </div>
+        </>
+      ) : null}
+
       <div className='lLtxt'>
         <div className='lLtxtLeft'>备注：</div>
         <div