@appthen/cli 1.2.10 → 1.2.11

package/tests/test-app/src/pages/mobile_terminal/WorkOrderHomepage.tsx

@@ -0,0 +1,337 @@
+/**
+ * 工单首页
+ * @type Component
+ * @screen 375w
+ * @frames app
+ */
+import React from 'react';
+import { AtIcon, Component, HeaderBar, Input, ScrollView, Text, View } from 'cross-ui';
+import WorkOrderCard from '/src/pages/component/WorkOrderCard';
+
+
+class IProps {}
+
+/*
+ * 数据与接口请求定义
+ */
+class IState {
+  tabs: {
+    /* @example 全部 */text?: string,
+    /* @example all */value?: string,
+  }[];
+  currentTab: string;
+}
+
+class Document extends React.Component<IProps, IState> {
+  state = {
+    tabs: [
+      { text: '全部', value: 'all' },
+      { text: '高优先级', value: 'high' },
+      { text: '待处理', value: 'process' },
+      { text: '进行中', value: 'going' },
+      { text: '已完成', value: 'completed' },
+    ],
+    currentTab: 'all',
+  };
+
+  render() {
+    return (
+      <React.Fragment>
+        <View className="h-full flex flex-col bg-[#f5f5f5]">
+          <HeaderBar
+            backgroundColor="#6749ff"
+            mode="dark"
+            showBack={false}
+            title="工单管理"
+            titleAlign="center"
+            translucent={true}
+            rightContent={
+              <View className="flex flex-row">
+                <View className="pt-[5px] pb-[5px] pl-[5px] pr-[5px] mr-[10px]">
+                  <AtIcon
+                    color="#ffffff"
+                    size={24}
+                    svg="&#60;?xml version=&#34;1.0&#34; encoding=&#34;utf-8&#34; ?&#62;&#10;&#60;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; xmlns:xlink=&#34;http://www.w3.org/1999/xlink&#34; width=&#34;100%&#34; height=&#34;100%&#34; viewBox=&#34;0 0 24 24&#34;&#62;&#10;\t&#60;defs&#62;&#10;\t\t&#60;clipPath id=&#34;clipPath5783052353&#34;&#62;&#10;\t\t\t&#60;path d=&#34;M0 0L24 0L24 24L0 24L0 0Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0 0)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;/clipPath&#62;&#10;\t&#60;/defs&#62;&#10;\t&#60;g clip-path=&#34;url(#clipPath5783052353)&#34;&#62;&#10;\t\t&#60;path d=&#34;M17.6371 14.4989C17.5593 14.4052 17.4829 14.3114 17.4079 14.2209C16.3766 12.9736 15.7527 12.2208 15.7527 8.68969C15.7527 6.86156 15.3154 5.36156 14.4533 4.23656C13.8177 3.40547 12.9585 2.775 11.826 2.30906C11.8187 2.30501 11.8118 2.30035 11.8054 2.29507C11.7989 2.28979 11.793 2.28399 11.7876 2.27766C11.3802 0.913594 10.2655 0 9.00835 0C7.75116 0 6.63694 0.913594 6.2296 2.27625C6.22416 2.28235 6.21826 2.28796 6.21189 2.29307C6.20552 2.29818 6.19876 2.30273 6.19163 2.30672C3.54882 3.39469 2.26444 5.48203 2.26444 8.68828C2.26444 12.2208 1.64148 12.9736 0.609288 14.2195C0.534288 14.31 0.457882 14.4019 0.380069 14.4975C0.174856 14.745 0.0525298 15.0283 0.0130913 15.3473C-0.026347 15.6664 0.0233227 15.9709 0.162101 16.2609C0.451319 16.8703 1.06773 17.2486 1.77132 17.2486L16.2505 17.2486C16.9509 17.2486 17.563 16.8708 17.8532 16.2642C17.9926 15.9741 18.0427 15.6694 18.0036 15.3499C17.9645 15.0305 17.8423 14.7468 17.6371 14.4989ZM9.00835 21C9.69835 20.9994 10.3394 20.8221 10.9316 20.4679C11.5238 20.1137 11.9833 19.6328 12.3102 19.0252C12.3433 18.9627 12.3415 18.9012 12.305 18.8407C12.2685 18.7802 12.215 18.7499 12.1443 18.75L5.87335 18.75C5.80258 18.7498 5.74888 18.7799 5.71225 18.8405C5.67562 18.901 5.67386 18.9626 5.70694 19.0252C6.03381 19.6327 6.49328 20.1136 7.08535 20.4678C7.67743 20.822 8.31843 20.9994 9.00835 21Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 2.99165 1.5)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t&#60;/g&#62;&#10;&#60;/svg&#62;&#10;"
+                  />
+                </View>
+                <View
+                  onClick={e => this.newWorkOrder(e)}
+                  className="pt-[5px] pb-[5px] pl-[5px] pr-[5px] mr-[10px]"
+                >
+                  <AtIcon
+                    color="#ffffff"
+                    size={24}
+                    svg="&#60;?xml version=&#34;1.0&#34; encoding=&#34;utf-8&#34; ?&#62;&#10;&#60;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; xmlns:xlink=&#34;http://www.w3.org/1999/xlink&#34; width=&#34;100%&#34; height=&#34;100%&#34; viewBox=&#34;0 0 24 24&#34;&#62;&#10;\t&#60;defs&#62;&#10;\t\t&#60;clipPath id=&#34;clipPath8223961733&#34;&#62;&#10;\t\t\t&#60;path d=&#34;M0 0L24 0L24 24L0 24L0 0Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0 0)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;/clipPath&#62;&#10;\t&#60;/defs&#62;&#10;\t&#60;g clip-path=&#34;url(#clipPath8223961733)&#34;&#62;&#10;\t\t&#60;path d=&#34;M6.75 -0.75C6.33579 -0.75 6 -0.41421 6 0L6 6L0 6C-0.41421 6 -0.75 6.33579 -0.75 6.75C-0.75 7.16421 -0.41421 7.5 0 7.5L6 7.5L6 13.5C6 13.9142 6.33579 14.25 6.75 14.25C7.16421 14.25 7.5 13.9142 7.5 13.5L7.5 7.5L13.5 7.5C13.9142 7.5 14.25 7.16421 14.25 6.75C14.25 6.33579 13.9142 6 13.5 6L7.5 6L7.5 0C7.5 -0.41421 7.16421 -0.75 6.75 -0.75Z&#34; fill-rule=&#34;evenodd&#34; transform=&#34;matrix(1 0 0 1 5.25 5.25)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t&#60;/g&#62;&#10;&#60;/svg&#62;&#10;"
+                  />
+                </View>
+              </View>
+            }
+          />
+          <View
+            __hidePh={true}
+            className="h-[120px] fixed top-[0px] right-[0px] left-[0px] bg-gradient-to-r bg-[linear-gradient(to right, rgba(33,99,235,1), rgba(96,165,250,1))] z-[1]"
+          />
+          <View
+            __hidePh={true}
+            className="mt-[10px] h-[110px] bg-[#ffffff] z-[2] rounded-tl-[20px] rounded-tr-[20px] pt-[12px] pl-[12px] pr-[12px]"
+          >
+            <View className="pt-[6px] pb-[6px] bg-[#f3f4f6] rounded-[20px] pl-[10px] pr-[10px]">
+              <Input
+                type="text"
+                confirmType="done"
+                value=""
+                placeholder="搜索工单信息"
+              />
+            </View>
+            <View className="mt-[20px] flex flex-row">
+              {this.state.tabs.map((item, index) => (
+                <View
+                  onClick={e =>
+                    this.switchTabs(e, {
+                      item: item,
+                      index: index,
+                    })
+                  }
+                  className="pl-[10px] pr-[10px] pt-[5px] pb-[5px] mr-[2px] ml-[2px]"
+                >
+                  <View>
+                    <Text
+                      inlineStyle={[
+                        {
+                          enable: this.state.currentTab == item?.value,
+                          name: '动态样式1',
+                          style: { color: '#3b82f6' },
+                        },
+                      ]}
+                      className="text-sm text-[#333333]"
+                    >
+                      {item?.text}
+                    </Text>
+                  </View>
+                  <View
+                    inlineStyle={[
+                      {
+                        enable: this.state.currentTab == item?.value,
+                        name: '动态样式1',
+                        style: { backgroundColor: '#3b82f6' },
+                      },
+                    ]}
+                    className="h-[4px] bg-[#ffffff] mt-[10px]"
+                  />
+                </View>
+              ))}
+            </View>
+          </View>
+          <ScrollView className="pb-[20px]">
+            <View className="mt-[12px] pl-[12px] pr-[12px]">
+              <WorkOrderCard
+                status="completed"
+                onGoDetail={e => {
+                  this.utils.navigateTo('workOrderDetails');
+                }}
+              />
+            </View>
+            <View className="pl-[12px] pr-[12px] mt-[12px] flex flex-row">
+              <View
+                __hidePh={true}
+                className="bg-[#f97316] bottom-[0px] top-[0px] left-[0px] w-[17px] rounded-tl-[20px] rounded-bl-[20px] mr-[-11px]"
+              />
+              <View
+                __hidePh={true}
+                className="bg-[#ffffff] rounded-xl relative flex-1 pt-[10px] pb-[10px] pl-[10px] pr-[10px]"
+              >
+                <View className="flex flex-row items-center">
+                  <View className="flex-1">
+                    <Text className="text-sm text-[#666666]">
+                      WO-2023110001
+                    </Text>
+                  </View>
+                  <View className="bg-[#3b82f6] pt-[6px] pr-[10px] pb-[6px] pl-[10px] rounded-[15px]">
+                    <Text className="text-xs text-[#ffffff]">进行中</Text>
+                  </View>
+                </View>
+                <View className="mt-[10px]">
+                  <Text className="text-sm text-[#333] font-bold">
+                    设备故障维修申请
+                  </Text>
+                </View>
+                <View className="mt-[10px]">
+                  <Text numberOfLines={1} className="text-xs text-[#333]">
+                    3号生产线主轴电机出现异常噪音，需要紧急检修以比
+                  </Text>
+                </View>
+                <View className="mt-[10px] flex flex-row items-center">
+                  <View className="flex flex-row">
+                    <AtIcon
+                      color="#666"
+                      size={20}
+                      svg="&#60;?xml version=&#34;1.0&#34; encoding=&#34;utf-8&#34; ?&#62;&#10;&#60;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; xmlns:xlink=&#34;http://www.w3.org/1999/xlink&#34; width=&#34;100%&#34; height=&#34;100%&#34; viewBox=&#34;0 0 12 12&#34;&#62;&#10;\t&#60;defs&#62;&#10;\t\t&#60;clipPath id=&#34;clipPath5115394031&#34;&#62;&#10;\t\t\t&#60;path d=&#34;M0 0L12 0L12 12L0 12L0 0Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0 0)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;/clipPath&#62;&#10;\t&#60;/defs&#62;&#10;\t&#60;g clip-path=&#34;url(#clipPath5115394031)&#34;&#62;&#10;\t\t&#60;path d=&#34;M1.67816 6.0308L1.67816 2.65931C1.67816 2.45221 1.51027 2.28431 1.30316 2.28431C1.09606 2.28431 0.928164 2.45221 0.928164 2.65931L0.928164 6.0308Q0.936713 6.57501 1.32039 6.95267Q1.70406 7.33034 2.24242 7.33034Q2.78078 7.33034 3.16446 6.95267Q3.54813 6.57501 3.55663 6.03672L3.55973 1.61191Q3.56967 0.794366 2.99203 0.209683Q2.4144 -0.375 1.5925 -0.375Q0.770602 -0.375 0.192968 0.209683Q-0.384667 0.794366 -0.374698 1.6162L-0.374726 6.06056Q-0.390517 7.14867 0.377193 7.92757Q1.1449 8.70648 2.23856 8.70648Q3.33221 8.70648 4.09992 7.92758Q4.86763 7.14867 4.8518 6.05513L4.85184 1.90322C4.85184 1.69611 4.68394 1.52822 4.47684 1.52822C4.26973 1.52822 4.10184 1.69611 4.10184 1.90322L4.10188 6.06599Q4.11316 6.84572 3.56576 7.4011Q3.01836 7.95648 2.23856 7.95648Q1.45875 7.95648 0.911348 7.4011Q0.363947 6.84572 0.375274 6.06056L0.375246 1.60711Q0.369078 1.09857 0.726504 0.736788Q1.08393 0.375 1.5925 0.375Q2.10107 0.375 2.4585 0.736788Q2.81592 1.09858 2.80973 1.6114L2.80673 6.02487Q2.80308 6.25601 2.63833 6.41817Q2.47359 6.58034 2.24242 6.58034Q2.01126 6.58034 1.84651 6.41817Q1.68177 6.25601 1.67816 6.0308Z&#34; fill-rule=&#34;evenodd&#34; transform=&#34;matrix(1 0 0 1 3.76121 1.84069)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t&#60;/g&#62;&#10;&#60;/svg&#62;&#10;"
+                    />
+                  </View>
+                  <View className="ml-[5px]">
+                    <Text className="text-xs text-[#666666]">2个附件</Text>
+                  </View>
+                </View>
+                <View className="mt-[10px] flex flex-row">
+                  <View className="flex flex-row items-center">
+                    <View className="w-[28px] h-[28px] bg-[#add2ff] rounded-[15px] flex flex-col justify-center items-center">
+                      <Text className="text-sm text-[#3b82f6]">李</Text>
+                    </View>
+                    <View className="ml-[10px]">
+                      <Text className="text-sm text-[#666666]">李明</Text>
+                    </View>
+                  </View>
+                  <View className="flex-row flex-1 flex justify-end">
+                    <View
+                      __hidePh={true}
+                      onClick={e => this.jumpToTheDetailsPage(e)}
+                      className="bg-[#f3f4f6] w-[40px] h-[40px] rounded-[20px] flex flex-col justify-center items-center mr-[10px]"
+                    >
+                      <AtIcon
+                        color="#666"
+                        size={20}
+                        svg="&#60;?xml version=&#34;1.0&#34; encoding=&#34;utf-8&#34; ?&#62;&#10;&#60;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; xmlns:xlink=&#34;http://www.w3.org/1999/xlink&#34; width=&#34;100%&#34; height=&#34;100%&#34; viewBox=&#34;0 0 20 20&#34;&#62;&#10;\t&#60;defs&#62;&#10;\t\t&#60;clipPath id=&#34;clipPath0894376390&#34;&#62;&#10;\t\t\t&#60;path d=&#34;M0 0L20 0L20 20L0 20L0 0Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0 0)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;/clipPath&#62;&#10;\t&#60;/defs&#62;&#10;\t&#60;g clip-path=&#34;url(#clipPath0894376390)&#34;&#62;&#10;\t\t&#60;circle cx=&#34;2.5&#34; cy=&#34;2.5&#34; r=&#34;2.5&#34; transform=&#34;matrix(1 0 0 1 7.5 7.5)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;path d=&#34;M18.5492 5.57031C17.5156 3.97188 16.1746 2.61406 14.6715 1.64336C13.0086 0.568359 11.1727 0 9.36252 0C7.70158 0 6.06837 0.474609 4.50822 1.41055C2.9172 2.36484 1.4758 3.75898 0.223843 5.55391C0.079313 5.76135 0.00477175 5.99146 0.000219643 6.24425C-0.00433246 6.49703 0.0618755 6.72968 0.198843 6.94219C1.23048 8.55664 2.55822 9.91641 4.03791 10.8738C5.70392 11.9531 7.49689 12.5 9.36252 12.5C11.1871 12.5 13.027 11.9363 14.6828 10.8703C16.1852 9.90273 17.5235 8.53984 18.5531 6.92812C18.6852 6.72088 18.7509 6.49438 18.7501 6.24865C18.7494 6.00291 18.6825 5.7768 18.5492 5.57031ZM9.3758 10C8.34026 10 7.45638 9.63388 6.72415 8.90165C5.99191 8.16942 5.6258 7.28553 5.6258 6.25C5.6258 5.21447 5.99191 4.33058 6.72415 3.59835C7.45638 2.86612 8.34026 2.5 9.3758 2.5C10.4113 2.5 11.2952 2.86612 12.0274 3.59835C12.7597 4.33058 13.1258 5.21447 13.1258 6.25C13.1246 7.28504 12.7581 8.16851 12.0262 8.90039C11.2943 9.63228 10.4108 9.99882 9.3758 10Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0.624204 3.75)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t&#60;/g&#62;&#10;&#60;/svg&#62;&#10;"
+                      />
+                    </View>
+                    <View
+                      __hidePh={true}
+                      className="bg-[#f3f4f6] w-[40px] h-[40px] rounded-[20px] flex flex-col justify-center items-center mr-[10px]"
+                    >
+                      <AtIcon
+                        color="#666"
+                        size={20}
+                        svg="&#60;?xml version=&#34;1.0&#34; encoding=&#34;utf-8&#34; ?&#62;&#10;&#60;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; xmlns:xlink=&#34;http://www.w3.org/1999/xlink&#34; width=&#34;100%&#34; height=&#34;100%&#34; viewBox=&#34;0 0 20 20&#34;&#62;&#10;\t&#60;defs&#62;&#10;\t\t&#60;clipPath id=&#34;clipPath2557746411&#34;&#62;&#10;\t\t\t&#60;path d=&#34;M0 0L20 0L20 20L0 20L0 0Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0 0)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;/clipPath&#62;&#10;\t&#60;/defs&#62;&#10;\t&#60;g clip-path=&#34;url(#clipPath2557746411)&#34;&#62;&#10;\t\t&#60;path d=&#34;M12.7935 -0.418716L12.7938 -0.419009Q13.2343 -0.859375 13.8572 -0.859375Q14.4804 -0.859375 14.921 -0.418751L14.9505 -0.389229Q15.3907 0.0513004 15.3907 0.674075Q15.3907 1.29685 14.9502 1.7376L14.4897 2.19815Q14.4299 2.258 14.3595 2.30503Q14.2891 2.35205 14.2109 2.38444Q14.1327 2.41683 14.0497 2.43334Q13.9667 2.44986 13.882 2.44986Q13.7974 2.44986 13.7144 2.43334Q13.6314 2.41683 13.5532 2.38444Q13.475 2.35205 13.4046 2.30503Q13.3342 2.258 13.2744 2.19815L12.3327 1.25649Q12.2729 1.19661 12.2259 1.12621Q12.1789 1.05582 12.1465 0.977606Q12.1142 0.899394 12.0977 0.816373Q12.0812 0.733351 12.0812 0.64871Q12.0813 0.564069 12.0978 0.481061Q12.1144 0.398054 12.1468 0.319869Q12.1792 0.241685 12.2263 0.171328Q12.2733 0.100972 12.3332 0.0411472L12.7935 -0.418716ZM10.6665 1.70781L0.035724 12.3648Q-0.084919 12.4857 -0.150137 12.6436L-0.794278 14.203Q-0.826593 14.2812 -0.843025 14.3643Q-0.859457 14.4473 -0.859375 14.5319Q-0.859292 14.6166 -0.842699 14.6996Q-0.826106 14.7826 -0.793639 14.8607Q-0.761172 14.9389 -0.71408 15.0092Q-0.666988 15.0796 -0.607079 15.1394Q-0.547171 15.1992 -0.476749 15.2461Q-0.406327 15.2931 -0.328097 15.3254Q-0.170506 15.3905 7.45058e-09 15.3905Q0.170506 15.3905 0.328097 15.3254L1.88747 14.6812Q2.04536 14.616 2.1663 14.4954L12.8225 3.8653Q12.8825 3.80553 12.9296 3.73521Q12.9767 3.66489 13.0092 3.58673Q13.0417 3.50857 13.0583 3.42558Q13.0749 3.34259 13.075 3.25794Q13.0751 3.1733 13.0587 3.09027Q13.0423 3.00723 13.01 2.929Q12.9777 2.85076 12.9308 2.78032Q12.8838 2.70989 12.824 2.64997L11.8819 1.70781Q11.822 1.64796 11.7517 1.60094Q11.6813 1.55391 11.6031 1.52152Q11.5249 1.48913 11.4419 1.47262Q11.3589 1.45611 11.2742 1.45611Q11.1896 1.45611 11.1066 1.47262Q11.0235 1.48913 10.9453 1.52152Q10.8672 1.55391 10.7968 1.60094Q10.7264 1.64796 10.6665 1.70781Z&#34; fill-rule=&#34;evenodd&#34; transform=&#34;matrix(1 0 0 1 2.73438 2.73452)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t&#60;/g&#62;&#10;&#60;/svg&#62;&#10;"
+                      />
+                    </View>
+                    <View
+                      __hidePh={true}
+                      className="bg-[#f3f4f6] w-[40px] h-[40px] rounded-[20px] flex flex-col justify-center items-center"
+                    >
+                      <AtIcon
+                        color="#666"
+                        size={20}
+                        svg="&#60;?xml version=&#34;1.0&#34; encoding=&#34;utf-8&#34; ?&#62;&#10;&#60;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; xmlns:xlink=&#34;http://www.w3.org/1999/xlink&#34; width=&#34;100%&#34; height=&#34;100%&#34; viewBox=&#34;0 0 20 20&#34;&#62;&#10;\t&#60;defs&#62;&#10;\t\t&#60;clipPath id=&#34;clipPath0406936548&#34;&#62;&#10;\t\t\t&#60;path d=&#34;M0 0L20 0L20 20L0 20L0 0Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0 0)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;/clipPath&#62;&#10;\t&#60;/defs&#62;&#10;\t&#60;g clip-path=&#34;url(#clipPath0406936548)&#34;&#62;&#10;\t\t&#60;path d=&#34;M12.5003 6.875C11.6972 6.875 10.9206 6.51641 10.3128 5.86563C9.72178 5.23086 9.36084 4.38438 9.29717 3.48281C9.2292 2.52109 9.52256 1.63672 10.123 0.992188C10.7233 0.347657 11.5628 0 12.5003 0C13.4312 0 14.273 0.353906 14.8714 0.996875C15.4757 1.64609 15.7698 2.52891 15.7019 3.48242C15.6366 4.38516 15.2761 5.23125 14.6862 5.86523C14.08 6.51641 13.3038 6.875 12.5003 6.875ZM17.6499 13.75L7.35108 13.75C7.18329 13.7509 7.02391 13.7147 6.87293 13.6415C6.72196 13.5683 6.59488 13.4655 6.4917 13.3332C6.3823 13.1898 6.30957 13.0298 6.27353 12.853C6.23748 12.6763 6.24172 12.5006 6.28623 12.3258C6.61514 11.0051 7.42999 9.90976 8.64248 9.15859C9.71866 8.49219 11.0886 8.125 12.5003 8.125C13.9398 8.125 15.2737 8.47656 16.3562 9.14258C17.5714 9.88984 18.3874 10.9914 18.7148 12.3281C18.7587 12.503 18.7625 12.6788 18.726 12.8554C18.6896 13.032 18.6166 13.1919 18.5069 13.3352C18.4039 13.4669 18.2771 13.5691 18.1265 13.642C17.976 13.7149 17.8171 13.7509 17.6499 13.75ZM5.11749 7.03125C3.74288 7.03125 2.53428 5.75313 2.42217 4.18242C2.3667 3.37773 2.61749 2.63359 3.1253 2.08789C3.62764 1.54766 4.33624 1.25 5.11749 1.25C5.89874 1.25 6.60186 1.54922 7.10694 2.09258C7.61866 2.64258 7.86866 3.38516 7.81006 4.1832C7.69795 5.75352 6.48975 7.03125 5.11749 7.03125ZM7.68233 8.25977C6.99522 7.92383 6.10342 7.75586 5.11788 7.75586C3.96709 7.75586 2.84952 8.05586 1.97061 8.60039C0.974126 9.21875 0.303814 10.1191 0.0331106 11.2063C-0.00701755 11.3646 -0.010671 11.5239 0.0221504 11.6839C0.0549717 11.844 0.120995 11.9889 0.22022 12.1187C0.314407 12.2397 0.430431 12.3336 0.568293 12.4006C0.706154 12.4676 0.851718 12.5007 1.00499 12.5L5.34092 12.5C5.41644 12.5 5.48318 12.4758 5.54114 12.4274C5.59911 12.379 5.63485 12.3177 5.64834 12.2434C5.65264 12.2187 5.65811 12.1941 5.66436 12.1699C5.99561 10.8395 6.77178 9.71523 7.91866 8.8957C8.01024 8.82968 8.05338 8.74029 8.04808 8.62751C8.04277 8.51473 7.99143 8.42978 7.89405 8.37265C7.83272 8.33672 7.76241 8.29883 7.68233 8.25977Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0.624702 3.125)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t&#60;/g&#62;&#10;&#60;/svg&#62;&#10;"
+                      />
+                    </View>
+                  </View>
+                </View>
+                <View className="mt-[10px] flex flex-row items-center justify-between">
+                  <View>
+                    <Text className="text-sm text-[#9b9b9b]">
+                      创建于 2023-11-05
+                    </Text>
+                  </View>
+                  <View>
+                    <Text className="text-sm text-[#ef4444]">
+                      期望完成：2023-11-08
+                    </Text>
+                  </View>
+                </View>
+              </View>
+            </View>
+            <View className="pl-[12px] pr-[12px] mt-[12px] flex flex-row">
+              <View
+                __hidePh={true}
+                className="bg-[#ef4444] bottom-[0px] top-[0px] left-[0px] w-[17px] rounded-tl-[20px] rounded-bl-[20px] mr-[-11px]"
+              />
+              <View
+                __hidePh={true}
+                className="bg-[#ffffff] rounded-xl relative flex-1 pt-[10px] pb-[10px] pl-[10px] pr-[10px]"
+              >
+                <View className="flex flex-row items-center">
+                  <View className="flex-1">
+                    <Text className="text-sm text-[#666666]">
+                      WO-2023110001
+                    </Text>
+                  </View>
+                  <View className="bg-[#f97316] pt-[6px] pr-[10px] pb-[6px] pl-[10px] rounded-[15px]">
+                    <Text className="text-xs text-[#ffffff]">待处理</Text>
+                  </View>
+                </View>
+                <View className="mt-[10px]">
+                  <Text className="text-sm text-[#333] font-bold">
+                    设备故障维修申请
+                  </Text>
+                </View>
+                <View className="mt-[10px]">
+                  <Text numberOfLines={1} className="text-xs text-[#333]">
+                    3号生产线主轴电机出现异常噪音，需要紧急检修以比
+                  </Text>
+                </View>
+                <View className="mt-[10px] flex flex-row items-center">
+                  <View className="flex flex-row">
+                    <AtIcon
+                      color="#666"
+                      size={20}
+                      svg="&#60;?xml version=&#34;1.0&#34; encoding=&#34;utf-8&#34; ?&#62;&#10;&#60;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; xmlns:xlink=&#34;http://www.w3.org/1999/xlink&#34; width=&#34;100%&#34; height=&#34;100%&#34; viewBox=&#34;0 0 12 12&#34;&#62;&#10;\t&#60;defs&#62;&#10;\t\t&#60;clipPath id=&#34;clipPath5115394031&#34;&#62;&#10;\t\t\t&#60;path d=&#34;M0 0L12 0L12 12L0 12L0 0Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0 0)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;/clipPath&#62;&#10;\t&#60;/defs&#62;&#10;\t&#60;g clip-path=&#34;url(#clipPath5115394031)&#34;&#62;&#10;\t\t&#60;path d=&#34;M1.67816 6.0308L1.67816 2.65931C1.67816 2.45221 1.51027 2.28431 1.30316 2.28431C1.09606 2.28431 0.928164 2.45221 0.928164 2.65931L0.928164 6.0308Q0.936713 6.57501 1.32039 6.95267Q1.70406 7.33034 2.24242 7.33034Q2.78078 7.33034 3.16446 6.95267Q3.54813 6.57501 3.55663 6.03672L3.55973 1.61191Q3.56967 0.794366 2.99203 0.209683Q2.4144 -0.375 1.5925 -0.375Q0.770602 -0.375 0.192968 0.209683Q-0.384667 0.794366 -0.374698 1.6162L-0.374726 6.06056Q-0.390517 7.14867 0.377193 7.92757Q1.1449 8.70648 2.23856 8.70648Q3.33221 8.70648 4.09992 7.92758Q4.86763 7.14867 4.8518 6.05513L4.85184 1.90322C4.85184 1.69611 4.68394 1.52822 4.47684 1.52822C4.26973 1.52822 4.10184 1.69611 4.10184 1.90322L4.10188 6.06599Q4.11316 6.84572 3.56576 7.4011Q3.01836 7.95648 2.23856 7.95648Q1.45875 7.95648 0.911348 7.4011Q0.363947 6.84572 0.375274 6.06056L0.375246 1.60711Q0.369078 1.09857 0.726504 0.736788Q1.08393 0.375 1.5925 0.375Q2.10107 0.375 2.4585 0.736788Q2.81592 1.09858 2.80973 1.6114L2.80673 6.02487Q2.80308 6.25601 2.63833 6.41817Q2.47359 6.58034 2.24242 6.58034Q2.01126 6.58034 1.84651 6.41817Q1.68177 6.25601 1.67816 6.0308Z&#34; fill-rule=&#34;evenodd&#34; transform=&#34;matrix(1 0 0 1 3.76121 1.84069)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t&#60;/g&#62;&#10;&#60;/svg&#62;&#10;"
+                    />
+                  </View>
+                  <View className="ml-[5px]">
+                    <Text className="text-xs text-[#666666]">2个附件</Text>
+                  </View>
+                </View>
+                <View className="mt-[10px] flex flex-row">
+                  <View className="flex flex-row items-center">
+                    <View className="w-[28px] h-[28px] bg-[#add2ff] rounded-[15px] flex flex-col justify-center items-center">
+                      <Text className="text-sm text-[#3b82f6]">李</Text>
+                    </View>
+                    <View className="ml-[10px]">
+                      <Text className="text-sm text-[#666666]">李明</Text>
+                    </View>
+                  </View>
+                  <View className="flex-row flex-1 flex justify-end">
+                    <View
+                      __hidePh={true}
+                      onClick={e => this.jumpToTheDetailsPage(e)}
+                      className="bg-[#f3f4f6] w-[40px] h-[40px] rounded-[20px] flex flex-col justify-center items-center mr-[10px]"
+                    >
+                      <AtIcon
+                        color="#666"
+                        size={20}
+                        svg="&#60;?xml version=&#34;1.0&#34; encoding=&#34;utf-8&#34; ?&#62;&#10;&#60;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; xmlns:xlink=&#34;http://www.w3.org/1999/xlink&#34; width=&#34;100%&#34; height=&#34;100%&#34; viewBox=&#34;0 0 20 20&#34;&#62;&#10;\t&#60;defs&#62;&#10;\t\t&#60;clipPath id=&#34;clipPath0894376390&#34;&#62;&#10;\t\t\t&#60;path d=&#34;M0 0L20 0L20 20L0 20L0 0Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0 0)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;/clipPath&#62;&#10;\t&#60;/defs&#62;&#10;\t&#60;g clip-path=&#34;url(#clipPath0894376390)&#34;&#62;&#10;\t\t&#60;circle cx=&#34;2.5&#34; cy=&#34;2.5&#34; r=&#34;2.5&#34; transform=&#34;matrix(1 0 0 1 7.5 7.5)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;path d=&#34;M18.5492 5.57031C17.5156 3.97188 16.1746 2.61406 14.6715 1.64336C13.0086 0.568359 11.1727 0 9.36252 0C7.70158 0 6.06837 0.474609 4.50822 1.41055C2.9172 2.36484 1.4758 3.75898 0.223843 5.55391C0.079313 5.76135 0.00477175 5.99146 0.000219643 6.24425C-0.00433246 6.49703 0.0618755 6.72968 0.198843 6.94219C1.23048 8.55664 2.55822 9.91641 4.03791 10.8738C5.70392 11.9531 7.49689 12.5 9.36252 12.5C11.1871 12.5 13.027 11.9363 14.6828 10.8703C16.1852 9.90273 17.5235 8.53984 18.5531 6.92812C18.6852 6.72088 18.7509 6.49438 18.7501 6.24865C18.7494 6.00291 18.6825 5.7768 18.5492 5.57031ZM9.3758 10C8.34026 10 7.45638 9.63388 6.72415 8.90165C5.99191 8.16942 5.6258 7.28553 5.6258 6.25C5.6258 5.21447 5.99191 4.33058 6.72415 3.59835C7.45638 2.86612 8.34026 2.5 9.3758 2.5C10.4113 2.5 11.2952 2.86612 12.0274 3.59835C12.7597 4.33058 13.1258 5.21447 13.1258 6.25C13.1246 7.28504 12.7581 8.16851 12.0262 8.90039C11.2943 9.63228 10.4108 9.99882 9.3758 10Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0.624204 3.75)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t&#60;/g&#62;&#10;&#60;/svg&#62;&#10;"
+                      />
+                    </View>
+                    <View
+                      __hidePh={true}
+                      className="bg-[#f3f4f6] w-[40px] h-[40px] rounded-[20px] flex flex-col justify-center items-center mr-[10px]"
+                    >
+                      <AtIcon
+                        color="#666"
+                        size={20}
+                        svg="&#60;?xml version=&#34;1.0&#34; encoding=&#34;utf-8&#34; ?&#62;&#10;&#60;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; xmlns:xlink=&#34;http://www.w3.org/1999/xlink&#34; width=&#34;100%&#34; height=&#34;100%&#34; viewBox=&#34;0 0 20 20&#34;&#62;&#10;\t&#60;defs&#62;&#10;\t\t&#60;clipPath id=&#34;clipPath2557746411&#34;&#62;&#10;\t\t\t&#60;path d=&#34;M0 0L20 0L20 20L0 20L0 0Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0 0)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;/clipPath&#62;&#10;\t&#60;/defs&#62;&#10;\t&#60;g clip-path=&#34;url(#clipPath2557746411)&#34;&#62;&#10;\t\t&#60;path d=&#34;M12.7935 -0.418716L12.7938 -0.419009Q13.2343 -0.859375 13.8572 -0.859375Q14.4804 -0.859375 14.921 -0.418751L14.9505 -0.389229Q15.3907 0.0513004 15.3907 0.674075Q15.3907 1.29685 14.9502 1.7376L14.4897 2.19815Q14.4299 2.258 14.3595 2.30503Q14.2891 2.35205 14.2109 2.38444Q14.1327 2.41683 14.0497 2.43334Q13.9667 2.44986 13.882 2.44986Q13.7974 2.44986 13.7144 2.43334Q13.6314 2.41683 13.5532 2.38444Q13.475 2.35205 13.4046 2.30503Q13.3342 2.258 13.2744 2.19815L12.3327 1.25649Q12.2729 1.19661 12.2259 1.12621Q12.1789 1.05582 12.1465 0.977606Q12.1142 0.899394 12.0977 0.816373Q12.0812 0.733351 12.0812 0.64871Q12.0813 0.564069 12.0978 0.481061Q12.1144 0.398054 12.1468 0.319869Q12.1792 0.241685 12.2263 0.171328Q12.2733 0.100972 12.3332 0.0411472L12.7935 -0.418716ZM10.6665 1.70781L0.035724 12.3648Q-0.084919 12.4857 -0.150137 12.6436L-0.794278 14.203Q-0.826593 14.2812 -0.843025 14.3643Q-0.859457 14.4473 -0.859375 14.5319Q-0.859292 14.6166 -0.842699 14.6996Q-0.826106 14.7826 -0.793639 14.8607Q-0.761172 14.9389 -0.71408 15.0092Q-0.666988 15.0796 -0.607079 15.1394Q-0.547171 15.1992 -0.476749 15.2461Q-0.406327 15.2931 -0.328097 15.3254Q-0.170506 15.3905 7.45058e-09 15.3905Q0.170506 15.3905 0.328097 15.3254L1.88747 14.6812Q2.04536 14.616 2.1663 14.4954L12.8225 3.8653Q12.8825 3.80553 12.9296 3.73521Q12.9767 3.66489 13.0092 3.58673Q13.0417 3.50857 13.0583 3.42558Q13.0749 3.34259 13.075 3.25794Q13.0751 3.1733 13.0587 3.09027Q13.0423 3.00723 13.01 2.929Q12.9777 2.85076 12.9308 2.78032Q12.8838 2.70989 12.824 2.64997L11.8819 1.70781Q11.822 1.64796 11.7517 1.60094Q11.6813 1.55391 11.6031 1.52152Q11.5249 1.48913 11.4419 1.47262Q11.3589 1.45611 11.2742 1.45611Q11.1896 1.45611 11.1066 1.47262Q11.0235 1.48913 10.9453 1.52152Q10.8672 1.55391 10.7968 1.60094Q10.7264 1.64796 10.6665 1.70781Z&#34; fill-rule=&#34;evenodd&#34; transform=&#34;matrix(1 0 0 1 2.73438 2.73452)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t&#60;/g&#62;&#10;&#60;/svg&#62;&#10;"
+                      />
+                    </View>
+                    <View
+                      __hidePh={true}
+                      className="bg-[#f3f4f6] w-[40px] h-[40px] rounded-[20px] flex flex-col justify-center items-center"
+                    >
+                      <AtIcon
+                        color="#666"
+                        size={20}
+                        svg="&#60;?xml version=&#34;1.0&#34; encoding=&#34;utf-8&#34; ?&#62;&#10;&#60;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; xmlns:xlink=&#34;http://www.w3.org/1999/xlink&#34; width=&#34;100%&#34; height=&#34;100%&#34; viewBox=&#34;0 0 20 20&#34;&#62;&#10;\t&#60;defs&#62;&#10;\t\t&#60;clipPath id=&#34;clipPath0406936548&#34;&#62;&#10;\t\t\t&#60;path d=&#34;M0 0L20 0L20 20L0 20L0 0Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0 0)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;/clipPath&#62;&#10;\t&#60;/defs&#62;&#10;\t&#60;g clip-path=&#34;url(#clipPath0406936548)&#34;&#62;&#10;\t\t&#60;path d=&#34;M12.5003 6.875C11.6972 6.875 10.9206 6.51641 10.3128 5.86563C9.72178 5.23086 9.36084 4.38438 9.29717 3.48281C9.2292 2.52109 9.52256 1.63672 10.123 0.992188C10.7233 0.347657 11.5628 0 12.5003 0C13.4312 0 14.273 0.353906 14.8714 0.996875C15.4757 1.64609 15.7698 2.52891 15.7019 3.48242C15.6366 4.38516 15.2761 5.23125 14.6862 5.86523C14.08 6.51641 13.3038 6.875 12.5003 6.875ZM17.6499 13.75L7.35108 13.75C7.18329 13.7509 7.02391 13.7147 6.87293 13.6415C6.72196 13.5683 6.59488 13.4655 6.4917 13.3332C6.3823 13.1898 6.30957 13.0298 6.27353 12.853C6.23748 12.6763 6.24172 12.5006 6.28623 12.3258C6.61514 11.0051 7.42999 9.90976 8.64248 9.15859C9.71866 8.49219 11.0886 8.125 12.5003 8.125C13.9398 8.125 15.2737 8.47656 16.3562 9.14258C17.5714 9.88984 18.3874 10.9914 18.7148 12.3281C18.7587 12.503 18.7625 12.6788 18.726 12.8554C18.6896 13.032 18.6166 13.1919 18.5069 13.3352C18.4039 13.4669 18.2771 13.5691 18.1265 13.642C17.976 13.7149 17.8171 13.7509 17.6499 13.75ZM5.11749 7.03125C3.74288 7.03125 2.53428 5.75313 2.42217 4.18242C2.3667 3.37773 2.61749 2.63359 3.1253 2.08789C3.62764 1.54766 4.33624 1.25 5.11749 1.25C5.89874 1.25 6.60186 1.54922 7.10694 2.09258C7.61866 2.64258 7.86866 3.38516 7.81006 4.1832C7.69795 5.75352 6.48975 7.03125 5.11749 7.03125ZM7.68233 8.25977C6.99522 7.92383 6.10342 7.75586 5.11788 7.75586C3.96709 7.75586 2.84952 8.05586 1.97061 8.60039C0.974126 9.21875 0.303814 10.1191 0.0331106 11.2063C-0.00701755 11.3646 -0.010671 11.5239 0.0221504 11.6839C0.0549717 11.844 0.120995 11.9889 0.22022 12.1187C0.314407 12.2397 0.430431 12.3336 0.568293 12.4006C0.706154 12.4676 0.851718 12.5007 1.00499 12.5L5.34092 12.5C5.41644 12.5 5.48318 12.4758 5.54114 12.4274C5.59911 12.379 5.63485 12.3177 5.64834 12.2434C5.65264 12.2187 5.65811 12.1941 5.66436 12.1699C5.99561 10.8395 6.77178 9.71523 7.91866 8.8957C8.01024 8.82968 8.05338 8.74029 8.04808 8.62751C8.04277 8.51473 7.99143 8.42978 7.89405 8.37265C7.83272 8.33672 7.76241 8.29883 7.68233 8.25977Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0.624702 3.125)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t&#60;/g&#62;&#10;&#60;/svg&#62;&#10;"
+                      />
+                    </View>
+                  </View>
+                </View>
+                <View className="mt-[10px] flex flex-row items-center justify-between">
+                  <View>
+                    <Text className="text-sm text-[#9b9b9b]">
+                      创建于 2023-11-05
+                    </Text>
+                  </View>
+                  <View>
+                    <Text className="text-sm text-[#ef4444]">
+                      期望完成：2023-11-08
+                    </Text>
+                  </View>
+                </View>
+              </View>
+            </View>
+          </ScrollView>
+        </View>
+      </React.Fragment>
+    );
+  }
+}
+
+export default Document;

package/tests/test-app/src/pages/mobile_terminal/newWorkOrder.tsx

@@ -0,0 +1,224 @@
+/**
+ * 新建工单
+ * @type Page
+ * @screen 375w
+ * @frames app
+ */
+import React from 'react';
+import { AtIcon, HeaderBar, Image, Input, Page, Picker, ScrollView, Text, Textarea, View } from 'cross-ui';
+
+
+class IProps {}
+
+/*
+ * 数据与接口请求定义
+ */
+class IState {}
+
+class Document extends React.Component<IProps, IState> {
+  state = {};
+
+  render() {
+    return (
+      <Page statusBarMode="light" className="bg-[#f5f5f5]">
+        <HeaderBar
+          backgroundColor="#ffffff"
+          mode="light"
+          showBack={true}
+          title="新建工单"
+          titleAlign="center"
+          translucent={false}
+        />
+        <ScrollView>
+          <View className="pl-[12px] pr-[12px] mt-[12px]">
+            <View
+              __hidePh={true}
+              className="bg-[#ffffff] rounded-xl pt-[12px] pl-[12px] pr-[12px] pb-[12px]"
+            >
+              <View>
+                <View className="flex flex-row">
+                  <Text className="text-sm text-[#333]">工单标题</Text>
+                  <Text className="text-sm text-[#ef4444]">*</Text>
+                </View>
+                <View className="border border-[#e5e7eb] border-solid rounded-lg mt-[10px] pt-[5px] pb-[5px] pl-[10px] pr-[10px]">
+                  <Input
+                    type="text"
+                    confirmType="done"
+                    value=""
+                    placeholder="请输入工单标题"
+                  />
+                </View>
+              </View>
+              <View className="mt-[12px]">
+                <View className="flex flex-row">
+                  <Text className="text-sm text-[#333]">工单描述</Text>
+                </View>
+                <View className="border border-[#e5e7eb] border-solid rounded-lg mt-[10px] pt-[5px] pb-[5px] pl-[10px] pr-[10px]">
+                  <Textarea
+                    value=""
+                    placeholder="请输入工单描述"
+                    className="text-sm min-h-[80px]"
+                  />
+                </View>
+              </View>
+              <View className="mt-[12px]">
+                <View className="flex flex-row">
+                  <Text className="text-sm text-[#333]">附件</Text>
+                </View>
+                <View className="border border-[#e5e7eb] border-dashed rounded-lg mt-[10px] pt-[5px] pb-[5px] pl-[10px] pr-[10px] w-[80px] h-[80px] flex flex-col justify-center items-center">
+                  <AtIcon
+                    color="#999999"
+                    size={24}
+                    svg="&#60;?xml version=&#34;1.0&#34; encoding=&#34;utf-8&#34; ?&#62;&#10;&#60;svg xmlns=&#34;http://www.w3.org/2000/svg&#34; xmlns:xlink=&#34;http://www.w3.org/1999/xlink&#34; width=&#34;100%&#34; height=&#34;100%&#34; viewBox=&#34;0 0 24 24&#34;&#62;&#10;\t&#60;defs&#62;&#10;\t\t&#60;clipPath id=&#34;clipPath4183841512&#34;&#62;&#10;\t\t\t&#60;path d=&#34;M0 0L24 0L24 24L0 24L0 0Z&#34; fill-rule=&#34;nonzero&#34; transform=&#34;matrix(1 0 0 1 0 0)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t\t&#60;/clipPath&#62;&#10;\t&#60;/defs&#62;&#10;\t&#60;g clip-path=&#34;url(#clipPath4183841512)&#34;&#62;&#10;\t\t&#60;path d=&#34;M6.75 -0.75C6.33579 -0.75 6 -0.41421 6 0L6 6L0 6C-0.41421 6 -0.75 6.33579 -0.75 6.75C-0.75 7.16421 -0.41421 7.5 0 7.5L6 7.5L6 13.5C6 13.9142 6.33579 14.25 6.75 14.25C7.16421 14.25 7.5 13.9142 7.5 13.5L7.5 7.5L13.5 7.5C13.9142 7.5 14.25 7.16421 14.25 6.75C14.25 6.33579 13.9142 6 13.5 6L7.5 6L7.5 0C7.5 -0.41421 7.16421 -0.75 6.75 -0.75Z&#34; fill-rule=&#34;evenodd&#34; transform=&#34;matrix(1 0 0 1 5.25 5.25)&#34; fill=&#34;currentColor&#34;/&#62;&#10;\t&#60;/g&#62;&#10;&#60;/svg&#62;&#10;"
+                  />
+                </View>
+              </View>
+              <View className="mt-[12px]">
+                <View className="flex flex-row">
+                  <Text className="text-sm text-[#333]">优先级</Text>
+                </View>
+                <View className="mt-[10px] flex flex-row items-center">
+                  <View className="flex flex-row items-center pt-[5px] pb-[5px] pl-[5px] pr-[5px] mr-[10px]">
+                    <View>
+                      <View
+                        __hidePh={true}
+                        className="w-[16px] h-[16px] rounded-[10px] border border-[#3b82f6] border-solid bg-[#3b82f6] flex flex-col justify-center items-center"
+                      >
+                        <View
+                          __hidePh={true}
+                          className="w-[14px] h-[14px] border-[2px] border-[#ffffff] border-solid rounded-[7px]"
+                        />
+                      </View>
+                    </View>
+                    <View className="flex flex-row ml-[5px] mr-[5px]">
+                      <View className="w-[8px] h-[8px] bg-[#ef4444] rounded-[5px]" />
+                    </View>
+                    <View className="flex flex-row">
+                      <View>
+                        <Text className="text-sm text-[#333]">紧急</Text>
+                      </View>
+                    </View>
+                  </View>
+                  <View className="flex flex-row items-center pt-[5px] pb-[5px] pl-[5px] pr-[5px] mr-[10px]">
+                    <View>
+                      <View
+                        __hidePh={true}
+                        className="w-[16px] h-[16px] rounded-[10px] border border-[#d1d5db] border-solid"
+                      />
+                    </View>
+                    <View className="flex flex-row ml-[5px] mr-[5px]">
+                      <View className="w-[8px] h-[8px] bg-[#f97316] rounded-[5px]" />
+                    </View>
+                    <View className="flex flex-row">
+                      <View>
+                        <Text className="text-sm text-[#333]">一般</Text>
+                      </View>
+                    </View>
+                  </View>
+                  <View className="flex flex-row items-center pt-[5px] pb-[5px] pl-[5px] pr-[5px] mr-[10px]">
+                    <View>
+                      <View
+                        __hidePh={true}
+                        className="w-[16px] h-[16px] rounded-[10px] border border-[#d1d5db] border-solid"
+                      />
+                    </View>
+                    <View className="flex flex-row ml-[5px] mr-[5px]">
+                      <View className="w-[8px] h-[8px] bg-[#3b82f6] rounded-[5px]" />
+                    </View>
+                    <View className="flex flex-row">
+                      <View>
+                        <Text className="text-sm text-[#333]">不紧急</Text>
+                      </View>
+                    </View>
+                  </View>
+                </View>
+              </View>
+              <View className="mt-[12px]">
+                <View className="flex flex-row">
+                  <Text className="text-sm text-[#333]">状态</Text>
+                </View>
+                <View className="mt-[10px]">
+                  <Picker mode="selector" value="">
+                    <View className="flex flex-row h-[40px] rounded-md pr-[5px] mt-[10px] border border-[#e5e7eb] border-solid">
+                      <View className="flex-1 flex flex-col justify-center pl-[10px]">
+                        <Text className="text-sm text-[#333333]">待处理</Text>
+                      </View>
+                      <View className="flex flex-col justify-center">
+                        <AtIcon
+                          value="chevron-down"
+                          size={20}
+                          color="#e5e7eb"
+                        />
+                      </View>
+                    </View>
+                  </Picker>
+                </View>
+              </View>
+              <View className="mt-[12px]">
+                <View className="flex flex-row">
+                  <Text className="text-sm text-[#333]">期望完成日期</Text>
+                </View>
+                <View className="mt-[10px] h-[40px] border border-[#e5e7eb] border-solid rounded-md flex flex-row items-center pl-[10px]">
+                  <View>
+                    <Image
+                      src="https://cdn.appthen.com/Frk-8aFGbyfVURwxEf0k6F3ZXdQO"
+                      remote={false}
+                      fit={false}
+                      className="w-[20px] h-[20px]"
+                    />
+                  </View>
+                  <View className="ml-[10px]">
+                    <Text className="text-sm text-[#999999]">选择日期</Text>
+                  </View>
+                </View>
+              </View>
+              <View className="mt-[12px]">
+                <View className="flex flex-row">
+                  <Text className="text-sm text-[#333]">工单开始时间</Text>
+                </View>
+                <View className="mt-[10px] h-[40px] border border-[#e5e7eb] border-solid rounded-md flex flex-row items-center pl-[10px]">
+                  <View>
+                    <Image
+                      src="https://cdn.appthen.com/FoqyzS5iYqiaADVq5gUYDONZMVGm"
+                      remote={false}
+                      fit={false}
+                      className="w-[20px] h-[20px]"
+                    />
+                  </View>
+                  <View className="ml-[10px]">
+                    <Text className="text-sm text-[#999999]">选择时间</Text>
+                  </View>
+                </View>
+              </View>
+              <View className="mt-[12px]">
+                <View className="flex flex-row">
+                  <Text className="text-sm text-[#333]">工单结束时间</Text>
+                </View>
+                <View className="mt-[10px] h-[40px] border border-[#e5e7eb] border-solid rounded-md flex flex-row items-center pl-[10px]">
+                  <View>
+                    <Image
+                      src="https://cdn.appthen.com/FoqyzS5iYqiaADVq5gUYDONZMVGm"
+                      remote={false}
+                      fit={false}
+                      className="w-[20px] h-[20px]"
+                    />
+                  </View>
+                  <View className="ml-[10px]">
+                    <Text className="text-sm text-[#999999]">选择时间</Text>
+                  </View>
+                </View>
+              </View>
+            </View>
+          </View>
+          <View className="pl-[20px] pr-[20px] pb-[20px] pt-[20px]">
+            <View className="bg-[#3b82f6] pt-[12px] pb-[12px] flex flex-col justify-center items-center rounded-[10px]">
+              <Text className="text-sm text-[#ffffff]">提交</Text>
+            </View>
+          </View>
+        </ScrollView>
+      </Page>
+    );
+  }
+}
+
+export default Document;