---
title: 审批流预览弹窗
sidemenu: true
---

## 审批流预览弹窗


```tsx
/**
 * background: '#f0f2f5'
 */

import React, {useState,useEffect} from 'react';
import { Space, Button } from 'antd';
import {AuditPreview} from '@/components';
export default () => {
const [openObj, setOpenObj ] = useState
useEffect(()=>{
setOpenObj({
    "isopen": false,
    "appId": 143,
    "data": {
        "features": {
            "data": [
                {
                    "id": "4295032402",
                    "expiredAt": 0
                }
            ]
        },
        "role": {
            "id": 4294969545,
            "appId": 143,
            "name": "运营",
            "key": "yunying12",
            "type": 1,
            "state": 0,
            "auditTemplateId": 12,
            "remark": "运营同学专用",
            "extend": "",
            "ownerId": 398464,
            "isAllowApply": 1,
            "nameZh": "黄秀宇",
            "nameEn": "edith.huang",
            "userState": 1,
            "auditTemplateName": "wwytest1",
            "dataSensitive": 1,
            "sensitiveLevel": 0,
            "createdAt": 1644394076,
            "updatedAt": 1701847556
        },
        "flags": {
            "data80": {
                "data": [
                    {
                        "id": "152678",
                        "expiredAt": 0
                    }
                ]
            }
        },
        "roleIdForData": 4294969545,
        "applyType": 1,
        "otherUsers": []
    }
})
},[])
  return (
    <Space direction="vertical" style={{width: 500}} >
    <a onClick={()=>{setOpenObj({...openObj,isopen:true})}}></a>
    <AuditPreview openObj={openObj} setOpenObj={setOpenObj} />
    </Space>
  );
};
```

<API src="@/components/AuditList"></API>