feats

src/app.config.js

@@ -24,7 +24,8 @@ export default defineAppConfig({
     'pages/notice/detail/index',
     'pages/my/index',
     'pages/my/edit/index',
-    'pages/statistics/index'
+    'pages/statistics/index',
+    'pages/feedback/index'
   ],
   window: {
     // backgroundColor: '#1A7565',

src/layouts/TabBar.jsx

@@ -47,7 +47,7 @@ const feedback = {
   label: '发布',
   icon: issueIcon,
   activeIcon: issueActiveIcon,
-  page: '/pages/issue/edit/index'
+  page: '/pages/feedback/index'
 }
 const check = {
   name: 'check',

src/pages/feedback/index.config.js

@@ -0,0 +1,3 @@
+export default definePageConfig({
+  navigationBarTitleText: '新建随手拍'
+})

src/pages/feedback/index.jsx

@@ -0,0 +1,184 @@
+import React from 'react';
+import Taro from '@tarojs/taro';
+import { View } from '@tarojs/components';
+import { Button, Notify, Field, Cell, CellGroup } from '@antmjs/vantui';
+import LocType from '@/components/LocType';
+import IssueType from '@/components/IssueType';
+import OrgPicker from '@/components/OrgPicker';
+import DatePicker from '@/components/DatePicker';
+import Map from '@/components/map';
+import Uploader from '@/components/Uploader/index';
+import { getIssueStatus } from '@/utils/biz';
+import { getDateStr } from '@/utils/date';
+import mapIcon from '@/assets/icons/marker.png';
+
+export default (props) => {
+  const today = new Date();
+
+  const {
+    issue,
+    readOnly,
+    showOrg,
+    showExpireDate,
+    renderFields,
+    renderAction
+  } = props;
+
+  const [formData, setFormData] = React.useState({
+    typeId: undefined,
+    typeName: undefined,
+    locId: undefined,
+    locName: undefined,
+    location: undefined,
+    addr: undefined,
+    content: undefined,
+    attachList: [],
+  });
+  const [showLocType, setShowLocType] = React.useState(false);
+  const [showIssueType, setShowIssueType] = React.useState(false);
+  const [showOrgPicker, setShowOrgPicker] = React.useState(false);
+  const [showDatePicker, setShowDatePicker] = React.useState(false);
+  const [bizStatus, setBizStatus] = React.useState();
+  const [issueProcess, setIssueProcess] = React.useState([]);
+
+  const issueReject = React.useMemo(() => {
+    if (!issueProcess || !issueProcess.length) return {};
+
+    return issueProcess.filter(x => x.processStatus === 'reject')[0] || {};
+  }, [issueProcess]);
+
+  const onLocTypeChange = (_, it) => {
+    setFormData({
+      ...formData,
+      locId: it.typeId,
+      locName: it.name,
+    });
+    setShowLocType(false);
+  }
+
+  const onIssueTypeChange = (_, it) => {
+    setFormData({
+      ...formData,
+      typeId: it.typeId,
+      typeName: it.name,
+    });
+    setShowIssueType(false);
+  }
+
+  const onOrgChange = (_, it) => {
+    setFormData({
+      ...formData,
+      orgId: it.orgId,
+      orgName: it.name,
+    });
+    setShowOrgPicker(false);
+  }
+
+  const onDateChange = (dt) => {
+    const date = getDateStr(dt);
+    setFormData({
+      ...formData,
+      expireDate: date,
+    });
+    setShowDatePicker(false);
+  }
+
+  const setFieldChange = (field, value) => {
+    setFormData({
+      ...formData,
+      [field]: value,
+    })
+  }
+
+  React.useEffect(() => {
+    if (issue) {
+      setFormData(issue);
+      setBizStatus(getIssueStatus(issue));
+
+      // if (issue.processStatus == 'reject') {
+      //   getIssueProcess({ pageSize: 100, issueId: issue.issueId }).then(res => {
+      //     setIssueProcess(res.records || []);
+      //   })
+      // }
+    }
+  }, [issue]);
+
+  return (
+    <View>
+      {/* <LocType
+        show={showLocType}
+        value={formData.locId}
+        onCancel={() => setShowLocType(false)}
+        onChange={onLocTypeChange}
+      />
+
+      <IssueType
+        show={showIssueType}
+        value={formData.typeName}
+        onCancel={() => setShowIssueType(false)}
+        onChange={onIssueTypeChange}
+      />
+
+      <OrgPicker
+        show={showOrgPicker}
+        value={formData.orgName}
+        onCancel={() => setShowOrgPicker(false)}
+        onChange={onOrgChange}
+      />
+
+      <DatePicker
+        type="date"
+        minDate={today}
+        show={showDatePicker}
+        value={formData.expireDate}
+        onCancel={() => setShowDatePicker(false)}
+        onChange={onDateChange}
+      /> */}
+
+      <Map location={formData.location} />
+
+      <CellGroup>
+        <Field
+          placeholder="阳光丽景小区"
+          value={formData.addr}
+          leftIcon={mapIcon}
+          readonly={readOnly}
+          onChange={e => setFieldChange('addr', e.detail)}
+        />
+      </CellGroup>
+
+      <CellGroup style={{ marginTop: '20px' }}>
+
+        <Cell title="问题描述" size="large" border={false} />
+
+        <Field
+          type="textarea"
+          placeholder="请输入问题描述"
+          readonly={readOnly}
+          autosize={{ minHeight: '120px' }}
+          value={formData.content}
+          onChange={e => setFieldChange('content', e.detail)}
+        />
+      </CellGroup>
+
+      <CellGroup style={{ marginTop: '20px' }}>
+        <Cell title="拍照" size="large" border={false} />
+
+        <Cell
+          renderTitle={
+            <Uploader
+              value={formData.attachList}
+              disabled={readOnly}
+              onChange={e => setFieldChange('attachList', e)}
+            />
+          }
+        />
+      </CellGroup>
+
+      <View style={{ padding: 'var(--main-space)', background: '#fff' }}>
+        <Button block type="primary">提交</Button>
+      </View>
+
+    </View>
+  )
+}

src/pages/home/components/Head.jsx

@@ -1,9 +1,10 @@
 import React from 'react';
-import { View, Image } from '@tarojs/components';
+import { View, Image, Button } from '@tarojs/components';
 import { ActionSheet, Cell } from '@antmjs/vantui';
 import { ROLES, ROLE_CITIZEN } from '@/utils/user';
 import logo from '@/assets/image/logo.png';
 import Icon from '@/assets/icons/avatar.png';
+import { useModel } from '@/store';
 import style from './head.module.less';
 
 export default (props) => {
@@ -21,7 +22,7 @@ export default (props) => {
   }, [user, person]);
 
   const actions = React.useMemo(() => {
-    return dutyList.map(x => ({name: ROLES[x], value: x}));
+    return dutyList.map(x => ({ name: ROLES[x], value: x }));
   }, [dutyList]);
 
   const onClick = () => {
@@ -33,6 +34,13 @@ export default (props) => {
     onDutyChange(e.detail.value)
   }
 
+  const { getAvatar } = useModel('user');
+
+  const onChooseAvatar = (e) => {
+    const code = e.detail.code;
+    getAvatar(code).then(props.onSuccess);
+  }
+
   return (
     <View className={style.head}>
       <View className={style.profile}>
@@ -53,7 +61,9 @@ export default (props) => {
         />
       </View>
       <View className={style.avatar}>
-        <Image src={avatar}></Image>
+        <Button openType="chooseAvatar" onChooseAvatar={onChooseAvatar}>
+          <Image src={avatar}></Image>
+        </Button>
       </View>
     </View>
   )

src/pages/home/components/head.module.less

@@ -1,4 +1,3 @@
-
 .head {
   width: 100vw;
   height: 30vw;
@@ -21,7 +20,7 @@
       margin-top: var(--main-space);
       height: 48px;
       line-height: 46px; // 向上偏移2像素
-      background: linear-gradient(0, #E36A00, #FFA658);
+      background: linear-gradient(0, #e36a00, #ffa658);
       border-radius: 22px;
       font-size: 24px;
       text-align: center;
@@ -50,9 +49,13 @@
     border-radius: 50%;
     border: 4px solid #fff;
 
+    button {
+      background: transparent;
+      padding: 0;
+    }
     image {
       width: 100%;
-      height: 100%;
+      height: 112px;
     }
   }
 }