feats

src/pages/check/loc/edit/components/Footer/index.jsx

@@ -0,0 +1,55 @@
+import React from 'react';
+import Taro from '@tarojs/taro';
+import { View } from '@tarojs/components';
+import { Button } from '@antmjs/vantui';
+import QuSelect from '../QuSelect';
+import style from './style.module.less';
+
+export default (props) => {
+  const { value, list, readonly, onChange, onSubmit } = props;
+
+  const [isPrev, isFinished] = React.useMemo(() => {
+    const total = list?.length || 0;
+
+    return [
+      value > 0,
+      value >= total - 1,
+    ]
+  }, [value, list]);
+
+  const onPrev = () => {
+    onChange(value - 1);
+  }
+
+  const onNext = () => {
+    if (isFinished) {
+      onSubmit()
+    } else {
+      onChange(value + 1);
+    }
+  }
+  
+  return (
+    <View className={style['qu-footer-wrapper']}>
+      {
+        !readonly && value > -1 && (
+          <View className={style['qu-footer-sel']}>
+            <QuSelect
+              value={value}
+              list={list}
+              onChange={onChange}
+            />
+          </View>
+        )
+      }
+      <View className={style['qu-footer-act']}>
+        {
+          isPrev && <Button type="primary" block plain hairline style={{flex: 1}} onClick={onPrev}>上一题</Button>
+        }
+        <Button type="primary" block style={{flex: 1, marginLeft: isPrev ? '1em' : 0 }} onClick={onNext}>
+          {isFinished ? '提交' : (value == -1 ? '开始测评' : '下一题')}
+        </Button>
+      </View>
+    </View>
+  )
+}

src/pages/check/loc/edit/components/Footer/style.module.less

@@ -0,0 +1,21 @@
+
+.qu-footer-wrapper {
+  width: 100%;
+  overflow: hidden;
+  padding: var(--main-space) 0;
+  background: #fff;
+  display: flex;
+  align-items: center;
+
+  .qu-footer-sel {
+    flex: none;
+    margin-right: 2em;
+  }
+
+  .qu-footer-act {
+    flex: 1;
+    display: flex;
+    overflow: hidden;
+    padding: 0 var(--main-space);
+  }
+}

src/pages/check/loc/edit/components/FormTpl/index.jsx

@@ -1,20 +0,0 @@
-import React from 'react';
-import Taro from '@tarojs/taro';
-import { View, ScrollView } from '@tarojs/components';
-import VABC from '@/components/VABC';
-
-export default (props) => {
-  const { action } = props;
-  
-  return (
-    <VABC
-      footer={(
-        <View style={{padding: 'var(--main-space)'}}>{action}</View>
-      )}
-    >
-      <ScrollView scrollY style={{ height: '100%' }}>
-        {props.children}
-      </ScrollView>
-    </VABC>
-  )
-}

src/pages/check/loc/edit/components/LocForm.jsx

@@ -1,52 +1,58 @@
 import React from 'react';
 import Taro from '@tarojs/taro';
 import { View } from '@tarojs/components';
-import { CellGroup, Cell, Field, Button } from '@antmjs/vantui';
+import { CellGroup, Cell, Field } from '@antmjs/vantui';
 import Map from '@/components/map';
+import { getTaCheckItemAnswer } from '@/services/tacheckitem';
 import mapIcon from '@/assets/icons/marker.png';
-import FormTpl from './FormTpl/index';
 
 export default (props) => {
+  const { checkItemInfo, answer, readonly, onChange, onLoadingChange } = props;
 
-  const { detail, onDetailChange, onClick } = props;
-
-  const [loc, setLoc] = React.useState();
+  const setLoading = (v) => {
+    if (onLoadingChange) {
+      onLoadingChange(v)
+    }
+  }
   
   const setFieldChange = (key, val) => {
-    onDetailChange({
-      ...(detail || {}),
+    onChange({
+      ...answer || {},
       [key]: val,
     })
   }
 
+  // 获取答题主记录信息
   React.useEffect(() => {
-    if (detail && loc) {
-      onDetailChange({
-        ...detail,
-        location: loc,
-      })
+    if (checkItemInfo?.itemId) {
+      setLoading(true);
+      getTaCheckItemAnswer(checkItemInfo?.itemId).then((res) => {
+        if (res) {
+          onChange(res);
+        }
+        setLoading(false);
+      }).catch(() => {
+        setLoading(false);
+      });
     }
-  }, [detail, loc]);
+  }, [checkItemInfo?.itemId])
   
   return (
-    <FormTpl
-      action={(
-        <Button block type="primary" onClick={onClick}>下一步</Button>
-      )}
-    >
-      <Map onLocChange={setLoc} />
+    <View>
+      <Map location={answer?.location} onLocChange={e => !readonly && setFieldChange('location', e)} />
       <CellGroup>
         <Cell
           title="点位"
-          value={detail?.name}
+          value={checkItemInfo?.name}
         />
         <Field
+          readonly={readonly}
           placeholder="请输入地址"
-          value={detail?.addr}
+          value={answer?.addr}
           leftIcon={mapIcon}
           onChange={e => setFieldChange('addr', e.detail)}
         />
       </CellGroup>
-    </FormTpl>
+    </View>
   )
 }

src/pages/check/loc/edit/components/QuSelect/index.jsx

@@ -15,14 +15,12 @@ const Bar = (props) => {
   }
 
   return (
-    <Cell onClick={handleClick}>
-      <View className={style['qu-board-title']}>
-        <Icon name="weapp-nav" size={60} color="var(--main-bg-color)" />
-        <Text>{cursor + 1}</Text>
-        <Text> / </Text>
-        <Text>{total}</Text>
-      </View>
-    </Cell>
+    <View className={style['qu-board-title']} onClick={handleClick}>
+      <Icon name="weapp-nav" size={60} color="var(--main-bg-color)" />
+      <Text>{cursor + 1}</Text>
+      <Text> / </Text>
+      <Text>{total}</Text>
+    </View>
   )
 }
 
@@ -53,7 +51,7 @@ export default (props) => {
                 const cls = [
                   style['qu-board-bd-item'],
                   it?.finished ? style['qu-board-bd-active'] : false,
-                ].filter(Boolean).join('-')
+                ].filter(Boolean).join(' ')
 
                 return (
                   <RatioView key={inx}>

src/pages/check/loc/edit/components/QuSelect/style.module.less

@@ -1,6 +1,5 @@
 .qu-board-bar {
-  background: #fff;
-  border-top: 1px solid rgba(0, 0, 0, 0.12);
+  display: inline-block;
 }
 
 .qu-board-title {
@@ -8,10 +7,11 @@
   color: #999;
   font-weight: bold;
   display: flex;
-  justify-content: flex-end;
   align-items: center;
+  padding: 0 var(--main-space);
 
   & > text {
+    line-height: 3em;
     &:first-of-type {
       margin-left: 0.6em;
     }

src/pages/check/loc/edit/components/Question.jsx

@@ -4,77 +4,67 @@ import { View, RichText, Text } from '@tarojs/components';
 import { CellGroup, Cell, Field, Radio, RadioGroup, Button } from '@antmjs/vantui';
 import Uploader from '@/components/Uploader/index';
 import { getTaCheckAnswerItem } from '@/services/tacheckansweritem';
-import FormTpl from './FormTpl/index';
 
-const actStyle = {
-  display: 'flex',
-  width: '100%',
-}
 
 export default (props) => {
+  const { quInfo, answerItem, readonly, onChange, onLoadingChange } = props;
 
-  const { detail, readonly, cursor, total , onChange, onPrev, onNext } = props;
-
-  const [isPrev, isFinished] = React.useMemo(() => {
-    return [
-      cursor > 0,
-      cursor >= total - 1,
-    ]
-  }, [cursor, total])
-
-  const [answer, setAnswer] = React.useState();
-
-  const onSubmit = () => {
-    onChange(answer);
-    onNext();
+  const setLoading = (v) => {
+    if (onLoadingChange) {
+      onLoadingChange(v);
+    }
   }
 
   const setFieldChange = (key, val) => {
     if (readonly) return;
 
-    setAnswer({
-      ...(answer || {}),
+    onChange({
+      ...(answerItem || {}),
+      quId: quInfo.quId,
       [key]: val,
     })
   }
 
   React.useEffect(() => {
-    if (detail?.quId) {
-      getTaCheckAnswerItem({ quId: detail.quId, isMine: true }).then(res => {
-        setAnswer(res && res.length ? res[0] : undefined)
-      })
-    } else {
-      setAnswer(undefined)
+    if (quInfo?.quId) {
+      setLoading(true);
+      getTaCheckAnswerItem({ quId: quInfo.quId, isMine: true }).then(res => {
+        onChange(res && res.length ? res[0] : {});
+        setLoading(false);
+      }).catch(() => {
+        setLoading(false);
+      });
     }
-  }, [detail]);
+  }, [quInfo?.quId]);
   
   return (
-    <FormTpl
-      action={(
-        <View style={actStyle}>
-          {
-            isPrev && <Button type="default" block style={{flex: 1}} onClick={onPrev}>上一题</Button>
-          }
-          <Button type="primary" block style={{flex: 1, marginLeft: isPrev ? '1em' : 0 }} onClick={onSubmit}>
-            {isFinished ? '提交' : '下一题'}
-          </Button>
-        </View>
-      )}
-    >
-      <RadioGroup value={answer?.answerCode}>
+    <View>
+      <RadioGroup value={answerItem?.answerCode}>
         <CellGroup>
-          <Cell title="测评内容" />
           <Cell
             border={false}
             renderTitle={(
-              <View>
-                <Text>{detail?.sortNo}</Text>
-                <Text>{detail?.title}</Text>
+              <View style={{fontWeight: 'bold'}}>
+                <Text>{quInfo?.sortNo}、</Text>
+                <Text>{quInfo?.title}</Text>
               </View>
             )}
           />
           {
-            (detail?.answerList || []).map((it) => {              
+            quInfo?.quType == 'fill' && (
+              <Field
+                label="答案:"
+                clearable
+                readonly={readonly}
+                value={answerItem?.answer}
+                placeholder="填写数字"
+                renderButton={quInfo?.fillUnit}
+                onChange={(e) => setFieldChange('answer', e.detail - 0)}
+              />
+            )
+          }
+          {
+            (quInfo?.answerList || []).map((it) => {              
               return (
                 <Cell
                   key={it.answerId}
@@ -93,7 +83,7 @@ export default (props) => {
         <Cell title="测评标准" />
         <Cell
           renderTitle={
-            <RichText nodes={detail?.stand} />
+            <RichText nodes={quInfo?.stand} />
           }
         />
       </CellGroup>
@@ -104,12 +94,12 @@ export default (props) => {
           renderTitle={
             <Uploader
               disabled={readonly}
-              value={answer?.attachList}
+              value={answerItem?.attachList}
               onChange={e => setFieldChange('attachList',e)}
             />
           }
         />
       </CellGroup>
-    </FormTpl>
+    </View>
   )
 }

src/pages/check/loc/edit/index.jsx

@@ -1,13 +1,15 @@
 import React from 'react';
 import Taro from '@tarojs/taro';
 import { View } from '@tarojs/components';
+import { Notify } from '@antmjs/vantui';
 import Page from '@/layouts/index';
-import { getTaCheckItemById, preCheck } from '@/services/tacheckitem';
+import { getTaCheckItemById, preCheck, getTaCheckItemAnswer } from '@/services/tacheckitem';
 import { getTaCheckItemQu } from '@/services/tacheckitemqu';
 import VABC from '@/components/VABC';
+import { ROLE_INSPECTOR } from '@/utils/user';
 import LocForm from './components/LocForm';
 import Question from './components/Question';
-import QuSelect from './components/QuSelect';
+import Footer from './components/Footer/index';
 
 export default (props) => {
 
@@ -15,30 +17,108 @@ export default (props) => {
   const { id } = router.params;
 
   const [loading, setLoading] = React.useState(false);
+  const [readonly, setReadonly] = React.useState(false);
   const [checkItemInfo, setCheckItemInfo] = React.useState();
   const [quList, setQuList] = React.useState([]);
   const [index, setIndex] = React.useState(-1);
+  const [answer, setAnswer] = React.useState();
 
-  const onPreFormSubmit = () => {
-    setIndex(0);
+  const onIndexChange = (n) => {
+    if (index == -1 && n != -1) {
+      if (!readonly) {
+        if (!answer?.addr) {
+          Notify.show({
+            message: '请填写地址',
+            type: 'warning',
+          })
+          return;
+        }
+        if (!answer?.location) {
+          Notify.show({
+            message: '未能获取定位信息, 请重试',
+            type: 'warning',
+          })
+          return;
+        }
+      }
+    }
+
+    setIndex(n);
   }
 
-  const onIndexChange = (t, n) => {
-    // eslint-disable-next-line no-restricted-globals
-    if (isNaN(t)) {
-      setIndex(index + n);
+  const onAnswerItemChange = (answerItem, quInfo) => {
+    const an = {...(answer || {})}
+    const answerItemList = an.answerItemList || []
+
+    if ((answerItem.answerCode || answerItem.answer) &&
+      answerItem.attachList?.length) {
+        // 说明这一题已经回答完毕
+        quInfo.finished = true
+      } else {
+        quInfo.finished = false
+      }
+    
+    // 更新问题列表中是否作答的标志位
+    setQuList(quList.map(x => x.quId == quInfo.quId ? quInfo : x));
+
+    if (answerItemList.length) {
+      let found = false;
+      an.answerItemList = answerItemList.map(x => {
+        if (x.quId == answerItem.quId) {
+          found = true;
+          return answerItem;
+        } else {
+          return x;
+        }
+      });
+
+      if (!found) {
+        answerItemList.push(answerItem);
+        an.answerItemList = answerItemList;
+      }
     } else {
-      setIndex(t);
+      answerItemList.push(answerItem);
+      an.answerItemList = answerItemList;
     }
+
+    setAnswer(an);
+  }
+
+  // 作答
+  const onSubmit = () => {
+
   }
 
   React.useEffect(() => {
     setLoading(true);
-    preCheck(id, { noSuccesTip: true }).then(() => {
+    preCheck(id, { noSuccesTip: true }).then((checkRes) => {
+      if (checkRes.errorCode < 0) {
+        Notify.show({
+          message: checkRes.message,
+          type: 'warning',
+        })
+
+        Taro.navigateBack({delta: 1})
+        return;
+      }
+
+      if (checkRes.errorCode > 0) {
+        setReadonly(true);
+        // Notify.show({
+        //   message: checkRes.message,
+        //   type: 'warning',
+        // })
+      }
+
+      // 查询当前测评点位(问卷)主记录
       getTaCheckItemById(id).then(res => {
         setCheckItemInfo(res);
       });
+      
+      // 查询我的答案
+      getTaCheckItemAnswer(id).then(setAnswer);
   
+      // 查询当前测评主记录的所有问题
       getTaCheckItemQu({pageSize: 200, itemId: id}).then(res => {
         setLoading(false);
         setQuList(res.records || []);
@@ -51,34 +131,50 @@ export default (props) => {
   }, [id]);
   
   return (
-    <Page loading={loading}>
+    <Page loading={loading} roles={[ROLE_INSPECTOR]}>
       <VABC
-        footer={
-          index > -1 && (
-            <QuSelect
-              value={index}
-              list={quList}
-              onChnage={onIndexChange}
-            />
-          )
-        }
+        footer={(
+          <Footer
+            value={index}
+            readonly={readonly}
+            list={quList}
+            onChange={onIndexChange}
+            onSubmit={onSubmit}
+          />
+        )}
       >
       {
-        index == -1 && <LocForm detail={checkItemInfo} onDetailChange={setCheckItemInfo} onClick={onPreFormSubmit} />
+        index == -1 && (
+          <LocForm
+            readonly={readonly}
+            checkItemInfo={checkItemInfo}
+            answer={answer}
+            onChange={setAnswer}
+            onLoadingChange={setLoading}
+          />
+        )
       }
       {
-        quList.map((x, inx) => (
-          index == inx && (
-            <Question
-              key={x.quId}
-              detail={x}
-              cursor={inx}
-              total={quList?.length}
-              onPrev={() => onIndexChange(null, -1)}
-              onNext={() => onIndexChange(null, 1)}
-            />
+        quList.map((x, inx) => {
+          const answerItem = answer?.answerItemList?.filter(y => y.quId == x.quId)[0];
+
+          return (
+            index == inx && (
+              <Question
+                key={x.quId}
+                cursor={inx}
+                readonly={readonly}
+                quInfo={x}
+                answerItem={answerItem}
+                total={quList?.length}
+                onChange={e => onAnswerItemChange(e, x)}
+                onPrev={() => onIndexChange(null, -1)}
+                onNext={() => onIndexChange(null, 1)}
+                onLoadingChange={setLoading}
+              />
+            )
           )
-        ))
+        })
       }
       </VABC>
     </Page>

src/services/tacheckitem.js

@@ -29,3 +29,8 @@ export const putTaCheckItem = (id, data) => request(`/api/taCheckItem/${id}`, {
 export const deleteTaCheckItem = (id) => request(`/api/taCheckItem/${id}`, { method: 'delete' });
 
 export const preCheck = (id, opts = {}) => request(`/api/taCheckItem/${id}/answer/pre-check`, { method: 'put', ...opts });
+
+/*
+ * 获取当前答案
+ */
+export const getTaCheckItemAnswer = (id) => request(`/api/taCheckItem/${id}/answer`);