|
|
@@ -132,8 +132,20 @@
|
|
|
<el-input v-model="evaluateForm.content" type="textarea" :rows="4" placeholder="请输入评价内容" maxlength="200" show-word-limit />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="上传图片">
|
|
|
- <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="5">
|
|
|
- <el-icon><Plus /></el-icon>
|
|
|
+ <el-upload
|
|
|
+ class="upload-box"
|
|
|
+ :action="action"
|
|
|
+ :show-file-list="false"
|
|
|
+ :on-success="handleEvaluateUrlSuccess"
|
|
|
+ :before-upload="beforeAvatarUpload"
|
|
|
+ >
|
|
|
+ <div v-if="evaluateForm.evaluateUrl" class="upload-preview">
|
|
|
+ <el-image :src="evaluateForm.evaluateUrl" fit="cover" />
|
|
|
+ </div>
|
|
|
+ <div v-else class="upload-placeholder">
|
|
|
+ <el-icon :size="24"><Plus /></el-icon>
|
|
|
+ <span>上传</span>
|
|
|
+ </div>
|
|
|
</el-upload>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
@@ -155,9 +167,10 @@ import { getOrderList, getOrderProducts, getEvalutionList, addOrderEvaluation, g
|
|
|
import type { OrderMain, OrderStatusStats } from '@/api/pc/enterprise/orderTypes';
|
|
|
import { getDeptTree } from '@/api/pc/organization';
|
|
|
import { DeptInfo } from '@/api/pc/organization/types';
|
|
|
+const action = import.meta.env.VITE_APP_BASE_API + '/resource/oss/upload';
|
|
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
|
|
const { order_status, pay_method } = toRefs<any>(proxy?.useDict('order_status', 'pay_method'));
|
|
|
-
|
|
|
+import type { UploadProps } from 'element-plus';
|
|
|
const router = useRouter();
|
|
|
const activeMainTab = ref('0');
|
|
|
const evaluateDialogVisible = ref(false);
|
|
|
@@ -175,7 +188,7 @@ const mainTabs = [
|
|
|
];
|
|
|
|
|
|
const queryParams = reactive({ keyword: '', dateRange: null, department: '', status: '', payType: '', evaluationStatus: '' });
|
|
|
-const evaluateForm = reactive({ deliverGoods: 5, content: '', evaluationType: null });
|
|
|
+const evaluateForm = reactive({ deliverGoods: 5, content: '', evaluationType: null, evaluateUrl: '' });
|
|
|
const evaluateRules = {
|
|
|
deliverGoods: [{ required: true, message: '请选择评分', trigger: 'change' }],
|
|
|
content: [{ required: true, message: '请输入评价内容', trigger: 'blur' }]
|
|
|
@@ -292,6 +305,27 @@ const getorders = async () => {
|
|
|
}
|
|
|
};
|
|
|
|
|
|
+//上传成功
|
|
|
+const handleEvaluateUrlSuccess = (res: any) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ evaluateForm.evaluateUrl = res.data.url;
|
|
|
+ } else {
|
|
|
+ ElMessage({
|
|
|
+ message: res.msg,
|
|
|
+ type: 'warning'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ console.log(res);
|
|
|
+};
|
|
|
+
|
|
|
+const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
|
|
|
+ if (rawFile.size / 1024 / 1024 > 2) {
|
|
|
+ ElMessage.error('不能大于2MB!');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ return true;
|
|
|
+};
|
|
|
+
|
|
|
// 监听标签页切换,重新获取数据
|
|
|
watch(activeMainTab, () => {
|
|
|
getorders();
|
|
|
@@ -582,6 +616,43 @@ onMounted(() => {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+.upload-box {
|
|
|
+ :deep(.el-upload) {
|
|
|
+ width: 100px;
|
|
|
+ height: 100px;
|
|
|
+ border: 1px dashed #d9d9d9;
|
|
|
+ border-radius: 6px;
|
|
|
+ cursor: pointer;
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ &:hover {
|
|
|
+ border-color: #e60012;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .upload-placeholder {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ color: #999;
|
|
|
+ font-size: 12px;
|
|
|
+ gap: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .upload-preview {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+
|
|
|
+ .el-image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
.evaluate-product {
|
|
|
display: flex;
|
|
|
align-items: center;
|