|
|
@@ -14,10 +14,21 @@ import {
|
|
|
} from 'naive-ui';
|
|
|
|
|
|
import { useUserStore } from '/src/store/modules/users';
|
|
|
+import bgLine from '../images/bg-line.png';
|
|
|
import chioseAdd from '../images/chioseAdd.png';
|
|
|
import CSelect from '../../CSelect';
|
|
|
import { policy } from '../../upload-file/api';
|
|
|
-import { addSuggestion, getSuggestionList,sysParamConfigPage } from '../modals/api';
|
|
|
+import suggestClose from '../images/suggestClose.png';
|
|
|
+import inFront from '../images/inFront.png';
|
|
|
+import inBack from '../images/inBack.png';
|
|
|
+import submitBtn from '../images/submitBtn.png';
|
|
|
+import sealing from '../images/sealing.png'
|
|
|
+import boxBg from '../images/boxBg.png'
|
|
|
+import {
|
|
|
+ addSuggestion,
|
|
|
+ getSuggestionList,
|
|
|
+ sysParamConfigPage
|
|
|
+} from '../modals/api';
|
|
|
export default defineComponent({
|
|
|
name: 'train-update',
|
|
|
emits: ['close', 'submit'],
|
|
|
@@ -29,20 +40,20 @@ export default defineComponent({
|
|
|
clientType: 'TEACHER',
|
|
|
content: '',
|
|
|
attachmentUrls: '',
|
|
|
- type: "APP",
|
|
|
- mobileNo:userStore.getUserInfo.phone
|
|
|
+ type: 'APP',
|
|
|
+ mobileNo: userStore.getUserInfo.phone
|
|
|
});
|
|
|
const state = reactive([]) as any;
|
|
|
-
|
|
|
- const suggestionTypeList = ref([]as any)
|
|
|
+ const isubmit = ref(false)
|
|
|
+ const suggestionTypeList = ref([] as any);
|
|
|
const ossUploadUrl = `https://gyt.ks3-cn-beijing.ksyuncs.com/`;
|
|
|
const uploadRef = ref();
|
|
|
const fileListRef = ref<UploadFileInfo[]>([]);
|
|
|
const formsRef = ref();
|
|
|
const btnLoading = ref(false);
|
|
|
const tempFiileBuffer = ref();
|
|
|
- const email = ref('')
|
|
|
- const phone = ref('')
|
|
|
+ const email = ref('');
|
|
|
+ const phone = ref('');
|
|
|
const onSubmit = async () => {
|
|
|
if (!forms.suggestionTypeId) {
|
|
|
message.error('请选择反馈类型');
|
|
|
@@ -52,22 +63,25 @@ export default defineComponent({
|
|
|
message.error('请填写反馈信息');
|
|
|
return;
|
|
|
}
|
|
|
- const attachmentUrlsList = fileListRef.value.map((item:any)=>{
|
|
|
- console.log(item,'item')
|
|
|
+ const attachmentUrlsList = fileListRef.value.map((item: any) => {
|
|
|
+ console.log(item, 'item');
|
|
|
const name = item.name;
|
|
|
// const suffix = name.slice(name.lastIndexOf('.'));
|
|
|
const fileName = `${item.id + name}`;
|
|
|
const url = ossUploadUrl + fileName;
|
|
|
- return url
|
|
|
- })
|
|
|
- const attachmentUrls = attachmentUrlsList.join(',')
|
|
|
- try{
|
|
|
+ return url;
|
|
|
+ });
|
|
|
+ const attachmentUrls = attachmentUrlsList.join(',');
|
|
|
+ try {
|
|
|
+ const res = await addSuggestion({ ...forms, attachmentUrls });
|
|
|
+ isubmit.value = true;
|
|
|
+ // message.success('提交成功');
|
|
|
+ setTimeout(()=>{
|
|
|
+ emit('close');
|
|
|
+ },3000)
|
|
|
|
|
|
- const res = await addSuggestion({...forms,attachmentUrls})
|
|
|
- message.success('提交成功')
|
|
|
- emit('close')
|
|
|
- }catch(e){
|
|
|
- console.log(e)
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e);
|
|
|
}
|
|
|
console.log('onSubmit');
|
|
|
};
|
|
|
@@ -114,7 +128,7 @@ export default defineComponent({
|
|
|
key: fileName,
|
|
|
KSSAccessKeyId: data.kssAccessKeyId,
|
|
|
name: fileName
|
|
|
- })
|
|
|
+ });
|
|
|
} catch {
|
|
|
//
|
|
|
// message.error('上传失败')
|
|
|
@@ -132,142 +146,178 @@ export default defineComponent({
|
|
|
// urlList.value.push(url);
|
|
|
// onFinishAfter(options);
|
|
|
};
|
|
|
- const onRemove = async (event:any) => {
|
|
|
- console.log(event)
|
|
|
+ const onRemove = async (event: any) => {
|
|
|
+ console.log(event);
|
|
|
btnLoading.value = false;
|
|
|
};
|
|
|
|
|
|
const getTypeList = async () => {
|
|
|
try {
|
|
|
const res = await getSuggestionList({ rows: 9999, page: 1 });
|
|
|
- suggestionTypeList.value = res.data.rows;
|
|
|
+ suggestionTypeList.value = res.data.rows;
|
|
|
} catch (e) {
|
|
|
- console.log('请求报错')
|
|
|
console.log(e);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
|
|
|
- const getPhoneInfo = async ()=>{
|
|
|
-
|
|
|
|
|
|
+ const getPhoneInfo = async () => {
|
|
|
try {
|
|
|
- const {data} = await sysParamConfigPage({ page: 1, rows: 999, group: 'OTHER' });
|
|
|
- const rows = data.rows || []
|
|
|
- email.value = rows.find((item:any)=>{
|
|
|
- return item.paramName == 'customer_service_email'
|
|
|
- }).paramValue
|
|
|
- phone.value = rows.find((item:any)=>{
|
|
|
- return item.paramName == 'customer_service_phone'
|
|
|
- }).paramValue
|
|
|
+ const { data } = await sysParamConfigPage({
|
|
|
+ page: 1,
|
|
|
+ rows: 999,
|
|
|
+ group: 'OTHER'
|
|
|
+ });
|
|
|
+ const rows = data.rows || [];
|
|
|
+ email.value = rows.find((item: any) => {
|
|
|
+ return item.paramName == 'customer_service_email';
|
|
|
+ }).paramValue;
|
|
|
+ phone.value = rows.find((item: any) => {
|
|
|
+ return item.paramName == 'customer_service_phone';
|
|
|
+ }).paramValue;
|
|
|
|
|
|
- console.log( email.value , phone.value)
|
|
|
+ console.log(email.value, phone.value);
|
|
|
} catch (e) {
|
|
|
- console.log('请求报错')
|
|
|
+ console.log('请求报错');
|
|
|
console.log(e);
|
|
|
}
|
|
|
-
|
|
|
- }
|
|
|
- onMounted(()=>{
|
|
|
- getTypeList()
|
|
|
- getPhoneInfo()
|
|
|
- })
|
|
|
+ };
|
|
|
+ onMounted(() => {
|
|
|
+ getTypeList();
|
|
|
+ getPhoneInfo();
|
|
|
+ });
|
|
|
return () => (
|
|
|
- <div class={styles.updatePassword}>
|
|
|
- <NForm
|
|
|
- labelAlign="right"
|
|
|
- labelPlacement="left"
|
|
|
- labelWidth={'auto'}
|
|
|
- ref={formsRef}
|
|
|
- model={forms}
|
|
|
- requireMarkPlacement="left">
|
|
|
- {/* <NFormItem
|
|
|
+ <div class={styles.suggestOption}>
|
|
|
+ <div class={[styles.updatePassword,isubmit.value?styles.isAni:'']}>
|
|
|
+ <div class={[styles.formWrap,isubmit.value?styles.isAni:'']}>
|
|
|
+ <NImage
|
|
|
+ class={styles.closeBtn}
|
|
|
+ src={suggestClose}
|
|
|
+ previewDisabled onClick={() => emit('close')}></NImage>
|
|
|
+ <NImage class={styles.bgLine} src={bgLine} previewDisabled></NImage>
|
|
|
+ <h2 class={styles.formTitle}>意见反馈</h2>
|
|
|
+ <div class={styles.formWrapInfo}>
|
|
|
+ <NForm
|
|
|
+ labelAlign="right"
|
|
|
+ labelPlacement="left"
|
|
|
+ labelWidth={'auto'}
|
|
|
+ ref={formsRef}
|
|
|
+ model={forms}
|
|
|
+ requireMarkPlacement="left">
|
|
|
+ {/* <NFormItem
|
|
|
path="currentClass"
|
|
|
label=""
|
|
|
class={styles.phoneContainer}>
|
|
|
<p class={styles.phone}>{forms.mobile}</p>
|
|
|
</NFormItem> */}
|
|
|
|
|
|
- <NFormItem
|
|
|
- rule={[
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请选择反馈类型'
|
|
|
- }
|
|
|
- ]}
|
|
|
- path="suggestionTypeId">
|
|
|
- <CSelect
|
|
|
- value-field="id"
|
|
|
- label-field="name"
|
|
|
- style={{ width: '357px!important' }}
|
|
|
- {...({
|
|
|
- options: suggestionTypeList.value,
|
|
|
- placeholder: '反馈类型(必选)',
|
|
|
- clearable: true,
|
|
|
- inline: true
|
|
|
- } as any)}
|
|
|
- v-model:value={forms.suggestionTypeId}></CSelect>
|
|
|
- </NFormItem>
|
|
|
- <NFormItem path='content' rule={[
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请输入反馈内容'
|
|
|
- }
|
|
|
- ]}>
|
|
|
- <NInput
|
|
|
- class={styles.countInput}
|
|
|
- type="textarea"
|
|
|
- rows={5}
|
|
|
- placeholder={'请输入反馈内容'}
|
|
|
- maxlength={500}
|
|
|
- showCount
|
|
|
- v-model:value={forms.content}></NInput>
|
|
|
- </NFormItem>
|
|
|
- <NFormItem>
|
|
|
- <NUpload
|
|
|
- list-type="image-card"
|
|
|
- accept=".jpg,jpeg,.png"
|
|
|
- v-model:fileList={fileListRef.value}
|
|
|
- ref={uploadRef}
|
|
|
- multiple={true}
|
|
|
- max={5}
|
|
|
- data={(file: any) => {
|
|
|
- const item = state.find((c: any) => {
|
|
|
- return c.id == file.file.id;
|
|
|
- });
|
|
|
- const { id, tempFiileBuffer, ...more } = item;
|
|
|
- return { ...more };
|
|
|
- }}
|
|
|
- showPreviewButton
|
|
|
- action={ossUploadUrl}
|
|
|
- onBeforeUpload={(options: any) => onBeforeUpload(options)}
|
|
|
- onRemove={(options: any) => onRemove(options)}
|
|
|
- onFinish={(options: any) => onFinish(options)}>
|
|
|
- <div class={styles.addInput}>
|
|
|
- <NImage previewDisabled src={chioseAdd}></NImage>
|
|
|
- 点击上传
|
|
|
- </div>
|
|
|
- </NUpload>
|
|
|
- </NFormItem>
|
|
|
- {
|
|
|
- (phone.value || email.value)? <NFormItem>
|
|
|
- <div class={styles.messageWrap}>
|
|
|
- {phone.value? <p>客服电话：{phone.value}</p>:null}
|
|
|
- {email.value? <p>邮箱：{email.value}</p>:null}
|
|
|
+ <NFormItem
|
|
|
+ rule={[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请选择反馈类型'
|
|
|
+ }
|
|
|
+ ]}
|
|
|
+ path="suggestionTypeId">
|
|
|
+ <CSelect
|
|
|
+ class={styles.suggestSelect}
|
|
|
+ value-field="id"
|
|
|
+ label-field="name"
|
|
|
+ style={{ width: '227px!important' }}
|
|
|
+ {...({
|
|
|
+ options: suggestionTypeList.value,
|
|
|
+ placeholder: '反馈类型(必选)',
|
|
|
+ clearable: true,
|
|
|
+ inline: true
|
|
|
+ } as any)}
|
|
|
+ v-model:value={forms.suggestionTypeId}></CSelect>
|
|
|
+ </NFormItem>
|
|
|
+ <NFormItem
|
|
|
+ path="content"
|
|
|
+ rule={[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请输入反馈内容'
|
|
|
+ }
|
|
|
+ ]}>
|
|
|
+ <NInput
|
|
|
+ class={styles.countInput}
|
|
|
+ type="textarea"
|
|
|
+ rows={5}
|
|
|
+ placeholder={'请输入反馈内容'}
|
|
|
+ maxlength={200}
|
|
|
+ resizable={false}
|
|
|
+ showCount
|
|
|
+ v-model:value={forms.content}></NInput>
|
|
|
+ </NFormItem>
|
|
|
+ <NFormItem>
|
|
|
+ <NUpload
|
|
|
+ list-type="image-card"
|
|
|
+ accept=".jpg,jpeg,.png"
|
|
|
+ v-model:fileList={fileListRef.value}
|
|
|
+ ref={uploadRef}
|
|
|
+ multiple={true}
|
|
|
+ max={5}
|
|
|
+ data={(file: any) => {
|
|
|
+ const item = state.find((c: any) => {
|
|
|
+ return c.id == file.file.id;
|
|
|
+ });
|
|
|
+ const { id, tempFiileBuffer, ...more } = item;
|
|
|
+ return { ...more };
|
|
|
+ }}
|
|
|
+ showPreviewButton
|
|
|
+ action={ossUploadUrl}
|
|
|
+ onBeforeUpload={(options: any) => onBeforeUpload(options)}
|
|
|
+ onRemove={(options: any) => onRemove(options)}
|
|
|
+ onFinish={(options: any) => onFinish(options)}>
|
|
|
+ <div class={styles.addInput}>
|
|
|
+ <NImage previewDisabled src={chioseAdd}></NImage>
|
|
|
+ <p> 点击上传图片</p>
|
|
|
+ <p>(最多五张)</p>
|
|
|
+ </div>
|
|
|
+ </NUpload>
|
|
|
+ </NFormItem>
|
|
|
+ {/* {phone.value || email.value ? (
|
|
|
+ <NFormItem>
|
|
|
+ <div class={styles.messageWrap}>
|
|
|
+ {phone.value ? <p>客服电话：{phone.value}</p> : null}
|
|
|
+ {email.value ? <p>邮箱：{email.value}</p> : null}
|
|
|
+ </div>
|
|
|
+ </NFormItem>
|
|
|
+ ) : null} */}
|
|
|
|
|
|
- </div>
|
|
|
- </NFormItem>:null
|
|
|
- }
|
|
|
+ {/* <NSpace class={styles.updateBtnGroup}>
|
|
|
+ <NButton
|
|
|
+ strong
|
|
|
+ type="default"
|
|
|
+ round
|
|
|
+ onClick={() => emit('close')}>
|
|
|
+ 取消
|
|
|
+ </NButton>
|
|
|
+ <NButton strong type="primary" round onClick={() => onSubmit()}>
|
|
|
+ 确认
|
|
|
+ </NButton>
|
|
|
+ </NSpace> */}
|
|
|
+ </NForm>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class={[styles.inBack,isubmit.value?styles.isAni:'']}>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ {/* <div class={styles.inBackBottom}></div> boxBg */}
|
|
|
+ <NImage src={boxBg} class={styles.inBackBottom} previewDisabled></NImage>
|
|
|
+ <NImage src={inFront} class={styles.inFront} previewDisabled></NImage>
|
|
|
+ <NImage src={sealing} class={[styles.sealing,isubmit.value?styles.isAni:'']} previewDisabled></NImage>
|
|
|
+ {!isubmit.value?<>
|
|
|
+ <NImage src={submitBtn} onClick={()=>{onSubmit()}} class={styles.submitBtn} previewDisabled></NImage>
|
|
|
+ <div class={styles.messageWrap}>
|
|
|
+ {phone.value ? <p>客服电话：{phone.value}</p> : null}
|
|
|
+ {email.value ? <p>邮箱：{email.value}</p> : null}
|
|
|
+ </div>
|
|
|
+ </>:null}
|
|
|
|
|
|
- <NSpace class={styles.updateBtnGroup}>
|
|
|
- <NButton strong type="default" round onClick={() => emit('close')}>
|
|
|
- 取消
|
|
|
- </NButton>
|
|
|
- <NButton strong type="primary" round onClick={() => onSubmit()}>
|
|
|
- 确认
|
|
|
- </NButton>
|
|
|
- </NSpace>
|
|
|
- </NForm>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
);
|
|
|
}
|
mo
