|
|
@@ -69,6 +69,20 @@
|
|
|
<span v-else-if="item.scope === 'select'">
|
|
|
{{ computerNames(scope.row[item.prop]) }}
|
|
|
</span>
|
|
|
+ <div v-else-if="item.scope === 'img'">
|
|
|
+ <img
|
|
|
+ style="width: 50%; height: 50%"
|
|
|
+ v-if="!item.data"
|
|
|
+ src="@/assets/404_images/wuyuxaog.png"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ <el-image
|
|
|
+ v-else
|
|
|
+ style="width: 100%; height: 100%; cursor: pointer;"
|
|
|
+ :src="$methodsTools.splitImgHost(item.data)"
|
|
|
+ :preview-src-list="[ $methodsTools.splitImgHost(item.data)]"
|
|
|
+ ></el-image>
|
|
|
+ </div>
|
|
|
<span v-else>{{ scope.row[item.prop] }}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
@@ -144,6 +158,46 @@
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="上传主图" props="img">
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ width: 35%;
|
|
|
+ height: 120px;
|
|
|
+ border: 2px dashed #999;
|
|
|
+ border-radius: 28px;
|
|
|
+ line-height: 120px;
|
|
|
+ text-align: center;
|
|
|
+ "
|
|
|
+ v-if="!listData.mainImg"
|
|
|
+ >
|
|
|
+ <label for="mainImg">
|
|
|
+ <i class="el-icon-circle-plus-outline iconStsz"></i>
|
|
|
+ </label>
|
|
|
+ <input
|
|
|
+ id="mainImg"
|
|
|
+ type="file"
|
|
|
+ ref="fileMianImg"
|
|
|
+ style="display: none"
|
|
|
+ @change="uploadImg(listData.mainImg)"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <el-image
|
|
|
+ v-else
|
|
|
+ style="width: 100%"
|
|
|
+ :src="$methodsTools.splitImgHost(listData.mainImg)"
|
|
|
+ :preview-src-list="[
|
|
|
+ $methodsTools.splitImgHost(listData.mainImg),
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ </el-image>
|
|
|
+ <el-button
|
|
|
+ style="margin-top: 10px;"
|
|
|
+ :type="!listData.mainImg ? 'success' : 'danger'"
|
|
|
+ size="mini" onclick="document.querySelector('#mainImg').click()"
|
|
|
+ >
|
|
|
+ {{ !listData.mainImg ? "上传" : "删除" }}
|
|
|
+ </el-button>
|
|
|
+ </el-form-item>
|
|
|
<el-form-item label="状态" prop="status">
|
|
|
<el-radio-group v-model="listData.status">
|
|
|
<el-radio :label="1">启用</el-radio>
|
|
|
@@ -205,6 +259,13 @@ export default {
|
|
|
prop: "gradeType",
|
|
|
scope: "select",
|
|
|
},
|
|
|
+ {
|
|
|
+ label: "主图",
|
|
|
+ prop: "img",
|
|
|
+ scope: "img",
|
|
|
+ width: "160",
|
|
|
+ data: null
|
|
|
+ },
|
|
|
{
|
|
|
label: "状态",
|
|
|
prop: "status",
|
|
|
@@ -325,6 +386,35 @@ export default {
|
|
|
loadingClose() {
|
|
|
this.disabledBtn = false;
|
|
|
},
|
|
|
+ // 上传主图
|
|
|
+ uploadImg(row) {
|
|
|
+ var self = this;
|
|
|
+ var file = self.$refs.fileMianImg.files[0];
|
|
|
+ if (file === undefined) {
|
|
|
+ self.$set(self.listData, "mainImg", "");
|
|
|
+ row.data = ""
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (file.size > 2 * 1024 * 1024) {
|
|
|
+ self.$message.error("图片不得大于2MB");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ var type = self.$refs.fileMianImg.value.toLowerCase().split(".").splice(-1);
|
|
|
+ if (
|
|
|
+ type[0] != "jpg" &&
|
|
|
+ type[0] != "png" &&
|
|
|
+ type[0] != "jpeg" &&
|
|
|
+ type[0] != "gif"
|
|
|
+ ) {
|
|
|
+ self.$message.error("上传格式需为：.jpg/.png/.jpeg/gif");
|
|
|
+ self.$refs.fileMianImg.value = "";
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // this.$upload.upload(file, 0).then((res) => {
|
|
|
+ // self.listData.mainImg = res;
|
|
|
+ // console.log(self.listData.mainImg)
|
|
|
+ // });
|
|
|
+ },
|
|
|
/**
|
|
|
* 表单验证
|
|
|
*/
|
|
|
@@ -474,6 +564,11 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+.iconStsz {
|
|
|
+ font-size: 20px;
|
|
|
+ color: #67c23a;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
.active {
|
|
|
background-color: #fff !important;
|
|
|
border: 1px solid #000 !important;
|
xiexaing